Google 地图 Javascript API v3 地图显示在桌面浏览器上，但不会显示在移动浏览器上

Question

我正在开发一个使用 Google Maps Javascript API v3 显示地图的应用程序，它在我的桌面浏览器上显示它应该的方式，但它没有在我手机的浏览器上。

所以，我检查了这个：My Google Map javascript code displays on desktop browser but not my mobile phone browser

还有这个：Javascript Google Maps API loading in Web Browser but not Android Browser

这是我能找到的与我的问题相关的所有内容，但它们都有一个类似的问题，即它们将 navigator.geolocation.getCurrentPosition() 作为参数传递给它们的初始化函数或类似的东西，而不是传递初始化作为 getCurrentPosition() 的回调。我也看到有人遇到同样的问题，因为他们在文档加载之前询问当前位置，这也不是我的问题，因为我正在从 jQuery 调用 getCurrentPosition()' s $(文档).ready()。

这是我的代码，非常感谢任何帮助：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>        
    <script type="text/javascript" 
            src="http://maps.googleapis.com/maps/api/js?sensor=true">            
    </script>
<script type="text/javascript">
  function initialize(location) {
      console.log(location);
    var currentLocation= new google.maps.LatLng(location.coords.latitude, location.coords.longitude);
    var mapOptions = {            
      center: currentLocation,
      zoom: 17,
      disableDefaultUI:true,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var map = new google.maps.Map(document.getElementById("map_canvas"), 
       mapOptions);
    var marker= new google.maps.Marker({
        position:currentLocation,
        map: map
    });
  }    

  $(document).ready(function(){
     navigator.geolocation.getCurrentPosition(initialize);
  });
</script>

Answer 1

我在使用 navigator.geolocation 时也遇到了同样的问题，它似乎在 PC 上运行良好。我尝试在 phone 上访问它，但一直显示错误。我终于通过将 https:// 添加到我在手机上访问的地址来解决了这个问题。即使您的站点上没有 SSL，只需将 https:// 添加到 url 就可以了。

Google 地图 Javascript API v3 地图显示在桌面浏览器上，但不会显示在移动浏览器上

Google Maps Javascript API v3 map displays on desktop browser but won't display on mobile browser

javascript

jquery

google-maps-api-3

google-maps-markers