如何更改Google Maps API V3中的圖標顏色？

Question

我想將COUNTY圖標更改爲藍色（除紅色以外的任何內容）。

有沒有辦法爲特定點定義不同的圖標顏色？

<script type="text/javascript"> 
    //<![CDATA[ 
    var map = null; 
function initialize() { 
var myOptions = { 
    zoom: 8, 
    center: new google.maps.LatLng(39.831125875,-112.15968925), 
    mapTypeControl: true, 
    mapTypeControlOptions: {style: google.maps.MapTypeControlStyle.DROPDOWN_MENU}, 
    navigationControl: true, 
    mapTypeId: google.maps.MapTypeId.ROADMAP 
} 
    map = new google.maps.Map(document.getElementById("map_canvas"), 
          myOptions); 

    google.maps.event.addListener(map, 'click', function() { 
    infowindow.close(); 
    }); 

    // Add markers to the map 
    // Set up three markers with info windows 


    var point = new google.maps.LatLng(40.970826,-112.048187) 
    var marker = createMarker(point,'Utah-Davis County'); 


    var point = new google.maps.LatLng(40.235509,-111.660576) 
    var marker = createMarker(point,'Utah-Provo'); 

    var point = new google.maps.LatLng(40.766502,-111.897812) 
    var marker = createMarker(point,'Utah-Salt Lake City'); 


    } 

    var infowindow = new google.maps.InfoWindow(
    { 
    size: new google.maps.Size(150,50) 
    }); 




function createMarker(latlng, 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); 
    }); 
    } 


function animate(lati,long) { 
    var latLng = new google.maps.LatLng(lati, long); //Makes a latlng 
    map.panTo(latLng); //Make map global 
} 


//]]> 
</script> 

有沒有辦法爲特定點定義不同的圖標顏色？

Answer 1

我認爲這會有所幫助。你必須創建一個自定義標記。

Google Maps API 3 - Custom marker color for default (dot) marker

專門針對你的問題，你可以做這樣的事情：

var pinColor = "2F76EE"; // a random blue color that i picked 
var pinImage = new google.maps.MarkerImage("http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=%E2%80%A2|" + pinColor, 
      new google.maps.Size(21, 34), 
      new google.maps.Point(0,0), 
      new google.maps.Point(10, 34)); 
var pinShadow = new google.maps.MarkerImage("http://chart.apis.google.com/chart?chst=d_map_pin_shadow", 
      new google.maps.Size(40, 37), 
      new google.maps.Point(0, 0), 
      new google.maps.Point(12, 35)); 

然後

var marker = new google.maps.Marker({ 
      position: new google.maps.LatLng(0,0), 
      map: map, 
      icon: pinImage, 
      shadow: pinShadow 
     }); 

信貸matt burns