代码之家 › 专栏 › 技术社区 › user3479267

谷歌地图API地理编码得到正确的长和纬度,但放置错误的标记

google-maps api javascript

0

user3479267 · 技术社区 · 7 年前

下面是我使用google maps api获取我想要的地址并将其放置在地图上的代码。每次我运行该页面时,它都会将标记放置在加纳南部的海洋上,并将地图居中,即使我通过控制台记录它从地址获得的长和纬度,它也是北爱尔兰贝尔法斯特的正确坐标。

google.maps.event.addDomListener(window, 'load', init);

function init() {

    var latNo = null;
    var lngNo = null;

    var postcode = $(".postcode-var").text();
    var address = "Belfast, Northern Ireland";

    var geocoder = new google.maps.Geocoder();

    geocoder.geocode( { 'address': address}, function(results, status) {

        if (status == google.maps.GeocoderStatus.OK) {
            latNo = results[0].geometry.location.lat();
            lngNo = results[0].geometry.location.lng();
            console.log(latNo + "" + lngNo);
        } else {
            console.log("Cannot find address");
        }

    });

    var mapOptions = {
        zoom: 14,
        disableDefaultUI: true,
        center: new google.maps.LatLng(latNo, lngNo),
        styles: [{"featureType":"administrative","elementType":"labels.text.fill","stylers":[{"color":"#444444"}]},{"featureType":"landscape","elementType":"all","stylers":[{"color":"#f2f2f2"}]},{"featureType":"poi","elementType":"all","stylers":[{"visibility":"off"}]},{"featureType":"road","elementType":"all","stylers":[{"saturation":-100},{"lightness":45}]},{"featureType":"road.highway","elementType":"all","stylers":[{"visibility":"simplified"}]},{"featureType":"road.arterial","elementType":"labels.icon","stylers":[{"visibility":"off"}]},{"featureType":"transit","elementType":"all","stylers":[{"visibility":"off"}]},{"featureType":"water","elementType":"all","stylers":[{"color":"#6863CE"},{"visibility":"on"}]}]
    };

    var mapElement = document.getElementById('map');

    var map = new google.maps.Map(mapElement, mapOptions);

    var marker = new google.maps.Marker({
        position: new google.maps.LatLng(latNo, lngNo),
        map: map
    });

    }

1 回复 | 直到 7 年前

1

ScaisEdge 7 年前

geocoder.geocode( { 'address': address}, function(results, status) {

    if (status == google.maps.GeocoderStatus.OK) {
        latNo = results[0].geometry.location.lat();
        lngNo = results[0].geometry.location.lng();
        console.log(latNo + "" + lngNo);
    } else {
        console.log("Cannot find address");
    }

});

或者尝试将坐标指定给现有标记

google.maps.event.addDomListener(window, 'load', init);

function init() {

    var latNo = null;
    var lngNo = null;
    var mapOptions = {
        zoom: 14,
        disableDefaultUI: true,
        center: new google.maps.LatLng(latNo, lngNo),
        styles: [{"featureType":"administrative","elementType":"labels.text.fill","stylers":[{"color":"#444444"}]},{"featureType":"landscape","elementType":"all","stylers":[{"color":"#f2f2f2"}]},{"featureType":"poi","elementType":"all","stylers":[{"visibility":"off"}]},{"featureType":"road","elementType":"all","stylers":[{"saturation":-100},{"lightness":45}]},{"featureType":"road.highway","elementType":"all","stylers":[{"visibility":"simplified"}]},{"featureType":"road.arterial","elementType":"labels.icon","stylers":[{"visibility":"off"}]},{"featureType":"transit","elementType":"all","stylers":[{"visibility":"off"}]},{"featureType":"water","elementType":"all","stylers":[{"color":"#6863CE"},{"visibility":"on"}]}]
    };

    var mapElement = document.getElementById('map');

    var map = new google.maps.Map(mapElement, mapOptions);

    var marker = new google.maps.Marker({
        position: myLatLng,
        map: null
    });

    var postcode = $(".postcode-var").text();
    var address = "Belfast, Northern Ireland";

    var geocoder = new google.maps.Geocoder();

    var myLatLng = geocoder.geocode( { 'address': address}, function(results, status) {

        if (status == google.maps.GeocoderStatus.OK) {
            latNo = results[0].geometry.location.lat();
            lngNo = results[0].geometry.location.lng();
            console.log(latNo + "" + lngNo);
            map.setCenter(results[0].geometry.location);
            marker.setPosition(results[0].geometry.location);
            marker.setMap(map);

        } else {
            console.log("Cannot find address");
        }

    });