geojson reactivity

[basaran]

Hello, thank you for this, it's really a nice example of using svelte getContext and has been very helpful.

I added a geojson component to the mix myself, and been exploring the options to access the geoshape attributes once they are added, so I can have the map react to the "things" happening outside the map area.

• For instance, hovering over a text outside, and changing the color of the geoJSON shape.

Could you please share if you have insights on how best to accomplish this? I found out geoJSON.eachLayer to add id attributes to the shapes, and then I can change the setAttribute of those SVG overlays through Javascript on the parent. I was just wondering if there would be a better way.

Thank you again, have I mentioned that this was helpful :)

export let color = "maroon";

onMount(() => {
    if (map) {
        geoJSON = L.geoJson(data, {
            style: {
                color: color /*initial color of the shape*/,
            },
        }).addTo(map);

        geoJSON.eachLayer(function (layer) {
            layer._path.id = "feature-" + layer.feature?.properties?.id;
        }); /*grab the id from json and add to the shape*/
    }
});

$: if (color) {
    console.log("this is not helping to make it reactive");
}