0

我在我的一个 jquery 移动页面中使用谷歌地图，而不是在每个页面上加载整个地图 javascript 文件，而是将它们包含在使用谷歌地图的页面中。

但是当我导航到页面时，加载微调器正在旋转，但没有任何反应。当我删除 gmaps 代码时，一切正常。

我使用这个插件，所以我的代码看起来像这样：

<div data-role="page" id="page1" data-theme="a">
    <?php include "components/site_header.php"; ?>
    <!-- Scripts for Maps -->
    <script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript"></script>
    <script src="library/jquery.ui.map.full.min.js" type="text/javascript"></script>
    <!--.................-->
    <div data-role="content">
               <div id="map_canvas" style="width:100%;height:250px"></div>
                    <script type="text/javascript">
                    $(function() {
                        var LatLng = new google.maps.LatLng(<?=$lat;?>, <?=$lon;?>);
                        $('#map_canvas').gmap({'center': LatLng});
                    });
                    </script>
               </div>
    </div>
</div>

编辑当我直接（通过 URL）调用网页时，代码正在工作。但是当我通过网站导航到它时，它会无休止地加载......

EDIT2让代码工作。删除了我上面提到的插件，并在 Jquery 和 Jquery Mobile JS 之前添加了 Google Maps JS 文件。我的代码现在看起来像这样：

            <div id="map_canvas" style="width:100%;height:250px"></div>
               <script type="text/javascript"> 
               var address = '<?php echo $info['pr_city'].", ".$info['pr_zip'].", ".$info['pr_street'].", ".$info['pr_nr']; ?>';

               var map = new google.maps.Map(document.getElementById('map_canvas'), { 
                   mapTypeId: google.maps.MapTypeId.ROADMAP,
                   zoom: 15
               });

               var geocoder = new google.maps.Geocoder();

               geocoder.geocode({
                  'address': address
               }, 
               function(results, status) {
                  if(status == google.maps.GeocoderStatus.OK) {
                     new google.maps.Marker({
                        position: results[0].geometry.location,
                        map: map
                     });
                     map.setCenter(results[0].geometry.location);
                  }
               });
               </script>
4

0 回答 0