自定义icon路径,不能直接使用路径地址,需要require包裹
var myIcon = new window.BMap.Icon(require("@/assets/icon.png", new window.BMap.Size(26, 32));
- 那么问题来了,vite+typescript项目不允许使用静态资源加载方法require,如果使用require关键字就会报错,那肯定没法显示坐标点。
- 所以我们使用import来解决
let imgUrl = ref('')
onMounted(async () => {
let img = await import("/@/assets/41-placeholder.svg")
imgUrl.value = img.default
}
- 使用
var map = new window.BMap.Map("container"); // 创建地图实例
map.centerAndZoom(point, 15);
map.enableScrollWheelZoom(true); // 鼠标滚动缩放
// 自定义坐标路径地址
var myIcon = new window.BMap.Icon(imgUrl.value, new window.BMap.Size(26, 32));
myIcon.setImageSize(new window.BMap.Size(26, 32))
var marker = new window.BMap.Marker(new window.BMap.Point(116.399, 39.910), {icon: myIcon});
map.addOverlay(marker);
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。