LineLayer
class의 생성자입니다.
생성할 레이어의 id입니다.
레이어에 그릴 feature의 스타일입니다.
그릴 line의 source입니다.
이전에 선언된 source의 id를 string
로 파라미터로 전달하거나, GeoJSONSource
, VectorSource
, LineString
, LineString[]
, MultiLineString
, MultiLineString[]
객체를 파라미터로 사용할 수 있습니다.
Optional
sourceLayer: stringVectorSource는 mvt포맷입니다. VectorSource에는 여러 Layer가 존재합니다. 해당 LineLayer에 표출될 Layer의 명을 입력합니다.
존재하지 않으면 VectorSource에 defaultLayer 속성이 있다면 그것을 사용하지만 이 프로퍼티가 더 우선순위가 높습니다.
Optional
layerInfo: LayerInfo레이어에 필터 옵션을 추가해 feature를 제어하거나 표출되는 레이어의 zoom level 범위를 제한할 수 있습니다.
Optional
source레이어에 추가할 소스의 id
생성할 레이어의 id입니다.
레이어에 그릴 feature의 스타일입니다.
그릴 line의 source입니다.
이전에 선언된 source의 id를 string
로 파라미터로 전달하거나, GeoJSONSource
, VectorSource
, LineString
, LineString[]
, MultiLineString
, MultiLineString[]
객체를 파라미터로 사용할 수 있습니다.
Optional
sourceVectorSource는 mvt포맷입니다. VectorSource에는 여러 Layer가 존재합니다. 해당 LineLayer에 표출될 Layer의 명을 입력합니다.
존재하지 않으면 VectorSource에 defaultLayer 속성이 있다면 그것을 사용하지만 이 프로퍼티가 더 우선순위가 높습니다.
Optional
layer레이어에 필터 옵션을 추가해 feature를 제어하거나 표출되는 레이어의 zoom level 범위를 제한할 수 있습니다.
레이어의 페인트 속성값을 설정합니다.
설정할 페인트 속성의 이름입니다.
설정할 페인트 속성의 값입니다.
Layer.setPaintProperty('fill-color', '#faafee');
PolygonLayer and GeoJSONSource Layer에 setPaintProperty를 사용하여 polygon의 색을 변경하는 예제
레이어의 레이아웃 속성값을 설정합니다.
설정할 레이아웃 속성의 이름입니다.
설정할 레이아웃 속성의 값입니다.
Layer.setLayoutProperty('visibility', 'none');
Filter symbols by toggling a list 토글 버튼으로 레이어를 필터링 하고 setLayoutProperty를 사용하여 visibility 속성을 변경하는 예제
지정된 스타일 레이어의 확대/축소 범위를 설정합니다. 확대/축소 범위에는 레이어가 렌더링되는 minimum zoom level
과 maximum zoom level
이 포함됩니다.
참고: 벡터 소스를 사용하는 스타일 레이어의 경우 소스 레이어의 최소 확대/축소 수준보다 낮은 확대/축소 수준에는 데이터가 없기 때문에 스타일 레이어를 렌더링할 수 없습니다. 소스 레이어의 최소 확대/축소 수준이 스타일 레이어에 정의된 최소 확대/축소 수준보다 높거나 같으면 스타일 레이어가 확대/축소 범위의 모든 확대/축소 수준에서 렌더링되지 않습니다.
설정할 최소 줌(6-22)
설정할 최대 줌(6-22)
레이어에 이벤트 리스너를 추가합니다.
수신할 이벤트 유형입니다.
boxzoomcancel
, boxzoomend
, boxzoomstart
, click
, contextmenu
, data
, dataabort
, dataloading
, dblclick
, drag
, dragend
, dragstart
, error
,
idle
, load
, mousedown
, mousemove
, mouseout
, mouseover
, move
, moveend
, movestart
, pitch
, pitchend
, pitchstart
, remove
, render
, resize
, rotate
,
rotateend
, rotatestart
, sourcedata
, sourcedataabort
, sourcedataloading
, styledata
, styledataloading
, styleimagemissing
, terrain
, tiledataloading
, touchcancel
,
touchend
, touchmove
, touchstart
, webglcontextlost
, webglcontextrestored
, wheel
, zoom
, zoomend
, zoomstart
이벤트가 발생했을 때 호출되는 콜백함수입니다.
this
// 해당 레이어를 클릭하면 클릭한 좌표의 위도, 경도가 콘솔에 출력됩니다.
Layer.on('click', (e)=>console.log(e.lngLat));
on에서 추가했던 지도 이벤트에 대한 콜백 리스너를 제거합니다.
제거할 리스너를 추가했던 이벤트 유형입니다.
제거할 이벤트 리스너(콜백함수)입니다.
this
Layer.off('click', clickEvent);
지도 이벤트가 발생했을 때 한 번만 호출되는 콜백 리스너를 추가합니다. 이벤트가 처음 발생했을 때에만 콜백 리스너가 호출됩니다.
수신할 이벤트 유형입니다.
boxzoomcancel
, boxzoomend
, boxzoomstart
, click
, contextmenu
, data
, dataabort
, dataloading
, dblclick
, drag
, dragend
, dragstart
, error
,
idle
, load
, mousedown
, mousemove
, mouseout
, mouseover
, move
, moveend
, movestart
, pitch
, pitchend
, pitchstart
, remove
, render
, resize
, rotate
,
rotateend
, rotatestart
, sourcedata
, sourcedataabort
, sourcedataloading
, styledata
, styledataloading
, styleimagemissing
, terrain
, tiledataloading
, touchcancel
,
touchend
, touchmove
, touchstart
, webglcontextlost
, webglcontextrestored
, wheel
, zoom
, zoomend
, zoomstart
이벤트가 발생했을 때 한 번만 호출되는 콜백함수입니다.
this
레이어의 페인트 옵션을 설정합니다.
변경할 페인트 스타일 객체입니다.
lineLayer.setPaint({'line-color' : '#240000', 'line-opacity' : 0.5});
레이어의 레이아웃 옵션을 설정합니다.
변경할 레이아웃 스타일 객체입니다.
lineLayer.setLayout({'line-cap': 'round', 'visibility' : 'visible'});
레이어에 포함된 source를 반환합니다.
new ktGms.layer.LineLayer().getSource();
쿼리 매개변수를 충족하는 가시적 feature을 나타내는 MapGeoJSONFeature 객체의 배열을 반환합니다.
Optional
geometryOrOptions: PointLike | [PointLike, PointLike] | QueryRenderedFeaturesOptionstype QueryRenderedFeaturesOptions = {
layers?: string[] | undefined;
filter?: FilterSpecification | undefined;
availableImages?: string[] | undefined;
validate?: boolean | undefined;
}
쿼리 영역의 geometry: 경계 box를 설명하는 단일 지점 또는 남서쪽 및 북동쪽 지점. 이 매개변수(Map#queryRenderedFeatures)를 생략하는 것(즉, 인수가 없거나 옵션 인수만 있는 queryRenderedFeatures 호출)은 전체 지도 뷰포트를 포함하는 경계 box를 전달하는 것과 같습니다.
geometryOrOptions는 QueryRenderedFeaturesOptions를 받을 수도 있습니다. 이 경우 함수가 하나의 매개변수(options)만 받는 상황을 지원하기 위함입니다.
Optional
options: QueryRenderedFeaturesOptionstype QueryRenderedFeaturesOptions = {
layers?: string[] | undefined;
filter?: FilterSpecification | undefined;
availableImages?: string[] | undefined;
validate?: boolean | undefined;
}
MapGeoJSONFeature 객체의 배열입니다.
type MapGeoJSONFeature = GeoJSONFeature & {
layer: DistributiveOmit<LayerSpecification, "source"> & {
source: string;
};
source: string;
sourceLayer?: string | undefined;
state: {
[key: string]: any;
};
}
반환된 각 feature 개체의 properties
값에는 소스 feature의 속성이 포함됩니다.
GeoJSON 소스의 경우 문자열 및 숫자 속성 값만 지원됩니다(즉, null
, Array
및 Object
값은 지원되지 않음).
각 feature에는 최상위 layer
, source
및 sourceLayer
속성이 포함됩니다.
layer
속성은 feature가 속한 스타일 레이어를 나타내는 객체입니다.
이 개체의 레이아웃 및 페인트 속성에는 지정된 확대/축소 수준 및 feature에 대해 완전히 평가되는 값이 포함되어 있습니다.
현재 렌더링된 feature만 포함됩니다. 다음과 같은 일부 feature은 포함되지 않습니다.
visibility
속성이 none
인 레이어의 feature렌더링된 결과에 시각적으로 기여하지 않을 수 있는 feature을 포함하여 다른 모든 레이어의 feature이 포함됩니다. 예를 들어 레이어의 불투명도 또는 색상 알파 구성 요소가 0으로 설정되어 있는 feature들
맨 위의 렌더링된 feature은 반환된 배열에 처음 나타나고 후속 feature은 내림차순 z-order로 정렬됩니다. 여러 번 렌더링되는 feature(낮은 확대/축소 수준에서 자오선을 가로지르는 래핑으로 인해)은 한 번만 반환됩니다(아래의 주의사항이 따른다).
feature은 내부적으로 타일로 변환된 타일 벡터 데이터 또는 GeoJSON 데이터에서 가져오기 때문에 feature이 타일 경계를 넘어 분할되거나 복제될 수 있으며 그 결과 feature이 쿼리 결과에 여러 번 나타날 수 있습니다. 예를 들어 쿼리의 경계 사각형을 통과하는 고속도로가 있다고 가정합니다. 쿼리 결과는 고속도로가 다른 타일로 확장되더라도 경계 사각형을 덮는 지도 타일 내에 있는 고속도로 부분이 되며 각 지도 타일 내의 고속도로 부분은 별도의 feature으로 반환됩니다. 마찬가지로 타일 경계 근처의 포인트 feature는 타일 버퍼링으로 인해 여러 타일에 나타날 수 있습니다.
한 지점에서 모든 feature 찾기
let features = lineLayer.queryRenderedFeatures(
[20, 35],
{ layers: ['my-layer-name'] }
);
정적 경계 box 내의 모든 feature 찾기
let features = lineLayer.queryRenderedFeatures(
[[10, 20], [30, 50]],
{ layers: ['my-layer-name'] }
);
포인트 주위의 경계 box 내에서 모든 feature 찾기
let width = 10;
let height = 20;
let features = lineLayer.queryRenderedFeatures([
[point.x - width / 2, point.y - height / 2],
[point.x + width / 2, point.y + height / 2]
], { layers: ['my-layer-name'] }
);
단일 레이어에서 렌더링된 모든 feature 쿼리
let features = lineLayer.queryRenderedFeatures({ layers: ['my-layer-name'] });
Generated using TypeDoc
맵에 LineString, MultiLineString을 그리기 위한 레이어입니다.
[LineLayer 생성 방법]
레이어를 생성하고 addTo 함수를 사용하여 맵에 레이어를 추가할 수 있습니다.
Example
See
LineLayer and VectorSource Map에 LineLayer와 VectorSource를 추가하는 예제