Javascript Google Maps API 在 Web 浏览器中加载，但在 Android 浏览器中不加载

Question

我不明白为什么它不能在我的移动浏览器上运行，但它可以在我的 PC 浏览器(确切地说是 chrome)上运行。

你们中的任何人都可以提供反馈吗？

链接到我正在测试的服务器:

54.172.35.180/chat/chatlist.php

<script type="text/javascript">

    function success(position) {

      var latlng = new google.maps.LatLng(position.coords.latitude, position.coords.longitude);
      var myOptions = {
        zoom: 15,
        center: latlng,
      };
      var map = new google.maps.Map(document.getElementById("map-canvas"), myOptions);

      var marker = new google.maps.Marker({
          position: latlng, 
          map: map, 
          title:"You are here! (at least within a "+position.coords.accuracy+" meter radius)"
      });
    }

    google.maps.event.addDomListener(window, 'load', navigator.geolocation.getCurrentPosition(success));

</script>

我最初只是从 API 站点复制并粘贴代码，它工作得很好，但当我开始提取 GPS 数据时，它就停止在我的移动设备浏览器上工作。任何帮助，将不胜感激。

Answer 1

navigator.geolocation.getCurrentPosition 不返回位置。所以你不能使用该结果作为 addDomListener(window, ...

它的作用是发送请求。当该请求准备就绪时，将触发回调。在该回调中，您可以触发您的函数 success() (我将其命名为初始化)。

<小时/>

只是为了展示发生了什么。您仍然可以选择这是否是继续的好方法。随意重命名、扩展……

<script src="http://maps.googleapis.com/maps/api/js"></script>
<script type="text/javascript">
    function initialize(position, accuracy) {
      var latlng = position || new google.maps.LatLng(50.45, 4.45);    // set your own default location.  This gets called if the parameters are left blank.
      var myOptions = {
        zoom: 15,
        center: latlng
      };
      var map = new google.maps.Map(document.getElementById("map-canvas"), myOptions);
      if (position) {
        var marker = new google.maps.Marker({
            position: latlng, 
            map: map, 
            title: "You are here! (at least within a " + accuracy + " meter radius)"
        });
      }
      else {
        // position of the user not found
      }
    }
    function locationFound(position) {
      initialize( 
        new google.maps.LatLng(position.coords.latitude, position.coords.longitude),
        position.coords.accuracy
      );
    }
    function locationNotFound() {
      initialize(null, null);
    }
    function page_loaded() {
      // the page is loaded, we can send a request to search for the location of the user
      navigator.geolocation.getCurrentPosition(locationFound, locationNotFound);
    }
    google.maps.event.addDomListener(window, 'load', page_loaded);
</script>
<style>
#map-canvas {
  width: 500px;
  height: 400px;
}
</style>
<div id="map-canvas"></div>

首先加载 map 并设置默认位置可能是更好的主意。找到位置后，您可以更改中心并设置标记。现在注意:如果没有找到位置，则需要相当长的时间才能调用locationNotFound