ol mapbox style 다운로드 -OL ol mapbox style 소스 코드 다운로드

ol mapbox style

기타 소스코드

v12.3.5

다운로드

ol-mapbox 스타일

Mapbox 스타일 사양 객체에서 OpenLayers 맵을 만듭니다.

시작하기

라이브 예제를 탐색 하여이 도서관이하는 일에 대한 인상을 받으십시오.

설치

NPM 기반 DEV 환경이있는 응용 프로그램에서 라이브러리를 사용하려면

 npm install ol-mapbox-style

이 방법을 설치하면 아래 사용 예제와 같이 OL-Mapbox 스타일 모듈을 가져 오십시오. OL-Mapbox 스타일의 독립형 빌드를 사용하려면 HTML 페이지에 'dist/olms.js'를 포함시키고 Global olms Object (예 : olms.apply() , olms.applyBackground() )에서 내보내는 기능에 액세스하십시오. . 독립형 빌드는 OpenLayers의 전체 빌드에 따라 다릅니다.

ol-mapbox 스타일> = v9에는 OpenLayers 버전> = 7이 필요합니다 .

OL-Mapbox 스타일 V8에는 OpenLayers 버전이 필요합니다.> = 6.13.0 <7 .

용법

전체 문서는 API 섹션을 참조하십시오.

아래 코드는 https:// url을 사용하여 Mapbox의 Bright V9 스타일에서 OpenLayers 맵을 만듭니다.

 import { apply } from 'ol-mapbox-style' ;

apply ( 'map' , 'https://api.mapbox.com/styles/v1/mapbox/bright-v9?access_token=YOUR_MAPBOX_TOKEN' ) ;

스타일과 소스를 레이어에만 할당하려면 applyStyle() 사용하십시오. mapbox:// URL도 지원됩니다.

 import { applyStyle } from 'ol-mapbox-style' ;
import VectorTileLayer from 'ol/layer/VectorTile.js'

const layer = new VectorTileLayer ( { declutter : true } ) ;
applyStyle ( layer , 'mapbox://styles/mapbox/bright-v9' , { accessToken : 'YOUR_MAPBOX_TOKEN' } ) ;

Mapbox Style의 background 레이어의 속성을 맵 또는 VectorTile 레이어에 적용하려면 applyBackground() 함수를 사용하십시오.

사용 가능한 저수준 API도 있습니다. 개별 OpenLayers 벡터 또는 벡터 타일 레이어에 대한 스타일 기능을 만들려면 stylefunction 모듈을 사용하십시오.

 import { stylefunction } from 'ol-mapbox-style' ;
import VectorLayer from 'ol/layer/Vector.js' ;
import VectorSource from 'ol/source/Vector.js' ;
import GeoJSON from 'ol/format/GeoJSON.js' ;

const layer = new VectorLayer ( {
  source : new VectorSource ( {
    format : new GeoJSON ( ) ,
    url : 'data/states.geojson'
  } )
} ) ;

fetch ( 'data/states.json' ) . then ( function ( response ) {
  response . json ( ) . then ( function ( glStyle ) {
    stylefunction ( layer , glStyle , 'states' ) ;
  } ) ;
} ) ;

이 저수준 API는 레이어의 소스를 생성하지 않으며 아이콘을 사용하는 스타일에 대한 스프라이트 처리를 설정하려면 추가 작업이 필요합니다.

호환성 메모

글꼴 처리

ol-mapbox-style Mapbox 스타일 사양에 정의 된대로 text-font 레이아웃 속성에 PBF/SDF 글리프를 사용할 수 없습니다. 대신 웹 글꼴에 의존합니다. A ol:webfonts 메타 데이터 속성은 스타일 객체의 루트에 설정하여 웹 폰트의 위치를 지정할 수 있습니다.

 {
  "version" : 8 ,
  "metadata" : {
    "ol:webfonts" : "https://my.server/fonts/{font-family}/{fontweight}{-fontstyle}.css"
  }
  // ...
}

대안으로, apply() 또는 applyStyle() 함수의 webfonts 옵션을 사용할 수 있습니다.

다음 자리 표시자는 템플릿 URL에서 사용할 수 있습니다.

{font-family} : CSS 글꼴 패밀리가 소문자로 변환, 공백으로 교체-, 예를 들어 Noto-Sans
{Font+Family} : CSS 글꼴 패밀리 원본의 경우, 공란이+로 대체되었습니다.
{fontweight} : CSS 글꼴 중량 (숫자), 예를 들어 400, 700
{fontstyle} : CSS 글꼴 스타일, 예 : 정상, 이탤릭체
{-fontstyle} : CSS 글꼴 스타일이 정상 이외의 다른 글꼴 스타일, 예를 들어 -정상을위한 이탈리아 또는 빈 문자열

