谷歌从数组中映射标记、折线和窗口信息


Google maps markers , polyline and window info from array

我想从数组点(从ajax页面)显示一条带有标记和窗口信息的折线
这是索引页面代码:

var gmarkers = []; 
var map = null;
function initialize() {
  var myOptions = {
    zoom: 15,
    center: new google.maps.LatLng(27.332702, 53.177137),
    // mapTypeControlOptions: {style: google.maps.MapTypeControlStyle.DROPDOWN_MENU},
    mapTypeId: google.maps.MapTypeId.ROADMAP
  }
  map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
  google.maps.event.addListener(map, 'click', function() {
        infowindow.close();
        });
}
var infowindow = new google.maps.InfoWindow(
  { 
    size: new google.maps.Size(150,50)
  });
function myclick(i) {
  google.maps.event.trigger(gmarkers[i], "click");
}
function createMarker(latlng, name, html) {
    var contentString = html;
    var marker = new google.maps.Marker({
        position: latlng,
        map: map,
        zIndex: Math.round(latlng.lat()*-100000)<<5
        });
    google.maps.event.addListener(marker, 'click', function() {
        infowindow.setContent(contentString); 
        infowindow.open(map,marker);
        });
    // save the info we need to use later for the side_bar
    gmarkers.push(marker);
}

我的Ajax页面:

var polylines = [];
var beaches = [
    ['Bondi Beach',10,15, 4],
    ['Coogee Beach',11,16, 5],
    ['Cronulla Beach',13,15, 3],
    ['Manly Beach',13,17, 2],
    ['Maroubra Beach',12,10, 1]
];
for (var i = 0; i < beaches.length; i++) {
    var beach = beaches[i];
    var myLatLng = new google.maps.LatLng(beach[1], beach[2]);
    var polylines = new google.maps.LatLng(beach[1], beach[2]);
    var marker = createMarker(myLatLng,"This place",beach[0])
}
var routes = new google.maps.Polyline({
    path: polylines,
    strokeColor: "#FF0000",
    strokeOpacity: 0.6,
    strokeWeight: 4
});
routes.setMap(map);

在我调用Ajax Page后,标记添加了窗口信息,但路线折线没有显示,问题出在哪里?

在我调用Ajax页面后,标记添加了窗口信息,但路由折线没有显示,问题出在哪里?

是的。折线在这里是一个数组:

var polylines = [];

在这里你可以用一个谷歌覆盖它。maps.LatLng:

var polylines = new google.maps.LatLng(beach[1], beach[2]);

你可能想这样做:

polylines.push(new google.maps.LatLng(beach[1], beach[2]));