vue高德地图中修改标记点的图标形状、样式-CFANZ编程社区

原代码：

marker = new AMap.Marker({
    position: positionItem,
    zIndex: 101,
    map: amapContainer,
    content: '<div style="color: #fff; width: 500px;"><img src="http://webapi.amap.com/theme/v1.3/markers/n/mark_b.png" />'+markItem.plantname + "</div>",
});

效果：点标记-覆盖物-教程-地图 JS API | 高德地图API

方法一：通过修改marker中自定义显示内容中附带的图片标签来改变point标记点的形状和样式

marker = new AMap.Marker({
    position: positionItem,
    zIndex: 101,
    map: amapContainer,
    content: '<div style="color: #fff; width: 500px;"><img src="https://vdata.amap.com/icons/b18/1/2.png" />' + markItem.plantname + "</div>",
});

方法二：通过marker的icon属性来设置新的image

marker = new AMap.Marker({
    position: positionItem,
    zIndex: 101,
    map: amapContainer,
    // content: '<div style="color: #fff; width: 500px;"><img src="http://webapi.amap.com/theme/v1.3/markers/n/mark_b.png" />'+markItem.plantname + "</div>",
    icon: new AMap.Icon({
        size: new AMap.Size(25,25),
        image: 'https://vdata.amap.com/icons/b18/1/2.png',
        imageSize: new AMap.Size(20, 20) 
    }),//设置了没改变
});