2012-01-24 7 views
5

Ho bisogno di creare più polilinee, ognuna con il proprio colore, e i loro marcatori sono collegati tra loro, sto usando google map v3.Cambiare il colore del tratto Polilinea multipla su google map v3

Ad esempio, ho cinque indicatori e sono tutti collegati tra loro tramite polilinee di colore rosso. Ora voglio mostrare questa polilinea di colore rosso in più combinazioni di colori, prima polilinea in verde, seconda in blu, terza in nero e così via.

Ecco il mio codice

<script type='text/javascript'> 
var poly; 
var map; 
var path; 
var i = parseInt(0, 10); 
var marker;   

function initialize() { 
    var chicago = new google.maps.LatLng(41.879535, -87.624333); 
    var myOptions = { 
    zoom: 7, 
    center: chicago, 
    mapTypeId: google.maps.MapTypeId.ROADMAP 
    }; 
    map = new google.maps.Map(document.getElementById('map_canvas'), myOptions); 
    var polyOptions = { 
    strokeColor: '#000000', 
    strokeOpacity: 1.0, 
    strokeWeight: 3 
    } 
    poly = new google.maps.Polyline(polyOptions); 
    poly.setMap(map); 
    // Add a listener for the click event 
    google.maps.event.addListener(map, 'click', addLatLng); 
} 

/** 
* Handles click events on a map, and adds a new point to the Polyline. 
* @param {MouseEvent} mouseEvent 
*/ 
function addLatLng(event) { 
    i++; 
    //var path = poly.getPath(); 
    path = poly.getPath(); 
    var polyOptions2 = { 
    strokeColor: '#FFFFFF', 
    strokeOpacity: 1.0, 
    strokeWeight: 3 
    } 
    if (i == 2) { 
    poly.setOptions(polyOptions2); 

    } 
    else { 
    polyOptions2.strokeColor = "#FF0000"; 
    poly.setOptions(polyOptions2); 
    } 
    path.push(event.latLng); 
    // Add a new marker at the new plotted point on the polyline. 
    marker = new google.maps.Marker({ 
    position: event.latLng, 
    title: '#' + path.getLength(), 
    map: map 
    }); 
} 
</script> 

risposta

2

caricare le vostre opzioni di marcatori e colore per le polilinee in un array JSON e passante attraverso di loro creando i marcatori e polilinee.

Spero che questo ti permetta di andare avanti.

1

insieme questa porzione del codice a ciclo for come

 var colorVariable = ["red","green","blue","yellow","black"]; 

     for(var a =0;a<=5;a++){ 
       var polyOptions = { 
       strokeColor: colorVariable[a], 
       strokeOpacity: 1.0, 
       strokeWeight: 2 
       } 
       poly = new google.maps.Polyline(polyOptions); 
       poly.setMap(map); 
     } 

Si lavorerà bene

Problemi correlati