使用 GPS 坐标修改地图的中心

Using GPS coordinates to modify the center of a map

本文关键字：地图 修改 GPS 坐标 使用      更新时间：2023-09-26

我想使用一个函数来使用GPS获取位置，然后使用坐标（经度和纬度）来修改地图的中心。

这是我代码的一部分：

var lat;
var longi;
function initialize() {
    if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(onGeoSuccess, onGeoError, {
            maximumAge: 3000,
            enableHighAccuracy: true
        });
        function onGeoSuccess(event) {
            lat = event.coords.latitude;
            longi = event.coords.longitude;
            alert(lat + ', ' + longi);
        }
        function onGeoError(event) {
            lat = 50;
            longi = 150;
        }
    } else {
        lat = 50;
        longi = 150;
    };
    var array;
    var map = new google.maps.Map(document.getElementById('map'), {
        zoom: 10,
        center: new google.maps.LatLng(lat, longi),
        mapTypeId: google.maps.MapTypeId.ROADMAP,
        disableDefaultUI: true,
        zoomControl: true
    });
}

问题是：警报很好，它显示实际的经度和纬度，但地图没有出现，它只给出了一个小问号。

任何帮助都是有益的。

而不是使用map.setCenter(lat,longi);

尝试：

map.set('center', new google.maps.LatLng(lat, longi));

您需要

在onGeoSuccess方法中居中地图：

所有冷杉map变量更高：

var lat, longi, map;

然后在onGeoSuccess方法上添加setCenter方法调用：

function onGeoSuccess(event){
    lat=event.coords.latitude;
    longi=event.coords.longitude;
    map.setCenter( new google.maps.LatLng(lat, longi) );
}

无论您在哪里更改lat, longi值，也可以onGeoError方法中执行此操作。

另外，最好对lat, longi使用一些默认值：

var lat = 50, 
  longi = 150, 
  map;

并将地图初始化向上移动（不要忘记删除var行之前的语句map = new google.maps.Map）：

function initialize() {
    var array;
    map = new google.maps.Map(document.getElementById('map'), {
        zoom: 10,
        center: new google.maps.LatLng(lat, longi),
        mapTypeId: google.maps.MapTypeId.ROADMAP,
        disableDefaultUI: true,
        zoomControl: true
    });
// rest of your code
相关文章：