스타일 객체에서 metadata['ol:webfonts'] 속성을 사용할 수없는 경우 FontSource 글꼴이 사용됩니다. 응용 프로그램이 CSS를 사용하여 다른 글꼴을로드 할 수도 있습니다. 브라우저에서 글꼴을 이미 사용할 수있는 경우 ol-mapbox-style 로로드하지 않습니다.

이 차이로 인해 글꼴 스택은 사양에서 정의 된 것과 약간 다르게 처리됩니다. 스타일과 무게는 1 차 글꼴에서 가져옵니다 (즉, 글꼴 스택에서 첫 번째 글꼴). 글꼴 스택의 후속 글꼴은 1 차 글꼴을 사용할 수 없거나로드하지 않은 경우에만 사용되며 기본 글꼴의 스타일과 무게와 함께 사용됩니다.

도서관 구축

 npm run build

결과 배포 파일은 dist/ Folder에 있습니다. 라이브러리가 작동하는 것을 보려면 dist/index.html 로 이동하십시오.

로컬에서 테스트를 실행하려면 실행하십시오

 npm test

브라우저의 디버깅 테스트의 경우 실행하십시오

 npm run karma

콘솔 출력 (일반적으로 http : // localhost : 9876/)에 표시된 호스트 및 포트에서 브라우저를 열고 '디버그'버튼을 클릭하여 디버그 환경으로 이동하십시오.

API

ol-mapbox 스타일 • 문서

<soindern>

색인

인터페이스

applicstyleoptions
피처 소지자
옵션
옵션

별명을 입력하십시오

자원 유형

ol-mapbox 스타일 • 문서

인터페이스 : applicStyleOptions

속성

레이어

레이어 : string []

레이어. 소스가 제공되지 않으면 제공된 ID가있는 레이어가 스타일 layers 어레이에서 사용됩니다. 모든 레이어는 동일한 소스를 사용해야합니다.

원천

출처 : string

원천. 기본값은 '' 이며 스타일의 첫 번째 소스를 사용합니다.

업데이트 소스

업데이트 소스 : boolean

Mapbox 스타일 정의의 소스에 지정된 매개 변수로 벡터 (타일) 레이어 소스를 업데이트하거나 작성하십시오.

ol-mapbox 스타일 • 문서

인터페이스 : featureIdentifier

속성

ID

ID : string | number

기능 ID.

원천

출처 : string

소스 ID.

ol-mapbox 스타일 • 문서

인터페이스 : 옵션

속성

AccessToken

AccessToken : string

맵 박스 스타일의 액세스 토큰. 이것은 mapbox:// Style URL에 제공되어야합니다. https:// 및 기타 URL의 경우 액세스 키는 스타일 URL의 마지막 쿼리 매개 변수 여야합니다.

배경

배경 : false | BackgroundColor

레이어의 배경색. 지정되지 않으면 MapBox 스타일 객체의 배경이 사용됩니다. 맵 박스 스타일의 배경이 사용되는 것을 방지하기 위해 false 로 설정하십시오.

클래스 이름

ClassName : string

레이어 요소로 설정할 CSS 클래스 이름.

declutter

Declutter : boolean

Declutter 이미지와 텍스트. Decluttering은이를 true 로 설정 한 모든 벡터 및 벡터 층의 모든 이미지 및 텍스트 스타일에 적용됩니다. 우선 순위는 레이어의 z- 인덱스, 스타일의 zIndex 및 기능의 렌더링 순서로 정의됩니다. Z- 인덱스가 높을수록 우선 순위가 높습니다. 동일한 Z- 인덱스 내에서, 다른 앞에 렌더링 된 기능은 우선 순위가 높습니다.

동일한 className 가진 레이어의 최적화 기능이 Z-Index에 관계없이 모든 레이어의 충전 및 스트로크 스타일 위로 렌더링됩니다. 이 동작을 거부하고 자체 레이어로 Declutterd 기능을 배치하려면 ol-layer 이외의 className 으로 레이어를 구성하십시오.

정도

범위 : Extent

층 렌더링의 경계 범위. 층은이 범위를 벗어나지 않습니다.

레이어

레이어 : string []

포함 된 레이어 목록으로 렌더링을 제한합니다. 모든 레이어는 동일한 벡터 소스를 공유해야합니다. 스타일이 둘 이상의 소스를 사용하는 경우 source 속성 또는 layers 속성을 사용하여 단일 벡터 소스로의 렌더링을 제한해야합니다.

지도

지도 : Map

레이어를지도에서 오버레이로 설정합니다. 맵은 레이어 컬렉션 에서이 레이어를 관리하지 않으며 레이어는 상단에 렌더링됩니다. 이것은 임시 레이어에 유용합니다. 맵에 레이어를 추가하고 맵에서 관리하는 표준 방법은 map.addLayer() 사용하는 것입니다.

Maxresolution

Maxresolution : number

이 층이 보이는 최대 해상도 (독점). maxResolution 이나 minZoom 정의되지 않으면 레이어의 maxResolution 스타일 소스의 minzoom 일치합니다.

Maxzoom

Maxzoom : number

이 레이어가 표시되는 최대 뷰 줌 레벨 (포함).

Minresolution

Minresolution : number

이 레이어가 보이는 최소 해상도 (포함).

Minzoom

Minzoom : number

이 레이어가 보이는 최소 뷰 줌 레벨 (독점). maxResolution 이나 minZoom 정의되지 않으면 레이어의 minZoom 스타일 소스의 minzoom 과 일치합니다.

불투명

불투명도 : number

불투명도 (0, 1).

예압

예압 : number

예압. 저해상도 타일을 preload 레벨까지로드하십시오. 0 예압이 없음을 의미합니다.

속성

속성 : object

임의의 관찰 가능한 특성. #get() 및 #set() 로 액세스 할 수 있습니다.

렌더 버퍼

RenderBuffer : number

렌더링 또는 히트 감지를 위해 벡터 타일에서 기능을 얻을 때 렌더러가 사용하는 타일 범위 주위에 픽셀의 버퍼. 권장 값 : 벡터 타일은 일반적으로 버퍼로 생성 되므로이 값은 중고 타일의 가장 큰 버퍼와 일치해야합니다. 최소한 가장 큰 포인트 기호 또는 선 너비의 크기 여야합니다.

렌더 머드

RenderMode : VectorTileRenderType

벡터 타일의 렌더링 모드 :

'hybrid' : 다각형 및 라인 요소는 이미지로 렌더링되므로 줌 애니메이션 중에 픽셀이 확장됩니다. 포인트 기호와 텍스트는 벡터로 정확하게 렌더링되며 회전 된 뷰에서 똑바로 유지할 수 있습니다.
'vector' : 모든 것이 벡터로 렌더링됩니다. 이 모드를 사용하여 몇 가지 렌더링 된 기능만으로 벡터 타일 레이어의 성능을 향상시킵니다 (예 : 동일한 소스를 가진 다른 레이어의 특징의 서브 세트를 강조하기위한).

렌더점

RenderOrder : OrderFunction

순서 렌더링. 렌더링하기 전에 기능을 정렬 할 때 사용할 기능. 기본적으로 기능은 생성 된 순서대로 그려집니다. 정렬을 피하기 위해 null 사용하지만 정의되지 않은 드로우 순서를 얻으십시오.

원천

출처 : string

스타일이 둘 이상의 소스를 사용하는 경우 source 속성 또는 layers 속성을 사용하여 단일 벡터 소스로의 렌더링을 제한해야합니다. source 속성은 맵 박스 스타일의 벡터 소스의 ID에 해당합니다.

스타일

StyleUrl : string

이 레이어에 사용할 맵 박스 스타일 객체의 URL. Mapbox Studio로 제작되고 Mapbox에서 호스팅 된 스타일의 경우 'Mapbox : // Styles/Your/Your 스타일'처럼 보입니다.

WHILEANIMATING 업데이트

WHILEANIMATING 업데이트 : boolean

true 로 설정되면 애니메이션 중에 기능 배치가 재현됩니다. 이는 벡터가 클리핑되지 않지만 설정은 많은 양의 벡터 데이터에 성능에 영향을 미칩니다. false 로 설정하면 애니메이션이 활성화되지 않으면 배치가 재현됩니다.

INTERACTING을 업데이트하십시오

INTERACTING을 업데이트 : boolean

true 로 설정되면 상호 작용 중에 기능 배치가 재현됩니다. 또한 updateWhileAnimating 참조하십시오.

사용 interimtileSonerRor

사용 interimtileSonerror : boolean

오류에 중간 타일을 사용하십시오.

보이는

보이는 : boolean

시계.

Zindex

Zindex : number

층 렌더링을위한 z- 인덱스. 렌더링 시간에, 층은 먼저 z-index에 의해 순서를지고 위치로 주문됩니다. undefined 경우, 맵의 layers 컬렉션에 추가되는 레이어에 대해 0의 zIndex 또는 레이어의 setMap() 메소드가 사용될 때 Infinity 에 대해 가정됩니다.

ol-mapbox 스타일 • 문서

인터페이스 : 옵션

속성

AccessToken

AccessToken : string

'mapbox : //'URL에 대한 액세스 토큰.

AccessTokenParam

accesstokenparam : string

액세스 토큰 매개 변수. 내부 사용.

getImage ()

getImage : ( arg0 , arg1 ) => string | HTMLCanvasElement | HTMLImageElement

아이콘 이름의 이미지를 반환하는 함수. 결과가 htmlimageelement 인 경우 이미로드해야합니다. 레이어는 이미지의 로딩 및 처리가 완료되면 레이어를 호출하는 데 사용될 수 있습니다. 이 기능은 스프라이트가 아닌 아이콘이나 스프라이트 아이콘을 무시하는 데 사용됩니다.

매개 변수

• arg0 : VectorLayer < VectorSource any , any > | VectorTileLayer < VectorTile any , any >

• arg1 : string

보고

string | HTMLCanvasElement | HTMLImageElement

투사

투영 : string

비표준 예측으로 작업 할 때만 유용합니다. OpenLayers에 등록 된 프로젝션 코드. 스타일의 모든 소스는이 프로젝션에서 제공되어야합니다. 프로젝션은 또한 정의 된 유효한 범위를 가져야하며, 이는 스타일의 모든 타일로드 소스에 대한 타일 그리드의 원점과 해상도를 결정하는 데 사용됩니다. 제공되는 경우 타일 및 Geojson URL의 Bbox 자리 표시자가 변경됩니다. 기본값은 {bbox-epsg-3857} 입니다. 예를 들어 EG가 EPSG:4326 으로 설정되면 Bbox 자리 표시자는 {bbox-epsg-4326} 입니다.

결의안

해상도 : number []

비표준 예측으로 작업 할 때만 유용합니다. 맵 박스 스타일에 사용 된 zoom 에 대한 해상도를 매핑하기위한 분해능.

스타일

StyleUrl : string

Mapbox GL 스타일의 URL. 상대 스프라이트 URL을 포함 할 때 객체로 제공된 스타일 또는 상대 URL에 의해 데이터를 참조하는 소스에 필요합니다.

transformRequest ()

transportRequest : ( arg0 , arg1 ) => string | void | Request | Promise < string | Request >

ol-mapbox-style 리소스를 가져 오는 방법을 제어하는 기능. URL 수정, 헤더 추가 또는 자격 증명 옵션을 설정하는 데 사용할 수 있습니다. URL 및 리소스 유형을 인수로 호출하면이 기능은 Request 또는 URL string 또는 약속을 반환해야합니다. 반품 값이 없으면 원래 요청이 수정되지 않습니다.

매개 변수

• Arg0 : string

• arg1 : ResourceType

보고

string | void | Request | Promise < string | Request >

웹 폰트

웹 폰트 : string

웹 폰트를 해결하기위한 템플릿. ol:webfonts 메타 데이터가 스타일 객체에 설정된 경우 웹 글꼴을 가져올 위치를 지정하는 데 사용할 수 있습니다. 자세한 내용은 README.md 의 getFonts() 및 "글꼴 처리"섹션을 참조하십시오.

ol-mapbox 스타일 • 문서

유형 별명 : ResourceType

ResourceType <> : "Style" | "Source" | "Sprite" | "SpriteImage" | "Tiles" | "GeoJSON"

매개 변수를 입력하십시오

ol-mapbox 스타일 • 문서

ol-mapbox 스타일

모듈

<soindern>

수업

MapBoxVectorLayer

기능

AddMapboxLayer
적용하다
응용 프로그램
응용 스타일
getfeaturestate
getlayer
getlayers
getMapboxLayer
getsource
GetStyleforLayer
RecordStylelayer
제거 맵 박스 레이어
RenderTransparent
setfeaturestate
스타일 기능
UpdatemApboxLayer
UpdatemApboxSource

참조

기본

이름 변경 및 재수출이 적용됩니다

ol-mapbox 스타일 • 문서

클래스 : MapBoxVectorLayer

Classdesc

 import { MapboxVectorLayer } from 'ol-mapbox-style' ;

단일 벡터 소스를 사용하는 맵 박스 스타일을 기반으로 한 벡터 타일 레이어. Mapbox Studio의 공유 패널에 표시된 styleUrl 및 accessToken 으로 레이어를 구성하십시오. 스타일이 둘 이상의 소스를 사용하는 경우 source 속성을 사용하여 단일 벡터 소스를 선택하십시오. 스타일로 레이어의 서브 세트를 렌더링하려면 layers 속성을 사용하십시오 (모든 레이어는 동일한 벡터 소스를 공유해야합니다). 자세한 내용은 생성자 옵션을 참조하십시오.

 const map = new Map({
  view: new View({
    center: [0, 0],
    zoom: 1,
  }),
  layers: [
    new MapboxVectorLayer({
      styleUrl: 'mapbox://styles/mapbox/bright-v9',
      accessToken: 'your-mapbox-access-token-here',
    }),
  ],
  target: 'map',
});

구성 또는로드 오류에서 레이어는 'error' 이벤트를 트리거합니다. 청취자는 문제를 진단하는 데 사용할 수있는 error 속성이있는 객체를받습니다.

참고 전체 빌드 사용자의 경우 : MapboxVectorLayer OL-Mapbox 스타일 라이브러리를로드해야합니다.

파라

옵션.

화재

모듈 : OL/이벤트/이벤트 ~ Bainevent#이벤트 : 오류

API

확장

VectorTileLayer

생성자

새로운 MapBoxVectorLayer ()

새로운 MapBoxVectorLayer ( options ) : MapboxVectorLayer

매개 변수

• 옵션 : Options

레이어 옵션. 최소한 styleUrl 및 accessToken 제공해야합니다.

보고

MapboxVectorLayer

재정의

VectorTileLayer.constructor

속성

AccessToken

AccessToken : string

ol-mapbox 스타일 • 문서

기능 : addMapboxLayer ()

AddMapboxLayer ( mapOrGroup , mapboxLayer , beforeLayerId ?) : Promise void

스타일에 새 맵 박스 레이어 개체를 추가하십시오. 지도가 다시 렌더링됩니다.

매개 변수

• MaporGroup : Map | LayerGroup

지도 또는 계층 그룹 apply 호출되었습니다.

• Mapboxlayer : any

맵 박스 레이어 객체.

• beforelayerid? : string

추가 될 새 레이어 앞에 맵 박스 계층의 선택적 ID.

보고

Promise void

추가 된 층을 사용할 수있을 때 해결됩니다.

ol-mapbox 스타일 • 문서

기능 : apply ()

적용 ( mapOrGroupOrElement , style , options ) : Promise < Map | LayerGroup >

맵 박스 스타일 객체를 OpenLayers 맵 또는 계층 그룹에로드하고 적용합니다. 여기에는 맵 배경, 레이어 및 뷰가 정의되지 않은 맵 인스턴스에 대해서도 중심과 줌이 포함됩니다.

예:

 import apply from 'ol-mapbox-style' ;

apply ( 'map' , 'mapbox://styles/mapbox/bright-v9' , { accessToken : 'YOUR_MAPBOX_TOKEN' } ) ;

센터 및 줌은 Mapbox 스타일 문서에있는 경우에만 설정되며 OpenLayers 맵에 아직 설정되지 않은 경우에만 설정됩니다.

맵에 이미 설정 될 수있는 레이어에 영향을 미치지 않고 OpenLayers 맵에 레이어가 추가됩니다.

apply() 에 의해 추가 된 레이어에는 두 가지 추가 속성이 있습니다.

mapbox-source : OpenLayers 레이어가 생성 한 MapBox 스타일 문서의 id . 일반적으로 apply() 레이어 스택에 다른 소스의 레이어가없는 한 맵 박스 스타일 소스 당 하나의 OpenLayers 레이어를 만듭니다.
mapbox-layers : OpenLayers 레이어에 포함 된 MapBox 스타일 문서의 id S.

이 함수는 Mapbox 스타일 객체를 보유하는 OpenLayers Map 또는 LayerGroup 인스턴스에 추가 mapbox-style 속성을 설정합니다.

매개 변수

• MaporGroupOrelement : string | Map | LayerGroup | HTMLElement

기존 OpenLayers 맵 인스턴스 또는 HTML 요소 또는 새로운 OpenLayers 맵 또는 레이어 그룹의 대상이 될 HTML 요소의 ID. 레이어 그룹이라면 Styles가 맵에 상상하고보기가 무시됩니다.

• 스타일 : any

맵 박스 스타일 객체를 가리키는 JSON 스타일 객체 또는 스타일 URL. Mapbox API를 사용하는 경우 URL은 Mapbox Studio의 "Share"패널에 표시된 styleUrl 입니다. 또한 accessToken 옵션 (아래 참조)을 설정해야합니다. JSON 스타일 객체로 전달되면 apply() 에 의해 생성 된 모든 OpenLayers 레이어는 즉시 사용할 수 있지만 아직 소스가 없을 수 있습니다 (즉, Mapbox 스타일 문서의 Tilejson URL에 의해 정의 될 때). 스타일 URL로 전달되면 MapBox 스타일 문서가로드되고 구문 분석되면 레이어가 맵에 추가됩니다.

• 옵션 : Options = {}

옵션.

보고

Promise < Map | LayerGroup >

모든 레이어가 OpenLayers 맵 인스턴스 또는 레이어 그룹에 추가 된 후에 해결되었다는 약속, 소스 설정 및 스타일이 적용됩니다. resolve 콜백은 OpenLayers 맵 인스턴스 또는 레이어 그룹을 인수로 호출합니다.

ol-mapbox 스타일 • 문서

기능 : applackground ()

Application Background ( mapOrLayer , glStyle , options ) : Promise any

Mapbox 스타일의 첫 번째 background 레이어의 속성을 제공된 맵 또는 레이어 (그룹)에 적용합니다.

예:

 import { applyBackground } from 'ol-mapbox-style' ;
import { Map } from 'ol' ;

const map = new Map ( { target : 'map' } ) ;
applyBackground ( map , 'https://api.maptiler.com/maps/basic/style.json?key=YOUR_OPENMAPTILES_TOKEN' ) ;

매개 변수

• Maporlayer : Map | BaseLayer

OpenLayers 맵 또는 레이어 (그룹).

• Glstyle : any

맵 박스 스타일 객체 또는 URL.

• 옵션 : Options = {}

옵션.

보고

Promise any

배경이 적용될 때 해결되는 약속.

ol-mapbox 스타일 • 문서

기능 : applyStyle ()

응시 스타일 ( layer , glStyle , sourceOrLayersOrOptions ?, optionsOrPath ?, resolutions ?) : Promise any

ol/layer/VectorTile 또는 OL ol/source/VectorTile 또는 OL ol/source/Vector ol/layer/Vector 에 스타일 함수를 적용합니다. 레이어에 아직 소스가 없으면 glStyle 의 정보에서 생성되어 채워집니다 ( updateSource false 로 설정되지 않는 한).

예:

 import { applyStyle } from 'ol-mapbox-style' ;
import { VectorTile } from 'ol/layer.js' ;

const layer = new VectorTile ( { declutter : true } ) ;
applyStyle ( layer , 'https://api.maptiler.com/maps/basic/style.json?key=YOUR_OPENMAPTILES_TOKEN' ) ;

스타일 함수는 첫 번째 레이어의 소스, 지정된 source 또는 동일한 소스의 레이어 하위 집합을 사용하는 glStyle 객체의 모든 레이어를 렌더링합니다. 소스는 "type": "vector" 또는 "type": "geojson" 소스 여야합니다.

제공된 레이어에 두 개의 추가 속성이 설정됩니다.

mapbox-source : OpenLayers 레이어가 생성 한 MapBox 스타일 문서의 id . 일반적으로 apply() 레이어 스택에 다른 소스의 레이어가없는 한 맵 박스 스타일 소스 당 하나의 OpenLayers 레이어를 만듭니다.
mapbox-layers : OpenLayers 레이어에 포함 된 MapBox 스타일 문서의 id S.

매개 변수

• 레이어 : VectorLayer < VectorSource any , any > | VectorTileLayer < VectorTile any , any >

OpenLayers 레이어. 레이어에 소스가 구성된 경우 Glstyle source 의 구성을 사용하도록 수정됩니다. 레이어 소스에 지정된 옵션은 url 및 tileUrlFunction 제외한 Glstyle source 의 옵션을 무시합니다. 소스 투영이 기본값 ( EPSG:3857 ) 인 경우 tileGrid 도 재정의됩니다. OL-Mapbox 스타일이 없으면 소스를 수정하려면 updateSource: false 옵션을 사용하여 applyStyle() 구성하십시오.

• Glstyle : any

맵 박스 스타일 객체.

• Sourceorlayersoroptions? : string | string [] | Options 및 ApplyStyleOptions = ''

옵션 또는 source 키 또는 맵 박스 스타일 객체의 레이어 id 배열. source 키가 제공되면 지정된 소스의 모든 레이어가 스타일 기능에 포함됩니다. 계층 id 가 제공되면 동일한 소스를 사용하는 레이어에서 있어야합니다. 제공되지 않거나 거짓 값이 있으면 Glstyle에 지정된 첫 번째 소스를 사용하는 모든 레이어가 렌더링됩니다.

• OptionsOrPath? : string | Options 및 ApplyStyleOptions = {}

더 이상 사용되지 않았습니다 . 옵션. 또는 스타일 파일의 경로 (스타일의 "sprite" 속성에 상대 경로가 사용될 때만 필요).

• 결의? : number [] = undefined

더 이상 사용되지 않았습니다 . 해상도를 줌 레벨로 매핑하기위한 해상도. 비표준 타일 그리드 또는 예측으로 작업 할 때만 필요하며 옵션과 함께 제공 할 수도 있습니다.

보고

Promise any

스타일을 렌더링에 사용할 수있을 때 해결 될 약속.

ol-mapbox 스타일 • 문서

기능 : getFeatUrestate ()

getFeatUrestate ( mapOrLayer , feature ) : any

기능 상태를 설정하거나 제거합니다. 기능 상태는 기능의 속성과 마찬가지로 스타일링을 고려하며 예를 들어 선택된 기능을 조건부로 렌더링하는 데 사용할 수 있습니다.

매개 변수

• Maporlayer : Map | VectorLayer < VectorSource any , any > | VectorTileLayer < VectorTile any , any >

기능 상태를 설정하려면 맵 또는 레이어.

• 기능 : FeatureIdentifier

기능 식별자.

보고

any

주어진 기능 식별자에 대해 기능 상태가 설정되지 않은 경우 기능 상태 또는 null .

ol-mapbox 스타일 • 문서

기능 : getLayer ()

getLayer ( map , layerId ) : Layer < Source , LayerRenderer < any >>

제공된 MapBox 스타일 layer 포함 된 OpenLayers 레이어 인스턴스를 가져옵니다. 다중 맵 박스 스타일 레이어는 동일한 맵 박스 스타일 source 사용할 때 단일 OpenLayers 레이어 인스턴스에 결합됩니다.

매개 변수

• 지도 : Map | LayerGroup

OpenLayers지도 또는 계층 그룹.

• 계층 : string

맵 박스 스타일 레이어 ID.

보고

Layer < Source , LayerRenderer < any >>

OpenLayers 계층 인스턴스.

ol-mapbox 스타일 • 문서

기능 : getLayers ()

getLayers ( map , sourceId ) : Layer < Source , LayerRenderer < any >> []

제공된 MapBox 스타일 source 의 OpenLayers 레이어 인스턴스를 가져옵니다.

매개 변수

• 지도 : Map | LayerGroup

OpenLayers지도 또는 계층 그룹.

• sourceid : string

맵 박스 스타일 소스 ID.

보고

Layer < Source , LayerRenderer < any >> []

OpenLayers 레이어 인스턴스.

ol-mapbox 스타일 • 문서

기능 : getMapboxLayer ()

getMapboxLayer any mapOrGroup , layerId ) :

