Dynamicznie zmienić kolor wielokąta w ulotce?

Question

Dla każdego, kto zna się na ulotce, czy znasz sposób na dynamiczną zmianę koloru wielokąta? Weźmy na przykład okrąg zdefiniowany następująco:

window.circle = L.circle([51.508, -0.11], 500, { 
color: 'red', 
fillColor: '#ffffff', 
    fillOpacity: 0.5 
}).addTo(map); 

Później, gdy użytkownik kliknie przycisk gdzieś na interfejsie (na przykład), chcę zmienić kolor okręgu takiego:

window.circle.options.fillColor = "#dddddd"; 

Kod zmienia wartość window.circle.options.fillColor, ale zmiana nie jest odzwierciedlona zmianą koloru wielokąta na mapie. Szukałem, ale niczego nie znalazłem. Jakieś pomysły?

Dzięki.

Answer 1

L.Circle rozciąga L.Path (http://leafletjs.com/reference.html#path), które mają metodę setStyle(<Path options> object), można zastosować nowy styl jako window.circle.setStyle({fillColor: '#dddddd'});

Answer 2

Jeśli szukasz czegoś takiego:

const circle = L.circle([lat, lng], { 
    style: style, 
    onEachFeature: onEachFeature, 
}); 

Te opcje są dostępne dla GeoJSON dane takie jak: L.geojson() .....: D

Tak, dla wielokąta. Wypróbuj,

circle.setStyle({ 
    color: 'red' 

});