【问题标题】:why my google map isn't loading perfectly?为什么我的谷歌地图没有完美加载?
【发布时间】:2015-01-10 21:10:30
【问题描述】:
<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 以上部分是我的代码和我的结果。我找不到错误。当我拖动地图时,地图的另一部分将不可见。为什么会这样?

【问题讨论】:

标签: javascript google-maps


【解决方案1】:

就像@KimGyesen 所说,您必须使用调整大小来刷新地图。 试试这个代码sn-p,可能对你有一点帮助......

$(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>

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2016-03-29
    • 1970-01-01
    • 1970-01-01
    • 2014-11-01
    • 1970-01-01
    相关资源
    最近更新 更多