제공된 layerId 의 맵 박스 레이어 객체를 가져옵니다.

매개 변수

• MaporGroup : Map | LayerGroup

지도 또는 계층 그룹.

• 계층 : string

맵 박스 계층 ID.

보고

any

맵 박스 레이어 객체.

ol-mapbox 스타일 • 문서

기능 : getSource ()

getSource ( map , sourceId ) : Source

제공된 MapBox 스타일 source 의 OpenLayers 소스 인스턴스를 가져옵니다.

매개 변수

• 지도 : Map | LayerGroup

OpenLayers지도 또는 계층 그룹.

• sourceid : string

맵 박스 스타일 소스 ID.

보고

Source

OpenLayers 소스 인스턴스.

ol-mapbox 스타일 • 문서

기능 : getStyleforLayer ()

getStyleforLayer ( feature , resolution , olLayer , layerId ) : Style []

특정 맵 박스 레이어의 스타일을 얻으십시오. 이것은 전설을 만드는 데 유용 할 수 있습니다.

매개 변수

• 기능 : RenderFeature | Feature < Geometry >

OpenLayers 기능.

• 해상도 : number

해상도를 봅니다.

• ollayer : VectorLayer < VectorSource any , any > | VectorTileLayer < VectorTile any , any >

OpenLayers 레이어.

