2012-01-24 14 views
5

Necesito crear polilíneas múltiples, cada uno con su propio color, y sus marcadores están conectados entre sí, estoy usando Google Map v3.Cambiar el color del trazo polilínea múltiple en Google Map v3

Por ejemplo, tengo cinco marcadores y que son todos los conectados entre sí a través de polilíneas color rojo. Ahora quiero mostrar esta polilínea el rojo en múltiples combinaciones de colores, primera línea poligonal en verde, azul en segundo, tercero en Negro y así sucesivamente.

Aquí está mi código

<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> 

Respuesta

2

cargar sus opciones del marcador y el color de las polilíneas en una matriz JSON y bucle a través de ellos la creación de los marcadores y polilíneas.

Esperanza este consigue que va.

1

conjunto esta parte de su código en el bucle for como

 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); 
     } 

Se trabajará muy bien

Cuestiones relacionadas