I’m using:

I’m using:

I’m using:

I am using react leaflet in my react app.
I used context api to build my project.
But when i tried using the leaflet using code :

Problem:

In React-Leaflet I put a L.circleMarker in some coordinate and and gave it some radius. when I zoom in the radius size shrinks, but I want it to grow bigger. for example if I drew a circle around New-York I would want it to stay around New-York when I zoom in, meaning the circle would have to grow bigger as I zoom but maintain it bounds relative to the map . I would also want the circle to follow my cursor and so I cant use a polyline with an array of fixed coordinates

While using react-leaflet to create a map, I would like the map component to take over all the available space after header and footer.

I have been trying to create a map section in my website for at least an hour now, but the react-leaflet or leaflet just won’t work at all. I do every step that the doc says, I have watched a lot of videos, checked the other questions on the website and tried them, and I’m pretty sure that I do everything correct but it is the same for me. My computer has no problem, all necessary libs are installed in case you may ask (I’m using vite).
i was expecting this result
Please, don’t hesitate to tell me what may cause this irritating problem if you know.