Question

我有一个问题，我找不到解决方案，谷歌地图第一次调用页面时工作（单页应用程序），但是当我来回地看地图时标记是正确的但是发生了像这个用户发生的事情：

1. centered erringly.
2. missing an entire area covered in grey.

Why is the centering of my map off in my jQuery Mobile / Google Maps API3 application?

正如你在上一篇文章中所看到的那样，地图在角落里的位置稍微小一点，恰恰发生在我身上。现在我告诉你我拥有什么以及我试图解决这个问题。

这是调用＃page-map的代码，在另一个名为#ListOfPlaces的页面的内容中

  <a href="#page-map" data-role="button" data-inline="true" onClick="javascript:SetCoordinate('Place1');" >Show Map</a> </p>

使用此javascript:SetCoordinate函数，我设置了不同的Lon。和拉特。比我在center: myLatlng,

下面的函数中使用的更多

此处我包括在Index.html

中

<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> 
<script type="text/javascript" src="jquery-mobile/jquery.ui.map.js"></script>

这是我的代码，它显示了第一次正常工作的地图：

<script type="text/javascript" >
    //funziona ma senza marker
        $(document).on('pageshow', '#page-map', function() {  
        var myLatlng = new google.maps.LatLng(sLat, sLon);
        var myOptions = {
            zoom: 12,
            center: myLatlng,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        }
        $('#map_canvas').fadeOut(300, function(){

          var infowindow = new google.maps.InfoWindow({
          content: sHTMLPlace
          });
            var map= new google.maps.Map(document.getElementById('map_canvas'), myOptions);
            var marker = new google.maps.Marker({
                position: myLatlng,
                title: 'Here is the place'
            });
              //google.maps.event.trigger(map, 'resize')
             google.maps.event.addListener(marker, 'click', function() {infowindow.open(map,marker
             );

        });
            marker.setMap(map);
            $(this).fadeIn(300);
        });     
        });

</script>

根据文档，我应该在创建地图后重新调整地图以解决此特定问题，但它无法解决问题。

我注意到，当我回到浏览器或后退按钮并重新加载页面（F5）时，如果我点击链接（显示地图），地图将再次开始工作，或者当我开启时它没有正确显示的地图，我进入Chrome Web Developer控制台，地图刷新并正常工作。

我尝试的另一件事是使用以下代码模拟“#ListOfPlaces”上的F5

function refreshPage()
{
    jQuery.mobile.changePage(window.location.href, {
        allowSamePageTransition: true,
        transition: 'none',
        reloadPage: true
    });
}

它也没有帮助。任何建议或文件都被接受，请提前感谢您的帮助。

谷歌地图API3应用程序为什么不能再来回使用了

0 个答案: