从JS数组添加标记到谷歌地图

我有数组：从JS数组添加标记到谷歌地图

var stops = []; 
    stops[1] = {name:'One', lat:51.9219465100951 ,long:-8.61797176722262}; 
    stops[2] = {name:'Two', lat:51.9270744 ,long:-8.6105043}; 
    stops[3] = {name:'Three)', lat:51.9254898 ,long:-8.6100269};

我通过努力环和在地图上显示这些标记物......

function initMap() { 
map = new google.maps.Map(document.getElementById('map'), { 
center: {lat: 51.933596, lng: -8.578540}, 
zoom: 14, 
mapTypeId: 'hybrid' 
}); 

for(var i=0; i<=stops.length; i++){ 
    var mypos = {stops[i].lat, stops[i].long}; 
    var marker = new google.maps.Marker({ 
    position: mypos, 
    map: map, 
    title: stops[i].name 
    }); 
} 
}

没有标志物正在绘制在地图上。

我收到了一个意外的令牌错误[在以下行上。 var mypos = {stops [i] .lat，stops [i] .lng};

我已经改变了这一点，但仍然无法让它工作。

来源

2016-09-15 Cian W

mypos需要是：

var mypos = {lat: stops[i].lat, lng: stops[i].long};

没有 “LAT” 和 “LNG：” 你”重新尝试将对象声明为数组。 '位置' 预计任一个LatLngLiteral（见上文）或经纬度对象，其被声明如下：

var mypos = new google.maps.LatLng(stops[i].lat, stops[i].long};

来源

2016-09-15 19:46:34 LinuxDisciple

谢谢您更改为LatLng对象。它正确地放置标记，但也显示错误：“未捕获的TypeError：无法读取未定义的属性'lat' –

您的for循环看起来像是要多一轮。数组是零索引的，所以它首先触发停止[0]，这是未定义的。在for循环中使用'<'not'<='，并将数组声明为@charlietfl（不指定位置）。 – LinuxDisciple

要创建一个无效的对象，当你真正需要做的是通过stops[i]您的位置

var mypos = {stops[i].lat, stops[i].lng};

应该

var mypos =stops[i];

但是还有另外一个问题，数组索引是从零开始但你从一开始

一个更简单的方法来创建初始数组将是

var stops = [ 
    {name:'One', lat:51.9219465100951 ,lng:-8.61797176722262}, 
    {name:'Two', lat:51.9270744 ,lng:-8.6105043}, 
    {name:'Three)', lat:51.9254898 ,lng:-8.6100269} 
];

注意，属性名long已更改为lng以匹配地图脚本使用

来源

2016-09-15 19:44:41 charlietfl

在更改'长'到'lng'，对吧？ – LinuxDisciple

@LinuxDisciple yes..in initial array..pointless使用不同的属性名称 – charlietfl

检查代码例如：

$(window).load(function() { 
 
    $(document).ready(function() { 
 
    var map; 
 
    var elevator; 
 
    var myOptions = { 
 
     zoom: 1, 
 
     center: new google.maps.LatLng(0, 0), 
 
     mapTypeId: 'terrain' 
 
    }; 
 
    map = new google.maps.Map($('#map_canvas')[0], myOptions); 
 

 
    var addresses = ['Norway', 'Africa', 'Asia', 'North America', 'South America']; 
 

 
    for (var x = 0; x < addresses.length; x++) { 
 
     $.getJSON('http://maps.googleapis.com/maps/api/geocode/json?address=' + addresses[x] + '&sensor=false', null, function(data) { 
 
     var p = data.results[0].geometry.location 
 
     var latlng = new google.maps.LatLng(p.lat, p.lng); 
 
     new google.maps.Marker({ 
 
      position: latlng, 
 
      map: map 
 
     }); 
 

 
     }); 
 
    } 
 

 
    }); 
 
}); //]]>

<script type="text/javascript" src="//code.jquery.com/jquery-1.9.1.js"></script> 
 

 
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false&.js"></script> 
 

 

 
<style type="text/css"> 
 
    #map_canvas { 
 
    width: 500px; 
 
    height: 500px; 
 
    } 
 
</style> 
 

 
<div id="map_canvas"></div>

来源

2016-09-15 19:50:10

从JS数组添加标记到谷歌地图

回答

相关问题