Question

<h4>Location</h4>
<div class="full-row mt20">
    <?php 
    if(empty($restaurant['Restaurant']['lattitude']))
        $restaurant['Restaurant']['lattitude'] = 0;

    if(empty($restaurant['Restaurant']['longitude']))
        $restaurant['Restaurant']['longitude'] = 0;
    ?>
    <script src="https://maps.googleapis.com/maps/api/js?v=3.exp"></script>
    <script>
    function initialize() {

        var myLatlng = new google.maps.LatLng(<?php echo $restaurant['Restaurant']['lattitude']; ?>,<?php echo $restaurant['Restaurant']['longitude']; ?>);
        var mapOptions = {
          zoom: 6,
          center: myLatlng
      }
      var map = new google.maps.Map(document.getElementById('googleMap'), mapOptions);
      var marker=new google.maps.Marker({position:myLatlng});

      var marker = new google.maps.Marker({
        position: myLatlng,
        map: map,
    });


  }

  google.maps.event.addDomListener(window, 'load', initialize);
  </script>
  <div id="googleMap" style="height:250px;"></div>

！[在此处输入图片说明] [1]

！[在此处输入图片说明] [2] 输出图像链接为：http://i.stack.imgur.com/YGS3X.png http://i.stack.imgur.com/1SLRK.png 以上部分是我的代码和我的结果。我找不到错误。当我拖动地图时，地图的另一部分将不可见。为什么会这样？

Answer 1

像@KimGyesen所说，你必须使用resize刷新地图。试试这个代码片段，可能会对你有所帮助......

$(document).ready(function () {
    var myLatlng = new google.maps.LatLng(-25.363882, 131.044922);
    var mapOptions = {
        zoom: 6,
        center: myLatlng
    }
    var map = new google.maps.Map(document.getElementById('googleMap'), mapOptions);
    var marker = new google.maps.Marker({
        position: myLatlng
    });

    var marker = new google.maps.Marker({
        position: myLatlng,
        map: map,
    });
    setInterval(function () {
        google.maps.event.trigger(map, 'resize');
        map.fitBounds();
    }, 2000);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp"></script>
<body>
    <div id="googleMap" style="width:500px; height:400px"></div>
</body>

为什么我的谷歌地图没有完美加载？

1 个答案: