Leaflet: How to display markers behind polygons?

扶醉桌前 提交于 2019-12-07 21:45:18

问题


I need icons (PNG) and polygons on my map. So I create icons as markers and polygons as polygons. Unfortunately regardless of creation order polygons are displayed "below" markers. I need is vice-versa. Is there a way, how to do it?


回答1:


EDIT:

Correct default panes order in Leaflet 0.x: (from top-most to bottom-most)

  1. objectsPane
    1. popupPane
    2. markerPane <= all markers icon (other than L.CircleMarker)
    3. shadowPane <= all markers icon shadow
    4. overlayPane <= all vectors (including L.CircleMarker)
  2. tilePane

So just using the marker's icon shadow is not enough. You have to manually change the z-index of those panes in CSS (or through JS).

See also Leaflet: Polyline above Marker.


Original answer:

The stack order of vectors (like your polygons) and Markers is fixed in Leaflet 0.x. They are inserted into "panes" which order is (from top-most to bottom-most):

  1. popupPane
  2. markerPane <= all markers icon (other than L.CircleMarker)
  3. overlayPane <= all vectors (including L.CircleMarker)
  4. shadowPane <= all markers icon shadow
  5. tilePane

So you should be able to easily workaround this fixed order by using the Marker's Icon shadow. If you still want the user to be able to click on your marker, simply use a transparent image for the normal icon, with the same size as your shadow image.

The situation is different in Leaflet 1.0. You can create your own panes (map.createPane), set their order by specifying their zIndex (possibly through CSS), and specify where your vectors and markers go by using their pane (and shadowPane for markers) option(s).



来源:https://stackoverflow.com/questions/33542254/leaflet-how-to-display-markers-behind-polygons

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!