单击地图外的 link 时如何使焦点指向地图标记?
How to get focus to map marker when click on a link outside the map?
所以,我有一张带有 mapquest 传单的地图,上面显示的标记很少,并且有一些弹出消息。但是,一切正常,但在地图下方我有一个 table 显示酒店号码。所以像这样 link:
<a href='#Hotel22'>Hotel 22</a><a href='#Hotel23'>Hotel 23</a><a href='#Hotel24'>Hotel 24</a>
因此,当任何用户点击#Hotel22 时,它将直接将焦点放在地图的特殊标记上并打开标记 window。这样用户就会知道酒店 22 在地图上...
如果有人知道这一点,那么我的地图是在传单中创建的,但使用 mapquest 传单 api 方式。由于项目的原因,我不能 copy/paste 这里的一些复杂代码....
先谢谢各位朋友了:)
您基本上必须维护标记的关联数组。
<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();
}
您可以通过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函数中可以控制marker和list。
function over(id) {
srs.getLayer(id).setIcon(newicon);
$('#row' + id).css('backgroundImage', highlight);
}
查看实际效果 here。
所以,我有一张带有 mapquest 传单的地图,上面显示的标记很少,并且有一些弹出消息。但是,一切正常,但在地图下方我有一个 table 显示酒店号码。所以像这样 link:
<a href='#Hotel22'>Hotel 22</a><a href='#Hotel23'>Hotel 23</a><a href='#Hotel24'>Hotel 24</a>
因此,当任何用户点击#Hotel22 时,它将直接将焦点放在地图的特殊标记上并打开标记 window。这样用户就会知道酒店 22 在地图上...
如果有人知道这一点,那么我的地图是在传单中创建的,但使用 mapquest 传单 api 方式。由于项目的原因,我不能 copy/paste 这里的一些复杂代码....
先谢谢各位朋友了:)
您基本上必须维护标记的关联数组。
<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();
}
您可以通过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函数中可以控制marker和list。
function over(id) {
srs.getLayer(id).setIcon(newicon);
$('#row' + id).css('backgroundImage', highlight);
}
查看实际效果 here。