如何在点击地图外的链接时获得焦点来映射标记?

时间:2016-06-07 04:08:14

标签: javascript jquery leaflet mapquest

所以,我有一张mapquest小册子的地图,上面显示了很少的标记,并有一些弹出消息。然而,一切运作良好,但在地图下面我有一个表,我显示酒店号码。所以像这样的链接:

<a href='#Hotel22'>Hotel 22</a><a href='#Hotel23'>Hotel 23</a><a href='#Hotel24'>Hotel 24</a>

因此,当任何用户点击#Hotel22时,它将直接将焦点映射到地图的特定标记并打开标记窗口。这样用户就会知道酒店22在地图上......

如果有人知道这一点,那么我的地图是在传单中创建的,但是使用mapquest传单api方式。因为项目,我无法在这里复制/粘贴一些复杂的代码......

感谢先进的朋友。:)

2 个答案:

答案 0 :(得分:0)

您基本上必须维护标记的关联数组。

<a href="#" onclick="focusOn('paris')">Paris</a>

// javascript
var markers = {};
markers["paris"] = L.marker([48.85749, 2.35107]).addTo(mymap)
.bindPopup("<b>Hello world!</b><br />I am Paris.");

function focusOn(city) {
   markers[city].openPopup();
}

请参阅example

答案 1 :(得分:0)

您可以通过layerId引用标记。在列表中引用它(如果要在滚动标记时列出以突出显示,则在标记上)。

                        marker = L.marker([c.shapePoints[0], c.shapePoints[1]]);
                        srs.addLayer(marker);
                        layerid = srs.getLayerId(marker);
                        marker.on('mouseover', function(a){
                            over(srs.getLayerId(a.target));
                        })
                        .on('mouseout', function(a){
                            out(srs.getLayerId(a.target));
                        })
                        .bindPopup(c.name);
                        tabletext = tabletext + '<tr id="row' + layerid + '" ' +
                            'onmouseover="over(' + layerid + ');" ' +
                            'onmouseout="out(' + layerid + ');">' +
                            '<td>' + c.name + '</td>' +
                            '</tr>';

然后在over和out函数中,您可以控制标记和列表。

        function over(id) {
            srs.getLayer(id).setIcon(newicon);
            $('#row' + id).css('backgroundImage', highlight);
        }

在行动here中查看。