标记为图像

Question

我正在尝试使用JVectorMap创建世界地图，但我会将标记放置为图像（marker.png）而不是默认的圆圈。我可以这样做吗？

Answer 1

还没有，这个feature计划用于下一个版本之一。

Answer 2

如果你想要图像标记，可以使用一个新图层（在地图中对svg图层划分），为每个标记添加一个新的div，然后设置位置。

参考地图

map = $("#world-map-gdp").vectorMap('get', 'mapObject');

并使用map.latLngToPoint（）函数定位新图层中的点。

var newMarkerP = map.latLngToPoint(lat,lng);
$('#marker1').css('top',newMarkerP.x);
$('#marker1').css('left',newMarkerP.y); 

如果进行缩放或拖动，您可以重新定位标记，使用相同的功能并应用css left和css top。

可能您可以使用新标记的顶部和左侧，但这是一个简单的解决方案。

Answer 3

有基于图像的标记的官方示例 - http://jvectormap.com/examples/marker-icons/

Answer 4

在标记样式设置中，您可以使用“图片”代替“r”：

        var myMarkerStyle = {
          initial: {
            image: 'files/fkd/marker.png'
          }
        };