谷歌地图API地理编码多个位置

此解决方案适用于两个位置，可能最多 10 个位置，之后您将开始遇到地理编码器上的查询和速率限制

1. 分离出初始化函数，只需初始化地图即可
2. 为每个位置创建一个唯一的地理编码器实例（您可以通过在回调中重复使用相同的地理编码器实例来重复使用该实例，不值得两点）。

工作小提琴

工作代码片段：

function initialize() {
    var myOptions = {
        zoom: 2,
        panControl: false,
        zoomControl: false,
        mapTypeControl: false,
        streetViewControl: false,
        center: {
            lat: 0,
            lng: 0
        },
        mapTypeId: google.maps.MapTypeId.ROADMAP,
        mapTypeControl: false,
        scrollwheel: false,
    };
    var bounds = new google.maps.LatLngBounds();
    var map = new google.maps.Map(document.getElementById("google-container"), myOptions);
    var geocoder = new google.maps.Geocoder();
    var address = "Seoul";
    geocoder.geocode({
        'address': address
    }, function (results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
            var marker = new google.maps.Marker({
                position: results[0].geometry.location,
                map: map,
            });
            bounds.extend(results[0].geometry.location);
            map.fitBounds(bounds);
        } else {
            alert("Geocode of " + address + " failed," + status);
        }
    });
    var geocoder2 = new google.maps.Geocoder();
    var address2 = "Melbourne";
    geocoder2.geocode({
        'address': address2
    }, function (results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
            var marker = new google.maps.Marker({
                position: results[0].geometry.location,
                map: map,
            });
            bounds.extend(results[0].geometry.location);
            map.fitBounds(bounds);
        } else {
            alert("Geocode of " + address2 + " failed," + status);
        }
    });
}
google.maps.event.addDomListener(window, 'load', initialize);

html, body, #google-container {
    height: 100%;
    width: 100%;
    margin: 0px;
    padding: 0px
}

<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCkUOdZ5y7hMm0yrcCQoCvLwzdM6M8s5qk"></script>
<div id="google-container" style="border: 2px solid #3872ac;"></div>

here is some code optimization allows to process multiple addresses
      <div id="map-canvas"
   style='position: relative; height: 100%; width: 100%; margin-left: 0px; border: #B8B6B8 solid 1px;; background-color: #ffffff;'>
  </div> 
<script type="text/javascript">
    var geocoder;
    var map;
    function initialize() {
        geocoder = new google.maps.Geocoder();
        var latlng = new google.maps.LatLng(-34.397, 150.644);
        var mapOptions = {
            zoom : 17,
            center : latlng,
            mapTypeId : google.maps.MapTypeId.ROADMAP
        };
        map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions);
    }
    function codeAddress(addressList) {
        try {
            var icount = addressList.length;
            for (var i = 0; i < icount; i++) {
                getGeoCoder(addressList[i]);
            }
        } catch (error) {
            alert(error);
        }
    }
    function getGeoCoder(address) {
        geocoder.geocode({
            'address' : address
        }, function(results, status) {
            if (status == google.maps.GeocoderStatus.OK) {
                map.setCenter(results[0].geometry.location);
                var marker = new google.maps.Marker({
                    map : map,
                    position : results[0].geometry.location
                });
            } else {
                geterrorMgs(address); // address not found handler
            }
        });
    }
    //client's call
//addresses list to be processed
    var addressList = [ '1420 orchardview dr Pittsburgh,  PA,  USA', '1440 orchardview dr Pittsburgh,  PA,  USA', '1410 orchardview dr Pittsburgh,  PA,  USA' ];
        initialize();  
        codeAddress(addressList);
</script>