2017-01-19 25 views
-2

この例(http://jsfiddle.net/upsidown/p646xmcr/)に従って、マップ上のマーカーの位置を5秒ごとに更新しています。今私は、私が時間と地理位置(またはビーチ配列のちょうど5番目の要素)を言う違う変数で私が持っているすべてのマーカーに情報ウィンドウを追加する方法を理解していません。配列マーカーにInfowindowを5秒ごとにリフレッシュするGoogleマップ

var map; 
var markers = []; // Create a marker array to hold your markers 
function initialize() { 
    var mapOptions = { 
     zoom: 5, 
     center: new google.maps.LatLng(10,12), 
     mapTypeId: google.maps.MapTypeId.SATELLITE 
    } 

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

    setMarkers(beaches); 

    // Bind event listener on button to reload markers 
    //document.getElementById('reloadMarkers').addEventListener('click', reloadMarkers); 
} 

var n = 0; 
setInterval(function reloadMarkers() { 
    n++; 
    var beaches = [ 
     ['Bondi Beach', 10+n, 10+n, 5], 
     ['Coogee Beach', 10-n, 11-n, 5], 
     ['Cronulla Beach', 10-n, 12+n, 3], 
     ['Manly Beach', 10+n, 13-n, 2], 
     ['Maroubra Beach', 10, 14, 1] 
    ]; 
    // Loop through markers and set map to null for each 
    for (var i=0; i<markers.length; i++) { 
     markers[i].setMap(null); 
    } 
    // Reset the markers array 
    markers = []; 
    // Call set markers to re-add markers 
    setMarkers(beaches); 

     var infowindow = new google.maps.InfoWindow({ 
     content: "infowindowstringg" 
     }); 
    marker.addListener('click', function() { 
     infowindow.open(map, marker); 
     }); 

}, 5000); 

function setMarkers(locations) { 
    for (var i = 0; i < locations.length; i++) { 
     var beach = locations[i]; 
     var myLatLng = new google.maps.LatLng(beach[1], beach[2]); 
     var marker = new google.maps.Marker({ 
      position: myLatLng, 
      map: map, 
      animation: google.maps.Animation.DROP, 
      title: beach[0], 
      zIndex: beach[3] 
     }); 
     google.maps.event.addListener(marker, 'click',) 
     // Push marker to markers array 
     markers.push(marker); 
    } 
} 



initialize(); 
+0

()のaddListenerに情報ウィンドウを追加するには、あなたの質問にはコードがありません。あなたは何を試しましたか(私はあなたが[InfoWindowsのドキュメント](https://developers.google.com/maps/documentation/javascript/infowindows)を見たとします)?あなたはどんな問題を抱えていますか? – geocodezip

+0

コードにInfowindowをマップに追加しようとしていません。あなたの質問に簡単に答えるのに十分なチュートリアルとドキュメンテーションがあります。 – MrUpsidown

+0

google.maps.event.addListener(マーカー、 'クリック')を追加してwchichが動作していないテストを編集しました。これを行うチュートリアルを教えてください。 – mmarcc

答えて

0

)(SetMarkersに情報ウィンドウ変数を定義するvar情報ウィンドウ=新しいgoogle.maps.InfoWindow()。

この

google.maps.event.addListener(marker, 'click', (function (marker, i) { 
     return function() { 
      infowindow.setContent(beaches[i][0]); 
      infowindow.open(map, marker); 
     } 
    })(marker, i)); 

の作業例

http://jsfiddle.net/p646xmcr/413/

関連する問題