jvectormap:如何在标记标签/工具提示中实现 HTML 而不是简单的字符串? [英] jvectormap: How to implement HTML instead of simple string in the markers label/tooltip?
问题描述
我刚刚实现了jQuery插件.
<块引用>onMarkerLabelShow 函数 (Event e, Object label, String code)
将在标记标签显示之前调用.
例如:
$('#map').vectorMap({标记样式:{最初的: {填充:'#F8E23B',中风:'#383f47'}},背景颜色:'#383f47',标记:[{latLng: [46.90, 8.45], name: "我的标记名称"}],onMarkerLabelShow:函数(事件,标签,代码){label.html("<img src="img/logo.png"><br>"+ label.html());}});
I've just implemented the jQuery plugin jvectormap, for the use of a world map. Everything's working perfectly, except this maybe.. I added a few markers and have been trying to implement HTML to the markers label/tooltip. So instead of just "blabla" I want an image/html to show up, when hovering the marker.
How can I achieve this result?
Here's the initializing 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)...
The important part is name: "<img src="img/logo.png">"
Thanks for the help!!
If you want to customize the label/tooltip that is displayed when you mouse over the marker, you should provide a function for onMarkerLabelShow.
onMarkerLabelShow Function
(Event e, Object label, String code)
Will be called right before the marker label is going to be shown.
For example:
$('#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());
}
});
这篇关于jvectormap:如何在标记标签/工具提示中实现 HTML 而不是简单的字符串?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!