• 계층 : string

맵 박스 레이어의 ID

보고

Style []

제공된 맵 박스 레이어의 스타일.

ol-mapbox 스타일 • 문서

기능 : RecordStylelayer ()

RecordStylelayer ( record ) : void

Mapbox 스타일의 layer 를 켜고 끄는 녹음을 전환합니다. 켜지면 렌더링 된 기능이 속하는 레이어가 기능의 mapbox-layer 속성으로 설정됩니다.

매개 변수

• 기록 : boolean = false

스타일 레이어의 녹음이 켜져 있습니다.

보고

void

ol-mapbox 스타일 • 문서

기능 : RemoveMapboxLayer ()

RemoveMapboxLayer ( mapOrGroup , mapboxLayerIdOrLayer ) : void

스타일에서 맵 박스 레이어 객체를 제거하십시오. 지도가 다시 렌더링됩니다.

매개 변수

• MaporGroup : Map | LayerGroup

지도 또는 계층 그룹 apply 호출되었습니다.

• MapBoxLayeridorLayer : any

맵 박스 레이어 ID 또는 맵 박스 레이어 개체.

보고

void

ol-mapbox 스타일 • 문서

기능 : RenderTransparent ()

RenderTransparent ( enabled ) : void

투명한 스타일의 기능을 렌더링 해야하는지 여부를 구성하십시오. true 로 설정되면 ol/layer/Layer#getFeatures() 또는 ol/Map#getFeaturesAtPixel() 사용하여 다각형의 투명한 채우기와 같이 보이지 않는 컨텐츠를 도착할 수 있습니다.

