谷歌地图：鉴于纬度坐标

Question

我有以下经纬度坐标（在JS数组中），我们如何在这些坐标上绘制带有标记的Google地图。

请举一个简单的例子，因为API文档中的例子并没有给出确凿的答案，或者对我来说太复杂。

43.82846160000000000000，-79.53560419999997000000

43.65162010000000000000，-79.73558579999997000000

43.75846240000000000000，-79.22252100000003000000

43.71773540000000000000，-79.74897190000002000000

在此先感谢。

Answer 1

你可以试试这个

var map, 
locations = [ 
    [43.82846160000000000000, -79.53560419999997000000], 
    [43.65162010000000000000, -79.73558579999997000000], 
    [43.75846240000000000000, -79.22252100000003000000], 
    [43.71773540000000000000, -79.74897190000002000000] 
]; 
var myOptions = { 
    zoom: 6, 
    center: new google.maps.LatLng(locations[0][0], locations[0][1]), 
    mapTypeId: google.maps.MapTypeId.ROADMAP 
}; 
map = new google.maps.Map($('#map')[0], myOptions); 
var infowindow = new google.maps.InfoWindow(), marker, i; 
for (i = 0; i < locations.length; i++) { 
    marker = new google.maps.Marker({ 
     position: new google.maps.LatLng(locations[i][0], locations[i][1]), 
     map: map 
    }); 

    google.maps.event.addListener(marker, 'click', (function(marker, i) { 
     return function() { 
      infowindow.setContent('Current location is: '+ locations[i][0]+', '+locations[i][1]); 
      infowindow.open(map, marker); 
     } 
    })(marker, i)); 
} 

DEMO。

Answer 2

我已经使用谷歌地图，如果你只需要放置几个标记（确保你使用的API v3）V2是折旧，并会在某个时候下降。接下来，你的经纬度。他们需要削减到9或10个字符。当我使用超长/经度长的Coords值时，我一直不走运。

谷歌有一个不错的工具，可以让你建立一个地图。从这里开始：

https://developers.google.com/maps/documentation/javascript/

意识到你需要在你的域名主机管理的关键。你可以在这里得到你的关键：

https://developers.google.com/maps/signup

演示的一个长长的清单，与65倍API的例子。

https://developers.google.com/maps/documentation/javascript/demogallery

在演示，我发现这个示例看起来接近。通过查看源代码重新使用您找到的代码。您可以通过此链接查看纬度/长度坐标对以及它如何调用它。

http://gmaps-samples-v3.googlecode.com/svn/trunk/smartinfowindow/js/data.js

这里是一个校园地图示例。

http://beta.gr-3.net/map-api/

最后，这里是最简单的例子。一个标记地图。查看源代码并重新使用它。希望这足以让你开始。

https://google-developers.appspot.com/maps/documentation/javascript/examples/marker-simple

我希望这一切都是有帮助的。

Answer 3

首先，你需要创建谷歌地图对象，地方head标签内你会不会听的事件做好准备并在处理程序有：

var mapOptions = 
    { 
     zoom: 10, 
     center: new google.maps.LatLng(<%= @drawings.first.latitude %>, <%= @drawings.first.longitude %>), 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    }; 

    map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions); 

这里假设你使用ID map_canvas提供你的HTML有一个div。

比你应该准备好向页面添加标记，你应该有你的坐标存储在一个数组中，所以你可以遍历它和这些标记。

for(var i=0; i < coords.length; i++) 
{ 
    latlng = coords[i].latitude + ", " + coords[i].longitude; 

    var marker = new google.maps.Marker({ 
     position: latlng, 
     map: map, 
     title: '', 
     icon: "http://maps.google.com/mapfiles/marker" + String.fromCharCode(coords.length + 65) + ".png" 
    }); 
}