jquery - jvectormap：如何在标记标签/工具提示中实现 HTML 而不是简单的字符串？

Question

我刚刚实现了 jQuery 插件jvectormap，用于世界地图。一切正常，除了这个可能......我添加了一些标记，并一直在尝试将 HTML 实现到标记标签/工具提示。因此，当悬停标记时，我希望显示图像/html，而不仅仅是“blabla”。

我怎样才能达到这个结果？

这是初始化JS：

$('#map').vectorMap({
    markerStyle: {
      initial: {
        fill: '#F8E23B',
        stroke: '#383f47'
      }
    },
    backgroundColor: '#383f47',
    markers: [
      {latLng: [46.90, 8.45], name: "<img src=\"img/logo.png\">"}
    ],
...(other code isn't important)...

重要的部分是name: "<img src=\"img/logo.png\">"

谢谢您的帮助！！

Answer 1

如果您想自定义鼠标悬停在标记上时显示的标签/工具提示，您应该为onMarkerLabelShow提供一个函数。

onMarkerLabelShow 函数(Event e, Object label, String code)将在标记标签显示之前被调用。

例如：

$('#map').vectorMap({
    markerStyle: {
      initial: {
        fill: '#F8E23B',
        stroke: '#383f47'
      }
    },
    backgroundColor: '#383f47',
    markers: [
      {latLng: [46.90, 8.45], name: "My marker name"}
    ],
    onMarkerLabelShow: function(event, label, code) {
     label.html("<img src=\"img/logo.png\"><br>"+ label.html());                
    }
});