如何動態更改Google地圖標記圖標

我正在使用ajax和php，並且我抓取了我的數據庫中的所有點並將它們繪製在地圖上。哪些工作正常。不過，我想根據數據庫中的狀態是100或200還是300來更改標記的圖標。我似乎無法得到任何工作。這裏是我的代碼：如何動態更改Google地圖標記圖標

if (localStorage.getItem('type2') !== null) { 


    $(function() 

    { 
     var radius2 = localStorage.getItem("radius2"); 
     var lat2 = localStorage.getItem("lat2"); 
     var long2 = localStorage.getItem("long2"); 
     var type2 = localStorage.getItem("type2"); 
     var city2 = localStorage.getItem("city2"); 
     var rep2 = localStorage.getItem("rep2"); 
     var size2 = localStorage.getItem("size2"); 
     var status2 = localStorage.getItem("status2"); 

     $.ajax({ 
      url: 'http://example.com/Test/www/22233333.php', 
      data: "city2=" + city2 + "&rep2=" + rep2 + "&status2=" + status2 + "&size2=" + size2 + "&type2=" + type2 + "&long2=" + long2 + "&lat2=" + lat2 + "&radius2=" + radius2, 
      type: 'post', 
      dataType: 'json', 
      success: function (data) { 
       $.each(data, function (key, val) { 


        var lng = val['lng']; 
        var lat = val['lat']; 
        var id = val['id']; 
        var name = val['name']; 
        var address = val['address']; 
        var category = val['category']; 
        var city = val['city']; 
        var state = val['state']; 
        var rep = val['rep']; 
        var status = val['status']; 
        var size = val['size']; 

        $('div#google-map').gmap('addMarker', { 
         'position': new google.maps.LatLng(lat, lng), 
         'bounds': true, 
         'icon': 'images/hospital.png' 
        }).click(function() { 
         $('div#google-map').gmap('openInfoWindow', { 
          'backgroundColor': "rgb(32,32,32)", 
          'content': "<table><tr><td>Name:</td><td>" + name + "</td></tr><tr><td>Address:</td><td>" + address + ", " + city + "&nbsp;" + state + "</td></tr><tr><td>Category:</td><td>" + category + "</td></tr><tr><td>Rep:</td><td>" + rep + "</td></tr><tr><td>Status:</td><td>" + status + "</td></tr><tr><td>Size:</td><td>" + size + "</td></tr></table>" 
         }, this); 


        }); 

       }) 

      } 
     }); 


    }) 
}

來源

2012-03-27 Bill paxton

看起來像你使用jQuery UI的地圖？

我沒有使用過這種抽象

可以調用的setIcon功能 - 一個標記，你可以將它的圖標，這種方式的主要API https://developers.google.com/maps/documentation/javascript/reference#Marker

所以你addMarker方法將返回一個標記通過它的外觀實例，所以一旦你運行setIcon

來源

2012-03-27 16:12:44

在$。每次不要在你的成功的功能是這樣用。狀態是數據庫領域

var size = val['size']; 
var status = val['status']; 
var icon = ''; 
if (status == 100){ 
    icon = 'images/icon1.png'; //your icon1 
}else if (status == 100){ 
    icon = 'images/icon1.png'; //your icon2 
} 
... 




$('div#google-map').gmap('addMarker', { 
     'position': new google.maps.LatLng(lat, lng), 
     'bounds': true, 
     'icon': icon //your dynamic icon 
})

希望這有助於

來源

2012-03-27 16:11:25 jems

如何動態更改Google地圖標記圖標

回答

相關問題