매개 변수

• 활성화 : boolean

투명 요소의 렌더링이 가능합니다. 기본값은 false 입니다.

보고

void

ol-mapbox 스타일 • 문서

기능 : setFeatUreState ()

setfeaturestate ( mapOrLayer , feature , state ) : void

기능 상태를 설정하거나 제거합니다. 기능 상태는 기능의 속성과 마찬가지로 스타일링을 고려하며 예를 들어 선택된 기능을 조건부로 렌더링하는 데 사용할 수 있습니다.

기능 상태는 mapbox-featurestate 속성에서 기능 식별자와 일치하는 OpenLayers 레이어에 저장됩니다.

매개 변수

• Maporlayer : Map | VectorLayer < VectorSource any , any > | VectorTileLayer < VectorTile any , any >

OpenLayers 맵 또는 레이어로 기능 상태를 설정합니다.

• 기능 : FeatureIdentifier

기능 식별자.

• 상태 : any

기능 상태. 기능 상태를 제거하려면 null 로 설정하십시오.

보고

void

ol-mapbox 스타일 • 문서

기능 : StyleFunction ()

StyleFunction ( olLayer , glStyle , sourceOrLayers , resolutions , spriteData , spriteImageUrl , getFonts , getImage ?, ... args ?) : StyleFunction

