在我正在处理的地图上,有鼠标悬停时显示iframe的标记。我目前正在使用http://maps.google.com/?q=[% VARIABLE %]
来创建导航到变量位置的链接。与this帖子类似,让我的iframe同时显示一张小地图会很不错。是否可以使用此更改链接直接显示地图框?
这是我用(纯HTML)尝试执行此操作的代码片段:
<head>
<style>
#map {
height: 400px;
width: 100%;
}
</style>
</head>
<p>This is, among other countries, where the language can be found:</p>
<a href="http://maps.google.com/?q=[% "MAPREF" %]">
Click here to locate [% "Sprache" %] on Google Maps.</a><p> (Keep in mind that only the first entry is shown.)</p>
<div id="map"></div>
<script>
function initMap() {
var uluru = {lat: 50.115017, lng: 8.634350};
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 4,
center: uluru
});
var marker = new google.maps.Marker({
position: uluru,
map: map
});
}
</script>
<script async defer
src="https://maps.googleapis.com/maps/api/js?key=mykey&callback=initMap">
</script>
</body>
</html>
`
请注意,目前正在使用纬度和经度。虽然这需要编辑每个iframe的坐标,但我可以使用变量链接来引用每个互补的国家/地区代码(它们保存在我可以在HTML中引用的文本文件中)。 Another post描述了类似的问题,只是在这种情况下这种方法是无用的(因为每个标记都有其指定的数据存储在文件中)。虽然显示的地图是静态图像或可点击和可缩放的框架并不重要,但其中任何一个都很棒。