Question

我想使用Google地图标记来标记我们提供服务的地方。使用Lat / Long的MY代码工作正常但在我的项目中我需要使用城市名称而不是纬度/经度。我怎么能做到这一点有没有办法做到这一点？这是我的代码

        <div id="map" style="height:500px;"></div>
    <script>
        var neighborhoods = [
          { lat: 31.6400, lng: 74.8600 },
          { lat: 28.6139, lng: 77.2090 },
          { lat: 12.9667, lng: 77.5667 },
          { lat: 31.3260, lng: 75.5760 },
          { lat: 30.7500, lng: 76.7800 },
          { lat: 30.3400, lng: 76.3800 }
        ];

        var markers = [];
        var map;

        function initMap() {
            map = new google.maps.Map(document.getElementById('map'), {
                zoom: 5,
                center: { lat: 28.6139, lng: 77.2090 }
            });
        }

        function drop() {
            clearMarkers();
            for (var i = 0; i < neighborhoods.length; i++) {
                addMarkerWithTimeout(neighborhoods[i], i * 200);
            }
        }

        function addMarkerWithTimeout(position, timeout) {
            window.setTimeout(function () {
                markers.push(new google.maps.Marker({
                    position: position,
                    map: map,
                    title: 'Jassie',
                    animation: google.maps.Animation.DROP
                }));
            }, timeout);
        }

        function clearMarkers() {
            for (var i = 0; i < markers.length; i++) {
                markers[i].setMap(null);
            }
            markers = [];
        }
        $(window).load(function () {
            drop();
        });
    </script>
    <script async defer src="https://maps.googleapis.com/maps/api/js?key=API_Key&signed_in=true&callback=initMap">  </script>
</div>

Answer 1

根据规范（https://developers.google.com/maps/documentation/javascript/markers），您必须使用long / lat值来添加标记。但是，您可以使用Google地理编码API（https://developers.google.com/maps/documentation/geocoding/intro）将地址转换为long / lat值。所以基本上你的流程变成了：

地理编码地址x
获取结果并将其用于标记

Answer 2

您必须使用地理编码API。制作Lat / lng地址的示例：

 doGeocode: function (address, postal_code, callback) {
    console.log("TEST: "+address.toString());
    var geocoder = new google.maps.Geocoder();
    geocoder.geocode({
        'address': address,
        'componentRestrictions': {
            'postalCode': postal_code,
            'country': 'de'
        }
    }, function (results, status) {
        if (status === google.maps.GeocoderStatus.OK) {
            callback(results);
        } else {
            //Error handling
            alert('Geocode was not successful for the following reason: ' + status);
        }
    });

注意：地址也可以包含houseNumber，但输入空格。

从Lat / lng获取地址也有相反的方法。以防万一需要：

reverseGeocoder: function (lat, lng, callback) {

    var geocoder = new google.maps.Geocoder;
    var addressComponents = {};
    geocoder.geocode({
        'location': {
            lat:lat,
            lng: lng
        }
    }, function (results, status){
        if(status === google.maps.GeocoderStatus.OK){
            if (results[1]) {
                var result = results[0].address_components;

                for (var i = 0; i < result.length; i++) {
                    if (result[i].types[0] == "route") {
                        console.log(result[i].long_name);
                        addressComponents.route = result[i].long_name
                    }
                    if (result[i].types[0] == "street_number") {
                        console.log(result[i].long_name);
                        addressComponents.street_number = result[i].long_name
                    }
                    if (result[i].types[0] == "locality") {
                        console.log(result[i].long_name);
                        addressComponents.locality = result[i].long_name
                    }
                    if (result[i].types[0] == "postal_code") {
                        console.log(result[i].long_name);
                        addressComponents.postal_code = result[i].long_name
                    }
                }
                callback(addressComponents);
            } else {
                alert('No information found.');
            }

        }else {
            alert("Die geolocation abfrage konnte leider nicht ausgeführt werden. "+status);
        }
    });

从上面的第一个函数中，您将获得Lat / lng。然后只需使用这样的函数：

var newMarkers = [];        //Global marker array
 marker: function (lat, lng) {
    console.log("new marker");

    //console.log("LAT: "+lat+ "LNG: "+lng);
    var marker = new google.maps.Marker({
        position: {lat: lat, lng: lng},
        icon: icon,
        map: map
    });
    markers.push(marker);
    marker.addListener('click', function () {
        //InfoWindow or whatever u want
    });

    map.setCenter({lat: lat, lng: lng});
    map.setZoom(16);
},

如何在Google Map API中使用Address而不是Lat / Long

2 个答案: