設置每個標記谷歌地圖的內容

Question

需要一個快速幫助設置爲我創建

我通過我的位置的OBJ持有緯度，經度每個標記循環每個標記的內容（locationObj ）， 每個標記的內容由其他obejct（PermutationObj）保存。

例如：

locationObj-- > {"Lat":"34.163291","Lng":"-118.685123"} etc.... 

PermutationObj -- > ElectronicPopContent,LocationName 

事情是我得到的一切，我顯示地圖第一內容，並從PermutationObj位置名稱上的標記。

我該如何解決？

JS代碼：

var locationObj; 
     var PermutationObj; 
     var map; 
     var mapOptions; 

     var shape = { 
      coord: [1, 1, 1, 20, 18, 20, 18, 1], 
      type: 'poly' 
     }; 





     function setMap(locationList, permutation) { 
      // List of Lat,Lng 
      locationObj = $.parseJSON(locationList); 
      PermutationObj = $.parseJSON(permutation); 


      var qMapTypeId = google.maps.MapTypeId.SATELLITE 
      var LatLngCenter = new google.maps.LatLng(34.163291, -118.685123); 
      var mapOptions = { 
       zoom: 4, 
       center: LatLngCenter, 
       mapTypeControl: true, 
       mapTypeControlOptions: { 
        style: google.maps.MapTypeControlStyle.DROPDOWN_MENU 
       } 
      } 
      var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions); 

      var bounds = new google.maps.LatLngBounds(); 
      for (i in locationObj) { 
       var LatLngPair = new google.maps.LatLng(locationObj[i]["Lat"], locationObj[i]["Lng"]); 

       bounds.extend(LatLngPair); 
       map.fitBounds(bounds); 


//    for (j in PermutationObj) { 
//     // var image = PropObj[j]["ElectroincImageURL"]; 
//     var content = PermutationObj[j]["ElectronicPopContent"]; 
//     break 
//    } 

       var content = PermutationObj[i]["ElectronicPopContent"]; 

       marker = new google.maps.Marker({ 
        position: LatLngPair, 
        map: map, 
        draggable: false, 
        //     icon: image, 
        shape: shape, 
        anchorPoint: new google.maps.Point(12, -25) 

       }); 

       //Setting up the content of the info window dynamic wise. 
       var infowindow = new google.maps.InfoWindow({ 
        content: content 
       }); 



       //Setting up an event listener, When the user clicks the marker, an info window opens. 
       google.maps.event.addListener(marker, 'click', function() { 
        infowindow.setContent(content); 
        infowindow.open(map, marker); 
       }); 
      } 
     } 

Answer 1

改變了一些東西，首先是具有信息窗口中只有一個實例，另一種是存儲內容作爲標記屬性，並使用它的點擊，最後是每個標記使用var marker = ...代替marker = ...讓我知道這是否適用於您。

var locationObj; 
var PermutationObj; 
var map; 
var mapOptions; 
var infowindow = new google.maps.InfoWindow({ }); 

var shape = { 
    coord: [1, 1, 1, 20, 18, 20, 18, 1], 
    type: 'poly' 
}; 

function setMap(locationList, permutation) { 
    // List of Lat,Lng 
    locationObj = $.parseJSON(locationList); 
    PermutationObj = $.parseJSON(permutation); 


    var qMapTypeId = google.maps.MapTypeId.SATELLITE 
    var LatLngCenter = new google.maps.LatLng(34.163291, -118.685123); 
    var mapOptions = { 
      zoom: 4, 
      center: LatLngCenter, 
      mapTypeControl: true, 
      mapTypeControlOptions: { 
        style: google.maps.MapTypeControlStyle.DROPDOWN_MENU 
      } 
    } 
    var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions); 

    var bounds = new google.maps.LatLngBounds(); 
    for (i in locationObj) { 
     var LatLngPair = new google.maps.LatLng(locationObj[i]["Lat"], locationObj[i]["Lng"]); 

     //Are you sure you need these 2 lines here? 
     bounds.extend(LatLngPair); 
     map.fitBounds(bounds); 

     var marker = new google.maps.Marker({ 
      position: LatLngPair, 
      map: map, 
      draggable: false, 
      shape: shape, 
      anchorPoint: new google.maps.Point(12, -25), 
      infoWindowContent: PermutationObj[i]["ElectronicPopContent"] 

     }); 

     //Setting up an event listener, When the user clicks the marker, an info window opens. 
     google.maps.event.addListener(marker, 'click', function() { 
       infowindow.setContent(marker.infoWindowContent); 
       infowindow.open(map, marker); 
     }); 
    } 
}