지정된 source 사용하는 모든 레이어에 대한 glStyle 객체에서 "type": "vector" 또는 "type": "geojson" 소스가 필요한 스타일 기능을 생성하고 지정된 OpenLayers 레이어에 적용합니다.

제공된 레이어에 두 개의 추가 속성이 설정됩니다.

mapbox-source : OpenLayers 레이어가 생성 한 MapBox 스타일 문서의 id . 일반적으로 apply() 레이어 스택에 다른 소스의 레이어가없는 한 맵 박스 스타일 소스 당 하나의 OpenLayers 레이어를 만듭니다.
mapbox-layers : OpenLayers 레이어에 포함 된 MapBox 스타일 문서의 id S.

이 기능은 웹 작업자에서도 작동합니다. 작업자 모드에서 기본 스레드는 작업자의 메시지를 듣고 다른 메시지로 응답하여 스프라이트 이미지 로딩이 작동하는지 확인해야합니다.

 worker . addEventListener ( 'message' , event => {
  if ( event . data . action === 'loadImage' ) {
    const image = new Image ( ) ;
    image . crossOrigin = 'anonymous' ;
    image . addEventListener ( 'load' , function ( ) {
      createImageBitmap ( image , 0 , 0 , image . width , image . height ) . then ( imageBitmap => {
        worker . postMessage ( {
          action : 'imageLoaded' ,
          image : imageBitmap ,
          src : event . data . src
        } , [ imageBitmap ] ) ;
      } ) ;
    } ) ;
    image . src = event . data . src ;
  }
} ) ;

