¿Cómo configuro dinámicamente el color de relleno de los polígonos en Leaflet.js?

9

Estoy usando el ejemplo interactivo de cloropath para leaflet.js

Descubrí cómo hacer que cada uno de mis polígonos agregue una cuenta corriente de valores al final de la página después de hacer clic en cada polígono.

Al hacer clic en un polígono seleccionado por segunda vez, elimina su valor de la cuenta corriente.

Me gustaría representar esto visualmente como un cambio de color de relleno de los polígonos en el mapa.

Aquí está mi código hasta ahora (javascript con PHP incluido): (He incluido comentarios dentro de mi código para explicar lo que estoy tratando de hacer. Nuevamente, cualquier ayuda sería muy apreciada)

function addUp(num, x)
{  
    <?php 
    // begin php code

    $places = $db->query("SELECT boundary_id, boundary_name FROM boundaries WHERE               
    boundary_state= '$thatstate'");

    while($row = $places->fetch_object()) { 
       //end php code ?> 
       //begin javascript
       if (x == "List<?php echo $row->boundary_name ?>" && List<?php echo $row->boundary_name  ?> == 1) {

           temp = document.theForm.ttl.value;
           tempo = parseInt(temp);
           numo = parseInt(num);
           nwTemp = tempo + numo;
           document.theForm.ttl.value = nwTemp;
           geojson.setStyle({fillColor: 'blue'}); // I want to set color to blue to show  highlighted

           List<?php echo $row->boundary_name ?> = 0;

           return List<?php echo $row->boundary_name ?>;
    }


    if (x == "List<?php echo $row->boundary_name ?>" && List<?php echo $row->boundary_name  ?> == 0) {

        temp = document.theForm.ttl.value;
        tempo = parseInt(temp);
        numo = parseInt(num);
        nwTemp = tempo - numo;
        document.theForm.ttl.value = nwTemp;

        // I want to reset color of polygon if deselected (this would be   the default)
        geojson.resetStyle; 

        List<?php echo $row->boundary_name ?> = 1; 
    }   
}
javascript polygon leaflet geojson php alex
fuente
¡Bienvenido a Sistemas de Información Geográfica , Alex! Probablemente este sea el lugar adecuado para su pregunta, así que si todavía tiene una copia publicada en SO, elimínela. Si después de un tiempo razonable (un día o dos) no obtiene buenas respuestas aquí, simplemente marque esta pregunta para atención del moderador y podamos migrarla de regreso a SO (o cuando corresponda). Esto mantendrá su pregunta junto con cualquier comentario o respuesta parcial que atraiga mientras tanto, en lugar de obligarlo a comenzar de nuevo con cada sitio diferente.
whuber

Respuestas:

13

Puede cambiar el color de relleno de un polígono con el setStylemétodo (heredado de Path ).

polygon.setStyle({fillColor: '#0000FF'});

Si tiene dificultades para que el geojson se muestre correctamente, puede echar un vistazo a los documentos de Leaflet GeoJSON .

sfletche
fuente
Hum ... y para relleno transparente, ¿alguna pista?
Peter Krauss
1

También está este jsfiddle con el que me topé. No puedo reclamarlo como mío, pero puede ordenar los objetos de opciones a través event.target.optionso incluso establecer el atributo de color para un evento de destino a través deevent.target.setAttribute()

daniella
fuente