Question

vue的leaflet中使用L.marker时出现“Failed to load resource: net::ERR_INVALID_URL”和"GET data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAApCAYA……HUd9xv8ZR98CxkS4F2n3EUrUZ10EYNw7BWm9x1GiPssi3GgiGRDKWRYZfXlON+dfNbM+GgIwYdwAAAAASUVORK5CYII=")marker-shadow.png net::ERR_INVALID_URL"错误，同时地图上的marker图标出现没有图片的样式

Answer 1

你好，根据错误提示，应该是自定义图标的图片路径出错，图标的图片是相对路径还是绝对路径？看一下资源是否请求成功。

参考一下官网示例：https://iclient.supermap.io/examples/leaflet/editor.html#controler_markersWithCustomIcons

麻烦上传一下代码和错误截图以进一步排查问题。

Comments

一下为主要代码：

this.map = L.map('map', {

                crs: L.supermap.CRS.TianDiTu_Mercator,

                center: [30.67, 104.06],

                maxZoom: 18,

                minZoom: 2,

                zoom: 6,

                layers: [tian_vec, sichuan],

                maxBounds: bounds,

                zoomControl: false

            });

L.marker([30.67, 104.06]).addTo(this.map)

没有自定义图标，使用的L.marker的API，出现的marker是这样的，使用的是vue框架。

控制台报错：

---

您好，还在吗，这个问题困扰好久了可以帮忙解决一下吗

---

是在本地运行的项目吗？看看请求路径下是否有对应的图片文件。

这边在官网测是正常。可以私信我向日葵识别码，这边远程看看。

---

远程查看，可能是引入iclient for leaflet 包不完整导致，建议重新引入。