Question

如图 使用Graphics的时候怎么自定义图标显示

Answer 1

L.supermap.graphic里style参数设置为L.supermap.imageStyle，参考https://iclient.supermap.io/examples/leaflet/editor.html#12_graphicLayerImage示例

Comments

我已经引用了include-leaflet.js 但是还是会报Uncaught TypeError: Cannot read property 'imageStyle' of undefined

var points = []; 
var image = [];
 ar img = new Image();
img.src =obj.exhibitDatas[5].iconUrl;
img.onload = function () {
image.push(L.supermap.imageStyle({
img: img,
anchor: [16, 16]
}));
for(var i = 0; i<obj.exhibitDatas.length; i++){
points.push( L.supermap.graphic({
latLng: L.latLng(obj.exhibitDatas[i].longitude,obj.exhibitDatas[i].latitude),
style: image[0].getStyle()
}))
}
L.supermap.graphicLayer(points, {
render: 'canvas'
}).addTo(map);
}

---

我看你贴的代码里，var img少写了一个v,你再检查下语法，如若语法没问题，下载最新完整开发包修改里面的示例试一试

---

参考例子里的方法去加载图片 使用SuperMap.Layer.Graphics调用会报Uncaught TypeError: Failed to execute 'drawImage' on 'CanvasRenderingContext2D': The provided value is not of type '(CSSImageValue or HTMLImageElement or SVGImageElement or HTMLVideoElement or HTMLCanvasElement or ImageBitmap or OffscreenCanvas)'

graphicLayer = new SuperMap.Layer.Graphics("Graphic Layer", null, {hitDetection: true, useCanvasEvent: false});
var selectGraphic = new SuperMap.Control.SelectGraphic(graphicLayer, {
								            onSelect: showPopup,
								            hover: false
								     });
var points = []; 
var image = [];
var img = new Image();
img.src =obj.exhibitDatas[5].iconUrl;
img.onload = function () {
image.push(L.supermap.imageStyle({
img: img,
anchor: [16, 16]
}));
for(var i = 0; i<obj.exhibitDatas.length; i++){
var point= new SuperMap.Geometry.Point(obj.exhibitDatas[i].longitude, obj.exhibitDatas[i].latitude);
var pointVector = new SuperMap.Graphic(point);
pointVector.style={
image: image[0].getStyle()
};
 pointVector.scope=obj.exhibitDatas[i];
points.push(pointVector)
}
graphicLayer.addGraphics(points);
map.addLayers([markerLayer, graphicLayer]);
map.addControl(selectGraphic);
selectGraphic.activate();
}

如果使用L.supermap.graphicLayer调用 在最后面addTo(map)的时候会报Uncaught TypeError: Cannot set property 'className' of undefined

var points = []; 
var image = [];
var img = new Image();
img.src =obj.exhibitDatas[5].iconUrl;
img.onload = function () {
image.push(L.supermap.imageStyle({
img: img,
anchor: [16, 16]
}));
for(var i = 0; i<obj.exhibitDatas.length; i++){
if(typeof(obj.exhibitDatas[i].longitude)=="undefined"){
 continue;
}
points.push( L.supermap.graphic({
latLng: L.latLng(obj.exhibitDatas[i].longitude,obj.exhibitDatas[i].latitude),
style: image[0].getStyle()
}))
}
L.supermap.graphicLayer(points, {
render: 'canvas',
onClick: function (graphic, evt) {
L.popup().setLatLng(evt.latlng)
.setContent('<p>' + resources.text_latLng + '：<br>' + graphic.getLatLng()
.lng + ',<br>' + graphic.getLatLng().lat + '</p>')
}
}).addTo(map);
}

---

你不是用的leaflet吗？我看你下面哪个代码貌似没啥问题，你就先用开发包里的示例加上你的逻辑代码试一试。

---

使用Classic的Graphics可以自定义图标吗 这个实在是没找到问题 js都引入了 也没找到什么问题

---

请问你这个方法里面的l指向的是什么