javascript - 从数组中在谷歌地图上放置多个标记

标签 javascript google-maps geocode

我正在尝试在 map 上放置多个标记,这些标记由数组提供。现在只有我的初始点加载(纽约市)。

var geocoder;
var map;
var markersArray = [];

//plot initial point using geocode instead of coordinates (works just fine)
  function initialize() {
    geocoder = new google.maps.Geocoder();
     latlang = geocoder.geocode( { 'address': 'New York City'}, function(results, status) { //use latlang to enter city instead of coordinates 
            if (status == google.maps.GeocoderStatus.OK) {
                map.setCenter(results[0].geometry.location);
                marker = new google.maps.Marker({
                map: map,
                position: results[0].geometry.location
                });
            markersArray.push(marker);
            }
            else{
            alert("Geocode was not successful for the following reason: " + status);
            }
        });
    var myOptions = {
        center: latlang, zoom: 5, mapTypeId: google.maps.MapTypeId.SATELLITE,
        navigationControlOptions: {
            style: google.maps.NavigationControlStyle.SMALL
        }
    };
     map = new google.maps.Map(document.getElementById("map_canvas"),
        myOptions);

  }

///////////////////////////////////////////////////////////
//Everything below this line is for attempting to plot the markers

  var locationsArray = ['Pittsburgh','Chicago', 'Atlanta'];

  function plotMarkers(){
for(var i = 0; i < locationsArray.length; i++){
  codeAddresses(locationsArray[i]);
}
  }

  function codeAddresses(address){
    geocoder.geocode( { 'address': address}, function(results, status) { 
            if (status == google.maps.GeocoderStatus.OK) {
                map.setCenter(results[0].geometry.location);
                marker = new google.maps.Marker({
                map: map,
                position: results[0].geometry.location
                });
            //markersArray.push(marker); 
            }
            else{
            alert("Geocode was not successful for the following reason: " + status);
            }
  });
  }

最佳答案

您实际上并没有在上面代码段的任何地方调用 plotMarkers!当我添加到初始化的末尾时(定义 map 后),效果很好! http://jsfiddle.net/T5aKE/

       ...
         map = new google.maps.Map...
         plotMarkers();
       ...

关于javascript - 从数组中在谷歌地图上放置多个标记,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10688509/

相关文章:

java - Mobile Backend Starter subscribeToCloudMessage 将不起作用

php - 国家/城市/州验证

r - 在 R 中将 Bing 选项与 taRifx.geo 结合使用

javascript - 使用 jQuery 或其他库的 Apple Cover-flow 效果?

javascript - 根据变量选择 Vue 过滤器

javascript - 身份验证后无法从 Firebase 读取数据

iphone - MKMapView:获取相对缩放比例?

javascript - 隐藏 Angular ng-repeat 的最后 2 条记录

android - 谷歌地图在长时间打开时在 Android TV 中闪烁

IOS 9 问题 : CLGeocoder Network error code 2