vue使用腾讯地图(三)标注
2018-10-11 本文已影响29人
前端来入坑
添加标注
var marker = new qq.maps.Marker({
position: myLatlng ,
map: map
});
文本标注
var marker = new qq.maps.Label({
position: myLatlng,
map: map,
content:'文本标注'
});
效果
image.png
自定义标注图标
var anchor = new qq.maps.Point(300, 0),
size = new qq.maps.Size(600, 680),
origin = new qq.maps.Point(-150, 0),
markerIcon = new qq.maps.MarkerImage(
"/static/images/position.png",
size,
origin,
anchor
);
marker.setIcon(markerIcon);
我的预览
image.png
附上我的定位logo
position.png
官网预览https://lbs.qq.com/javascript_v2/case-run.html#sample-overlay-addmarkerimage
为什么会有这么大区别呢,因为这是图片的问题一个大一个小,还需要稍加调整,展示官网定位图片
marker.png
vue使用腾讯地图(一)https://www.jianshu.com/p/130cdbd07394
vue使用腾讯地图(二)事件https://www.jianshu.com/p/0ce29aec5f47