Question

我需要知道如何在Google地图v3上添加多个标记来自地址。我正在一个网站上工作，该网站列出了10家企业，每页都有他们的地址，还有一张地图可以找到他们。我只为一个企业建立了地图，但我需要知道如何实现存储在变量名为address1，... 2，... 3，... 4中的多个地址。以下是我的一项业务代码：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Multiple Map</title>
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">  
var map;

function initialize() {
  geocoder = new google.maps.Geocoder();
  var latlng = new google.maps.LatLng(-34.397, 150.644);
  var myOptions = {
    zoom: 14,
    center: latlng,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  }
map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);    
var address = '52+E+20th+St, New+York, NY';
var address1 = '42+E+29th+St, New+York, NY';
var address3 = '56+W+25th+St, New+York, NY';
var address4 = '26+W+21th+St, New+York, NY';

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 {
    alert("Geocode was not successful for the following reason: " + status);
  }
}); 
  }  
</script>
</head>
<body onload="initialize()">
<div id="map_canvas" style="width:500px; height:250px"></div>
</body>
</html>

Answer 1

最近做了大致相同的事情：在下面的示例中，r包含地图中心纬度和经度以及标记列表。每个标记都有一个纬度和经度，一些文本显示标记，一个索引变量为每个结果使用不同的图标。

只需创建多个标记，并提供相同的map实例即可添加多个标记。地图库非常智能，可以全部显示。

var latlng = new google.maps.LatLng(r.dest.lat, r.dest.lng);
var myOptions = { zoom: 14, center: latlng, mapTypeId: google.maps.MapTypeId.ROADMAP };
window.map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

for (marker in r.markers)
{
    var m = r.markers[marker];
    var d = new google.maps.Marker({ position: new google.maps.LatLng(m.lat, m.lng),
                                     map: map,
                                     title: m.text,
                                     icon:"http://www.google.com/mapfiles/marker" + m.l + ".png" });
}

来自地址的Google Maps V3多个标记

1 个答案: