Translate

[Leaflet] Working with map panes



What are panes?

 - Leaflet에서 map pane은 개발자가 모르는 사이에 레이어 그룹화를 시킨다.
 - 이 그룹화는 웹 브라우저가 여러 레이어를 개별적으로 작업하는 것보다 더 효율적인 방법으로 작업 할 수 있도록 한다.

 - Map panes는 CSS의 z-index 속성을 이용하여 일부 레이어를 다른레이어 위에 보여준다.
 - 기본 순서는 다음과 같다.
  1) TileLayers and GridLayers
  2) Paths, like lines, polylines, circles, or GeoJSON layers.
  3) Marker shadows
  4) Marker icons
  5) Popups

 - 이 때문에 Leaflet Map에서 팝업이 다른 레이어보다 항상 위에 표시되고 marker는 타일레이어 위에 보여지게된다.

 - (0.7.x에는 없는) Leaflet 1.0.0의 새로운 기능은 이 순서를 사용자 지정할 수 있는 custom map panes 이다.



기본값이 항상 올바른건 아니다.

 - 어떤 특별한 상황에서는 기본 순서가 map에 적합하지 않으며, Cato의 basemaps 과 label 을 통해서 설명을 할 수 있다.


 - Leaflet map에서 basemaps,label 두개의 타일을 이용해서 만들 때, marker나 polygon은 이전의 두개의 타일 위에 나타나겠지만 label타일이 가장 위에 보여지는게 더 나아보일 수 있다.

 - 아래는 기본순서로 보여진 경우(오른쪽)와 기본순서를 custom 한 경우(왼쪽)이다.
   (기본 순서에서는 polygon 이 label 타일보다 위로 올라와 label을 가리게 된다.)



Custom pane



참고: https://leafletjs.com/examples/map-panes/


댓글