javascript - Google Maps Javascript API v3 map 显示在桌面浏览器上，但不会显示在移动浏览器上

Question

我正在开发一个使用 Google Maps Javascript API v3 显示 map 的应用程序，它在我的桌面浏览器上按应有的方式显示，但在我的移动浏览器上却不然。

所以，我检查了这个: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 的 $(document) 调用 getCurrentPosition()。准备好()。

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

<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 上运行良好。我尝试在手机上访问它，但一直显示错误。我最终通过将 https://添加到我在手机上访问的地址解决了该问题。即使您的网站上没有 SSL，只需将 https://添加到 URL 即可。