Class BackgroundLayer

constructor

• new BackgroundLayer(id, style, layerInfo?, sourceId?): BackgroundLayer

• BackgroundLayer class의 생성자입니다.
  

  Parameters

  • id: string

    생성할 레이어의 id입니다.

  • style: BackgroundStyle

    레이어에 적용할 백그라운드 스타일입니다.

  • Optional layerInfo: LayerInfo

    레이어에 필터 옵션을 추가해 feature를 제어하거나 레이어의 zoom level 범위를 제한할 수 있습니다.

    • filter는 레이어에 대한 필터 옵션입니다. 필터는 스타일 레이어가 소스에서 렌더링하는 feature를 제어합니다. 필터 옵션의 결과가 true인 feature만 표출됩니다.
    • maxzoom은 레이어의 최대 확대 범위를 설정합니다.(6-22) 지도의 줌 레벨이 maxzoom보다 크거나 같아지는 경우 레이어는 표출되지 않습니다.
    • minzoom은 레이어의 최대 축소 범위를 설정합니다.(6-22) 지도의 줌 레벨이 minzoom보다 작아지는 경우 레이어는 표출되지 않습니다.

  • Optional sourceId: string

    레이어에 추가할 소스의 id

  Returns BackgroundLayer

style

addTo

• addTo(map): BackgroundLayer

• 지도에 레이어를 추가합니다.

  Parameters

  • map: Map

    레이어를 추가할 맵입니다.

  Returns BackgroundLayer

  this

setPaint

• setPaint(style): void

• 레이어의 페인트 옵션을 설정합니다.

  Parameters

  • style: BackgroundStylePaint

    변경할 페인트 스타일 객체입니다.

  Returns void

  Example

  backgroundLayer.setPaint({'background-color' : '#000000', 'background-opacity' : 0.5});
  Copy

setLayout

• setLayout(style): void

• 레이어의 레이아웃 옵션을 설정합니다.

  Parameters

  • style: BackgroundStyleLayout

    변경할 레이아웃 스타일 객체입니다.

  Returns void

  Example

  backgroundLayer.setLayout({'visibility' : 'visible'});
  Copy

queryRenderedFeatures

• queryRenderedFeatures(geometryOrOptions?, options?): MapGeoJSONFeature[]

• 쿼리 매개변수를 충족하는 가시적 feature을 나타내는 MapGeoJSONFeature 객체의 배열을 반환합니다.

  Parameters

  • Optional geometryOrOptions: PointLike | [PointLike, PointLike] | QueryRenderedFeaturesOptions

    type QueryRenderedFeaturesOptions = {
           layers?: string[] | undefined;
           filter?: FilterSpecification | undefined;
           availableImages?: string[] | undefined;
           validate?: boolean | undefined;
       }
    Copy

    쿼리 영역의 geometry: 경계 box를 설명하는 단일 지점 또는 남서쪽 및 북동쪽 지점. 이 매개변수(Map#queryRenderedFeatures)를 생략하는 것(즉, 인수가 없거나 옵션 인수만 있는 queryRenderedFeatures 호출)은 전체 지도 뷰포트를 포함하는 경계 box를 전달하는 것과 같습니다.

    geometryOrOptions는 QueryRenderedFeaturesOptions를 받을 수도 있습니다. 이 경우 함수가 하나의 매개변수(options)만 받는 상황을 지원하기 위함입니다.

  • Optional options: QueryRenderedFeaturesOptions

    type QueryRenderedFeaturesOptions = {
           layers?: string[] | undefined;
           filter?: FilterSpecification | undefined;
           availableImages?: string[] | undefined;
           validate?: boolean | undefined;
       }
    Copy

  Returns MapGeoJSONFeature[]

  MapGeoJSONFeature 객체의 배열입니다.

  type MapGeoJSONFeature = GeoJSONFeature & {
         layer: DistributiveOmit<LayerSpecification, "source"> & {
             source: string;
         };
         source: string;
         sourceLayer?: string | undefined;
         state: {
             [key: string]: any;
         };
     }
  Copy

  반환된 각 feature 개체의 properties 값에는 소스 feature의 속성이 포함됩니다.

  GeoJSON 소스의 경우 문자열 및 숫자 속성 값만 지원됩니다(즉, null, Array 및 Object 값은 지원되지 않음).

  각 feature에는 최상위 layer, source 및 sourceLayer 속성이 포함됩니다. layer 속성은 feature가 속한 스타일 레이어를 나타내는 객체입니다. 이 개체의 레이아웃 및 페인트 속성에는 지정된 확대/축소 수준 및 feature에 대해 완전히 평가되는 값이 포함되어 있습니다.

  현재 렌더링된 feature만 포함됩니다. 다음과 같은 일부 feature은 포함되지 않습니다.

  • visibility 속성이 none인 레이어의 feature
  • 확대/축소 범위가 현재 확대/축소 수준을 제외한 레이어의 feature
  • 텍스트 또는 아이콘 충돌로 인해 숨겨진 기호 feature.

  렌더링된 결과에 시각적으로 기여하지 않을 수 있는 feature을 포함하여 다른 모든 레이어의 feature이 포함됩니다. 예를 들어 레이어의 불투명도 또는 색상 알파 구성 요소가 0으로 설정되어 있는 feature들

  맨 위의 렌더링된 feature은 반환된 배열에 처음 나타나고 후속 feature은 내림차순 z-order로 정렬됩니다. 여러 번 렌더링되는 feature(낮은 확대/축소 수준에서 자오선을 가로지르는 래핑으로 인해)은 한 번만 반환됩니다(아래의 주의사항이 따른다).

  feature은 내부적으로 타일로 변환된 타일 벡터 데이터 또는 GeoJSON 데이터에서 가져오기 때문에 feature이 타일 경계를 넘어 분할되거나 복제될 수 있으며 그 결과 feature이 쿼리 결과에 여러 번 나타날 수 있습니다. 예를 들어 쿼리의 경계 사각형을 통과하는 고속도로가 있다고 가정합니다. 쿼리 결과는 고속도로가 다른 타일로 확장되더라도 경계 사각형을 덮는 지도 타일 내에 있는 고속도로 부분이 되며 각 지도 타일 내의 고속도로 부분은 별도의 feature으로 반환됩니다. 마찬가지로 타일 경계 근처의 포인트 feature는 타일 버퍼링으로 인해 여러 타일에 나타날 수 있습니다.

  Example

  한 지점에서 모든 feature 찾기

   let features = backgroundLayer.queryRenderedFeatures(
       [20, 35],
       { layers: ['my-layer-name'] }
   );
  Copy

  Example

  정적 경계 box 내의 모든 feature 찾기

   let features = backgroundLayer.queryRenderedFeatures(
       [[10, 20], [30, 50]],
       { layers: ['my-layer-name'] }
   );
  Copy

  Example

  포인트 주위의 경계 box 내에서 모든 feature 찾기

  let width = 10;
  let height = 20;
  let features = backgroundLayer.queryRenderedFeatures([
       [point.x - width / 2, point.y - height / 2],
       [point.x + width / 2, point.y + height / 2]
       ], { layers: ['my-layer-name'] }
   );
  Copy

  Example

  단일 레이어에서 렌더링된 모든 feature 쿼리

  let features = backgroundLayer.queryRenderedFeatures({ layers: ['my-layer-name'] });
  Copy

  See

  • 마우스 좌표 지점의 features 가져오기
  • 레이어의 features 가져오기