[英]Jvector Map how to add and get link from marker
我试图从标记数组中获取数据并在 onmarkerclick 函数上调用它,这样我就可以在点击标记后转到一个 URL,我尝试的一切似乎都失败了。 我希望在标记数组中添加一个 URL 并将其返回到 onmarkerclick。 感谢您在高级方面的帮助:
$(function(){
$('#map1').vectorMap({
map: 'world_mill_en',
scale: ['#C8EEFF', '#0071A4'],
normalizeFunction: 'polynomial',
hoverOpacity: 0.7,
hoverColor: false,
markerStyle: {
initial: {
fill: '#F8E23B',
stroke: '#383f47'
}
},
backgroundColor: '#383f47',
markers: [{latLng: [48.921537, -66.829834], name: "something", weburl : "/blah/foo"
},{latLng: [45.995944, -64.171143], name: "something else", weburl : "/blah/foo"
},],
onMarkerClick: function(events, label, index, weburl) {
alert (1+weburl);
}
});
});
太巧了,我昨天才遇到同样的问题..:)
我找到的解决方案是在外部创建一个数组,并通过单击函数中的索引访问它。
var markers = [
{latLng: [48.921537, -66.829834], name: "something", weburl : "/blah/foo"},
{latLng: [45.995944, -64.171143], name: "something else", weburl : "/blah/foo-else"}
];
$(function(){
$('#map1').vectorMap({
...
markers: markers,
onMarkerClick: function(event, index) {
// alter the weburl
alert(markers[index].weburl);
}
});
});
仅仅因为我刚刚以不同的方式解决了这类问题,并且我觉得这样做很聪明,所以我会发布我的答案。
您可以使用 jQuery.data 或 javascript dom dataSets 存储任意数据。 除非您的页面上有其他带有<circle>
元素的 SVG,否则您可以遍历所有<circle>
元素并从数组中为它们提供数据。 索引将匹配,但您可以使用 data-index 作为保护措施。
很酷。 尽管这已经很老了,但也许这种替代方法会对某人有所帮助。
使用 Rajat 和 Oldenborg 的解决方案,我设法使用默认的 jVectorMap 设置获得了标记名称
onMarkerClick: function(event, index) {
console.log(map.markers[index].config.name);
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.