HTML - 将特定的Google地图链接转换为iframe

时间:2017-01-09 20:54:59

标签: html google-maps dictionary iframe hyperlink

在我正在处理的地图上,有鼠标悬停时显示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描述了类似的问题,只是在这种情况下这种方法是无用的(因为每个标记都有其指定的数据存储在文件中)。虽然显示的地图是静态图像或可点击和可缩放的框架并不重要,但其中任何一个都很棒。

0 个答案:

没有答案