leaflet-map
leaflet-map copied to clipboard
L.Icon.Default.imagePath should be relative to leaflet-map.html but is relative to root document
Hi, the demos with markers are not working unless I have the leaflet folder in the root of my site. After a bower install (where the leaflet folder is installed in the bower_component folder at the same level as leaflet-map) I'm getting a 404 not found http://mysite.com/leaflet/dist/images/marker-icon.png and another 404 for marker-shadow.png
L.Icon.Default.imagePath
is set to "../leaflet/dist/images"
. So in a typical bower based environment that is the correct path; relative to leaflet-map.html. Unfortunately the path is not interpreted relatively to leaflet-map.html, but to the root document, which hosts <leaflet-map>
.
I guess it is likely to work in more scenarios, if I set it to /bower_components/leaflet/dist/images
. But that still is no real solution.
This issue was fixed in 1.0
Nope, still have this issue.
@kingflurkel do you have a <link>-tag to import leaflet-map.html in the main document?
Maybe it's better to have a config param in leaflet-map see the pull request https://github.com/leaflet-extras/leaflet-map/pull/36
/**
* If set, set icon default imagepath
*
* @attribute icon-default-image-path
* @type string
* @default null
*/
iconDefaultImagePath: {
type: String,
value: null,
}
the iconDefaultImagePath param strategy will work with vulcanized files
The leaflet lib is looking for the script
tag of itself to find the correct path so I fixed it by adding the following to the main index.html
.
<script src="/bower_components/leaflet/dist/leaflet.js"></script>
I create this pull request #84 in which you don't need to use the <link>-tag
of leaflet-map.html in the main document neither use a workaround importing directly the leaflet js library.
It gets the URL of the component and with it build the default icon URL.