谷歌的Javascript地图API加载在Web浏览器而不是Android浏览器

问题描述

我无能，为什么不能在我的手机浏览器中运行，但它会在我的电脑浏览器上运行，铬是准确的。

可以在任何你提供反馈意见。

链接到我在测试这个服务器：

<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>

I originally just copied and pasted the code from the API site and it worked fine but as soon as I started pulling GPS data it stopped working on my mobile device's browser. Any help would be appreciated.

解决方案

navigator.geolocation.getCurrentPosition doesn't return a position. So you can't use that result as a parameter of addDomListener(window, ...

What it does, is send a request. When that request is ready, a callback is triggerd. In that callback you can trigger your function success() (I named it initialize).

---

Just to show what's going on.You can still choose if this is a good way to proceed.Feel free to rename, extend, ...

<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>

Probably it's a better idea to first load a map and set a default location.When the location is found, you change the center and set the marker.Notice now: if the location is not found, it takes quite a long time before locationNotFound is called

这篇关于谷歌的Javascript地图API加载在Web浏览器而不是Android浏览器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！