[작성자:] 김 형준

작성일자

FingerEyes-Xr, 전체 데이터 로딩하지 않고 필요한 데이터만 그때 그때 로딩해 사용하기

inputLayer는 SHP 파일을 통해 구성된 레이어임.

const cntRows = inputLayer.totalRowsCount();

for (let fid = 0; fid < cntRows; fid++) {
    const sRow = inputLayer.getShapeByFID(fid)
    const attributeValues = inputLayer.getAttributeByFID(fid)

    const pt = sRow.shapeData().representativePoint();
    const tsd = new Xr.data.TextShapeData({ x: pt.x, y: pt.y, text: attributeValues[labelFieldIndex] });
    const tgr = new Xr.data.TextGraphicRow(cntRows + fid, tsd);
    const fontSymbol = tgr.fontSymbol();

    fontSymbol.color(this.#labelSymbol.fontColor);
    fontSymbol.size(this.#labelSymbol.fontSize);
    fontSymbol.strokeColor(this.#labelSymbol.fontStrokeColor);
    fontSymbol.weight(this.#labelSymbol.bBold ? "600" : undefined);
    fontSymbol.strokeWidth(this.#labelSymbol.fontStrokeWidth);

    gl.rowSet().add(tgr);
}

4번과 5번 코드가 관련된 코드인데, attributeValues는 배열로서 해당 fid에 대한 값이 그 타입에 상관없이 문자열로 저장되어 있다.

작성일자

GLSL 코드

다음과 같은 결과를 프레그먼트 쉐이더로 작성한다면 … ? 즉, 화면의 반을 가르고 가른 영역의 중심을 원점으로 삼으며 원점을 기준으로 gl_FragCoord 지점에 대한 좌표(x,y)에 대한 각도(atan(y,x))에 대해 왼쪽 영역은 cos 값으로, 오른쪽 영역은 sin 값으로 채움.

방식은 여러가지겠지만 여기서는 2가지 구현 코드를 언급함. 첫번째는 제시된 문제를 그대로 해석해 풀이한 것.

uniform vec2 iResolution;

void main2() {
    vec2 uv = gl_FragCoord.xy / iResolution;
  
    vec2 origin = uv.x < 0.5 ? vec2(0.25, 0.5) : vec2(0.75, 0.5);
    vec2 v = uv - origin;
  
    float angle = atan(v.y, v.x);
    float c = cos(angle);
    float s = sin(angle);
    
    vec3 color = uv.x < 0.5 ? vec3(c) : vec3(s);
    
    gl_FragColor = vec4(color, 1.0);
}

두번째는 삼각함수의 원리를 이해하고 상황에 맞게 최적화해 구현한 것.

uniform vec2 iResolution;

void main() {
  vec2 uv = gl_FragCoord.xy / iResolution.xy;

  vec2 normal = uv.x > .5 ? 
    normalize(uv - vec2(0.75, 0.5)) : 
    normalize(uv - vec2(0.25, 0.5));
  
  float t = uv.x > .5 ?  normal.y : normal.x;

  gl_FragColor = vec4(vec3(t), 1.0);
}