Multiple markers - Same coordinates

China☆狼群 提交于 2021-02-06 12:56:10

问题


I'm having some troubles trying to display 2 different markers placed at exactly the same coordinates.

The case is: we are displaying stores, and some of them are placed at the same building (ie. a mall), so, they are different stores but shares the same ubication/coordinates.

Our json source content looks like this:

  {
     "properties" : {
        "id" : "1",
        "name" : "Store 1"
     },
     "geometry" : {
        "coordinates" : [-70.66667, -33.45],
        "type" : "Point"
     }
  },
  {
     "properties" : {
        "id" : "2",
        "name" : "Store 2"
     },
     "geometry" : {
        "coordinates" : [-70.66667, -33.45],
        "type" : "Point"
     }
  }

The thing is, just one of them gets displayed.

My question is, is there an out of the box solution for this use-case? Or should we implement our own solution ?

Thanks in advance!


回答1:


If you are using the Marker class from mapbox-gl, you can just apply standard CSS transform to offset the marker.

Another solution would be something refered to as "spider marker":

  • https://bewithjonam.github.io/mapboxgl-spiderifier/docs/index.html
  • https://github.com/bewithjonam/mapboxgl-spiderifier


来源:https://stackoverflow.com/questions/47273555/multiple-markers-same-coordinates

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