Correct url path in leaflet markers

user_8551424 0
Viewed 835

I want to personalize my leaflet markers, for this reason I'm reading this documentation.

My problem is in iconUrl because it can't find the path of the images. Here in the documentation, they just write,

iconUrl: 'leaf-green.png'

But if I just write this, the path is wrong.

GET http://127.0.0.1:8000/dataMap/leaf-green.png 404 (Not Found)

Then my idea was, I'm in the js folder, I have to write the path from here to the marker.

iconUrl: '../img/markers/leaf-green.png',

GET http://127.0.0.1:8000/img/markers/leaf-green.png 404 (Not Found)

Here is my structure

enter image description here

It doesn't work too. Then, how I have to write the path?

Thank you very much!!

leaflet jquery javascript
1 Answers

The JS executes from the context of the URL of the current page, not the location of the JS file in the folder structure. Therefore it looks like the path needs to include your static folder (and any above it that are not pictured).

However, the best practice is to make all URLs relative to the site root by prefixing them with /. This avoids any issues when running JS from nested pages, deep within a real or virtual path. Try this:

iconUrl: '/static/img/markers/leaf-green.png'
user_5194130
Related