jvectormap标记标签图像

Question

jvectormap标记标签图像

4

有人知道如何将两个不同的图像添加到两个不同标记的标签中吗？

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

这将在两个标记上显示相同的图像。

- SamotnyPocitac

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Mike Vranckx · Accepted Answer

您可以为每个标记添加额外的属性image，当您悬停在标记上时，您可以检索该属性。

var markers = [
    { latLng: [46.90, 8.45], name: "Italy", image: 'italy.png' },
    { latLng: [26.02, 50.55], name: 'Bahrain', image: 'bahrain.png' },
];

$('#map').vectorMap({
    markerStyle: {
      initial: {
        fill: '#F8E23B',
        stroke: '#383f47'
      }
    },
    backgroundColor: '#383f47',
    markers: markers,
    onMarkerLabelShow: function(event, label, index) {
     label.html('<img src="img/' + markers[index].image + '"><br />' + label.html());                
    }
});