매개 변수

• ollayer : VectorLayer < VectorSource any , any > | VectorTileLayer < VectorTile any , any >

스타일을 적용하기 위해 OpenLayers 레이어. 스타일 외에도 레이어는 두 가지 속성을 얻을 수 있습니다. mapbox-source 레이어에 사용되는 glStyle 소스의 id 가 될 것이며 mapbox-layers glStyle 레이어의 id 배열이됩니다.

• Glstyle : any

맵 박스 스타일 객체.

• SourceOrlayers : string | string []

Mapbox 스타일 객체의 source 키 또는 레이어 id 배열. source 키가 제공되면 지정된 소스의 모든 레이어가 스타일 기능에 포함됩니다. 계층 id 가 제공되면 동일한 소스를 사용하는 레이어에서 있어야합니다.

• 해상도 : number [] = defaultResolutions

해상도를 줌 레벨로 매핑하기위한 해상도.

• Spritedata : any = undefined

Mapbox Style Object의 sprite 속성에 지정된 URL의 스프라이트 데이터. sprite 속성이 Mapbox 스타일 객체에 지정된 경우에만 필요합니다.

• SpriteImageUrl : string | Request | Promise < string | Request > = undefined

Mapbox Style Object의 sprite 속성에 지정된 스프라이트의 스프라이트 이미지 URL. sprite 속성이 Mapbox 스타일 객체에 지정된 경우에만 필요합니다.

• getfonts = undefined

글꼴 스택과 URL 템플릿을 GL Style의 metadata['ol:webfonts'] 속성 (세트)으로 인수로 수신하고 사용 가능한 (수정 된) 글꼴 스택을 반환합니다. 글꼴 이름은 Mapbox 스타일 객체에 사용되는 이름입니다. 제공되지 않으면 글꼴 스택은 as-IS로 사용됩니다. 이 기능은 웹 글꼴을로드하는 데 사용될 수도 있습니다.

• GetImage? = undefined

이미지 이름에 대한 이미지 또는 URL을 반환하는 함수. 결과가 htmlimageelement 인 경우 이미로드해야합니다. 레이어는 이미지의 로딩 및 처리가 완료되면 레이어를 호출하는 데 사용될 수 있습니다. 이 기능은 스프라이트가 아닌 아이콘이나 스프라이트 아이콘을 무시하는 데 사용될 수 있습니다.

• ... Args? : any