Ok, como ya hice una pregunta muy larga sobre esto, pero como no recibió ninguna respuesta nueva por un tiempo, y para no confundirme en detalles, mantendré esta simple de la mejor manera que pueda.
Si no me equivoco, una setStyle
función para una característica particular con nombre sería la siguiente:
var bounds = [[54.559322, -5.767822], [56.1210604, -3.021240]];
var rect = L.rectangle(bounds, {color: "#ff7800", weight: 1}).addTo(map);
rect.setStyle({color: "#4B1BDE"});
... que cambiaría el color de naranja a azul. También conozco la resetStyle()
función que revertirá el estilo al original.
Así es como estilizo mi GeoJSON:
var everything = L.geoJson(myfile, {
onEachFeature: function(feature){
array_of_layers.addLayer(feature);
},
style: function(feature){
switch(feature.properties.name){
case "belgium": return belgium_style; break;
case "bosnia": return bosnia_style; break;
case "denmark": return denmark_style; break;
case "great_britain": return britain_style; break;
case "greece": return greece_style; break;
case "italy": return italy_style; break;
case "serbia": return serbia_style; break;
case "spain": return spain_style; break;
}
}
});
Lo que quiero hacer es hacer que solo un país sea azul y los otros grises, más adelante en el código. Es una cosa de dos pasos, pintar todos los países en gris y luego hacer uno azul.
Lo primero es que necesito un bucle que repita cada característica y setStyle()
que todos los países se vuelvan grises. ¿Funciona si solo everything.setStyle({color: "#4B1BDE"})
o algo así?
La segunda cosa es que (eso me da noches de insomnio), ¿cómo selecciono solo una función de un grupo de polígonos GeoJSON para trabajar? Solo el país que necesito pintar de azul.
Si se tratara de desplazar el mouse, podría ubicar un detector de eventos como se hace en los tutoriales de Leaflet. Pero independientemente de la interacción del usuario, quiero establecer y restablecer el estilo llamándolo con su nombre, como hice con el rectángulo anterior.
setStyle()
función del folleto .Respuestas:
Esto funciona sin necesidad de eliminar la capa y volver a crear una nueva como se describe anteriormente:
Parece ser bastante más eficiente que eliminar y recrear la capa geoJson. Desde los documentos,
GeoJSON
se extiendeFeatureGroup
una capa que a su vez se extiendeLayerGroup
.Además, parece que cada característica geoJson tiene su propia capa en el
FeatureGroup
!fuente
He escrito un pequeño código para diseñar una característica específica de geojson usando un folleto. puede probarlo en JSFiddle (Original, no funcional) , Funcional JSFiddle 2018-02-17 , o usar la siguiente prueba de código localmente.
Para este ejemplo, estoy usando archivos us-states.json pero se puede usar para cualquier archivo geojson.
Espero que sea de ayuda.
Aquí está el código:
fuente
style(feature)
función verificara elfeature.properties.name
valor. ¡Gracias!