在JVectorMap上弹出标签

Question

我是jQuery的新手，并且一直在开发JVectorMap。我已经创建了标记，但我想知道是否有人可以帮我创建一个弹出窗口或标签，当单击其中一个标记时出现。此窗口/标签将显示有关单击的特定标记的信息。

以下是我想要实现的截图，如果有人能帮助我，我将非常感激！

由于

Answer 1

您可以捕获标记的点击事件并获取所点击标记的文本。

<script>
    var markers = [
        { latLng: [48.921537, -66.829834], name: "One", text: "This is a text of one." },
        { latLng: [45.995944, -64.171143], name: "Two", text: "This is a text of two." }
    ];

    $(function () {
        $('#map').vectorMap({
            map: 'ca_lcc_en',
            markers: markers,
            onMarkerClick: function (e, index) {
                $('#text').text(markers[index].text);
            }
        });
    });
</script>

<div id="map" style="float: left; width: 400px; height: 400px;">
</div>
<div id="text" style="float: right; width: 200px; height: 200px; border: 1px solid red;">
</div>