链接到外部网站上的地图框标记
Link to mapbox marker on an outside website?
我有一个页面,其中包括一个带有大约7个标记的地图框地图。这些标记中的每一个都包括一个缩略图,该缩略图也添加到导航工具栏中,单击该缩略图将转到标记并打开它
我想在外部网站上加入类似的链接。是否可以在外部网页上有一个链接,将我带到地图框页面并打开特定的标记?
//populate markers
oneArtPlease.on('layeradd', function(e) {
var marker = e.layer,
feature = marker.feature;
// popupz
var popupContent = '<div class="thumbnail"><a target="_blank" class="popup" href="' + feature.properties.url + '">' +
'<img src="' + feature.properties.image + '" width="300" title="Click for the full picture" /><br>' +
feature.geometry.coordinates+'</br>'+
feature.properties.picnote +
'</a></div>';
marker.bindPopup(popupContent,{
closeButton: true,
minWidth: 320
});
//change icon
marker.setIcon(L.icon(feature.properties.icon));
//populate thumbnail bar
var link = info.insertBefore(document.createElement('a'),info.firstChild);
link.className = 'item';
link.href = '#';
link.innerHTML ='<img src="' + feature.properties.image + '" class="navthumb"/>';
link.onclick = function() {
if (/active/.test(this.className)) {
this.className = this.className.replace(/active/, '').replace(/'s's*$/, '');
} else {
var siblings = info.getElementsByTagName('a');
for (var i = 0; i < siblings.length; i++) {
siblings[i].className = siblings[i].className
.replace(/active/, '').replace(/'s's*$/, '');
};
this.className += ' active';
// move to marker and open on thumbnail click
map.panTo(marker.getLatLng());
marker.openPopup();
}
return false;
};
});
new L.Control.Zoom({ position: 'topright' }).addTo(map);
我最终找到了一些用js解析URL参数的代码。这里的url参数是通过使用index.html?件=X
function getURLParameter(name) {
return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(location.search)||[,""])[1].replace(/'+/g, '%20'))||null
}
pieceID = getURLParameter('piece');
稍后,在填充标记时,我运行以下代码。
if (marker.feature.properties.pieceID == pieceID) {
map.panTo(marker.getLatLng());
marker.openPopup();
}
我还为geojson文件中的每个标记包含一个名为pieceID的属性。如果URL与工件参数X一起传递,并且标记的工件ID等于X,则它将在页面加载时打开。
相关文章:
- 如何在外部js文件中实现谷歌地图api3
- 从外部js文件编辑现有的谷歌地图
- 外部SVG作为Google地图api标记-是或否
- 如何在外部文件中存储谷歌地图选项
- Cordova windows 8应用程序:加载外部javascript(谷歌地图)
- javascript/google maps:为什么我在哪里初始化我的地图(内部与外部函数)很重要
- 我的代码在下面,我想更改 ID 与地图外部的
- 从外部网站获取谷歌地图数据
- 谷歌地图API v3 - 通过外部单击打开信息窗口
- 通过单击外部链接来寻址谷歌地图以更改 setZoom
- 如何允许对地图引擎数据表进行外部编辑
- $http提供商向 Github API 发出外部请求,但不向 Google 地图 API 发出请求
- 如何在 openstreetmap 中从地图外部打开标记
- 谷歌地图链接到外部地图的标记
- 链接到外部网站上的地图框标记
- 谷歌地图api v3-从外部链接关闭信息窗口
- 如何在页面加载后加载谷歌地图外部javascript
- 显示坐标LAT/LONG谷歌地图-外部网站的跟踪标记业务
- 将某些内容从地图外部拖放到要素(开放图层)上
- 地图框:在地图外部标记导航链接