2013-11-21 88 views
0

我希望能夠在頁面加載時顯示特定的infowindows。因此,而不是用戶必須懸停在他們上面,他們已經被加載 - 但是,我只想在我的陣列中的4個標記中的2個上做這個。在Google地圖陣列中顯示特定的infowindows

var marker, i; 
    var markers = []; 
    var locations = [ 
     ['<div style="width: 170px;">Title1</div>', 50.794785, -1.116947, image], 
     ['<div style="width: 190px;">Title2</div>', 50.797, -1.109, image], 
     ['<div style="width: 120px;">Title3', 50.796928, -1.107119, '../images/map-pointer.png'], 
     ['<div style="width: 150px;">Title4</div>', 50.794703, -1.117880, '../images/map-pointer.png'] 
    ]; 
for (i = 0; i < locations.length; i++) { 
       marker = new google.maps.Marker({ 
        position: new google.maps.LatLng(locations[i][1], locations[i][2]), 
        map: map, 
        icon: locations[i][3], 
        //visible: false, 
        zIndex: 10 
       }); 

       /* Open marker on mouseover */ 
       google.maps.event.addListener(marker, 'mouseover', (function(marker, i) { 
       return function() { 
        infowindow.setContent(locations[i][0]); 
        infowindow.open(map, marker); 
       } 
       })(marker, i)); 
       markers.push(marker); // save all markers 


      }    
      /* Change markers on zoom */ 
      google.maps.event.addListener(map, 'zoom_changed', function() { 
       var zoom = map.getZoom(); 
       // iterate over markers and call setVisible 
       for (i = 0; i < locations.length; i++) { 
        markers[i].setVisible(zoom >= 15); 
       } 

       if (map.getZoom()>=15) { 
        flightPath.setMap(map) 
       } else { 
        flightPath.setMap(null) 
       } 
      }); 

我想我也許能夠做的是添加到陣列假/真在最後像這樣:

var locations = [ 
     ['<div style="width: 170px;">Title1</div>', 50.794785, -1.116947, image,true], 
     ['<div style="width: 190px;">Title2</div>', 50.797, -1.109, image,true], 
     ['<div style="width: 120px;">Title3', 50.796928, -1.107119, '../images/map-pointer.png',false], 
     ['<div style="width: 150px;">Title4</div>', 50.794703, -1.117880, '../images/map-pointer.png',false] 
    ]; 

然後某種IF語句,如:

if ((marker[i][4]) == true) { 
    infowindow.open(map, marker); 
} 

它不適合我,但我在正確的軌道上?這將是如何完成的?

編輯

所以,這部分工作。

這是我的for循環看起來像目前:我的「真實的,雖然

for (i = 0; i < locations.length; i++) { 
      marker = new google.maps.Marker({ 
       position: new google.maps.LatLng(locations[i][1], locations[i][2]), 
       map: map, 
       icon: locations[i][3], 
       //visible: false, 
       zIndex: 10 
      }); 

      /* Check to see if it should open */ 
      if ((locations[i][4]) == 'true') { 
       infowindow.setContent(locations[i][0]); 
       infowindow.open(map, marker); 
      } 

      /* Open marker on mouseover */ 
      google.maps.event.addListener(marker, 'mouseover', (function(marker, i) { 
       return function() { 
        infowindow.setContent(locations[i][0]); 
        infowindow.open(map, marker); 
       } 
      })(marker, i)); 
      markers.push(marker); // save all markers 


     } 

它只是做一個 - 說我猜想那是因爲我需要的信息窗口的多個實例,如人以下。

編輯:管理做它 - 對於那些有興趣見下文!

+0

什麼是「marker [i] [4]」?這看起來不正確。需要成爲你的位置數組。 – geocodezip

回答

0

管理做到了!對於那些感興趣的人:

var infowindow = new google.maps.InfoWindow(); 
var marker, i; 
var markers = []; 
var locations = [ 
    ['<div style="width: 170px;">Title1</div>', 50.794785, -1.116947, image,'true'], 
    ['<div style="width: 190px;">Title2</div>', 50.797, -1.109, image,'true'], 
    ['<div style="width: 120px;">Title3', 50.796928, -1.107119, '../images/map-pointer.png','false'], 
    ['<div style="width: 150px;">Title4</div>', 50.794703, -1.117880, '../images/map-pointer.png','false'] 
]; 

for (i = 0; i < locations.length; i++) { 
    marker = new google.maps.Marker({ 
    position: new google.maps.LatLng(locations[i][1], locations[i][2]), 
    map: map, 
    icon: locations[i][3], 
    //visible: false, 
    zIndex: 10 
    }); 

    /* Open specific markers on page load */ 
    var infocontent = locations[i][0];   

    if ((locations[i][4]) == 'true') { 
    var infwin = new google.maps.InfoWindow({content: infocontent}); 
    infwin.open(map, marker); 
    } 

    /* Open marker on mouseover */ 
    google.maps.event.addListener(marker, 'mouseover', (function(marker, i) { 
    return function() { 
     infowindow.setContent(locations[i][0]); 
     infowindow.open(map, marker); 
    } 
    })(marker, i)); 
    markers.push(marker); // save all markers 

} 
0

應該

if ((locations[i][4]) == true) 

更多的問題:

  • 當前信息窗口沒有任何內容(內容設置的onmouseover)。而不是編程方式打開信息窗口,觸發鼠標懸停在標記:
 if ((locations[i][4])) { 
     google.maps.event.trigger(marker,'mouseover'); 
    }
  • 看來,您使用的是單google.maps.InfoWindow -instance,當你想有多個信息窗口打開,你必須使用多個實例與此同時。
+0

謝謝你。我將如何去做多個infoWindows?它會變成infowindow,我=新google.maps.InfoWindow(); ? – user1788364