我有一个嵌入式谷歌地图,其中包括一个标记。点击详细地图后,此标记会丢失

时间:2015-07-02 04:21:51

标签: google-maps

我有一个嵌入式Google地图,其中包含一个标记。标记在嵌入式地图中显示正常。

然而,当我点击" Google"嵌入式地图左下角的徽标,将我带到完整的Google地图网站中的地图,标记无处可见。如何确保将标记传递到详细的Google地图?

按如下方式生成地图:

<div class="googlemap"><div id="mapDiv" class="googleMaps" style="width: 380px; height: 300px"><script>
      function tpinitmap() {
      var tpcoords = new google.maps.LatLng('13.704312','100.492296');
      var tpmap = new google.maps.Map(document.getElementById("mapDiv"), {scrollwheel:false, zoom: 14, center: tpcoords, mapTypeId: google.maps.MapTypeId.ROADMAP});
      var tpmarker = new google.maps.Marker({position: tpcoords, map: tpmap, title: 'Anantara Bangkok Riverside Resort & Spa'});
      }
    </script><script src="http://maps.google.com/maps/api/js?sensor=false&callback=tpinitmap"></script></div></div>

1 个答案:

答案 0 :(得分:0)

我认为你不能像你所说的那样做。点击谷歌的徽标链接到google maps,而不是你的应用程序。 Google地图不知道您的应用程序以及应用程序中添加的用于显示标记的脚本。 如果您想要更大的地图,则必须放大地图的div。例如与

一样
<!DOCTYPE html>
<html style="width: 100%; height: 100%;">
<head>
 <script src="http://maps.google.com/maps/api/js?sensor=false"></script>

    <div id="mapDiv" class="googleMaps" style="width: 100%; height: 100%;">
    </div>

        <script>
            function initialize() {
                var tpcoords = new google.maps.LatLng('13.704312','100.492296');
                var tpmap = new google.maps.Map(document.getElementById("mapDiv"), {scrollwheel:false, zoom: 14, center: tpcoords, mapTypeId: google.maps.MapTypeId.ROADMAP});
                var tpmarker = new google.maps.Marker({position: tpcoords, map: tpmap, title: 'Anantara Bangkok Riverside Resort & Spa'});
            }
            google.maps.event.addDomListener(window, 'load', initialize); 
        </script>

</body>
</html>

要全屏查看地图,请确保地图的所有标签父容器(html,body,....,div of map)的大小都指定为width:100%;身高:100%;