vueテンセントマップ(カバー)を使用
index.htmlにパッケージ
参考テンセントApi-カバー
shjdhjsd
export default {
mounted() {
this.init();
},
data(){
return{
map:'',
div:'',
}
},
methods: {
init() {
let myLatlng = new qq.maps.LatLng(39.916527, 116.397128);
let myOptions = {
draggable: true,
scrollwheel: true,
zoom: 13, //
center: myLatlng, //
mapTypeId: qq.maps.MapTypeId.ROADMAP // MapType
};
let map = new qq.maps.Map(document.getElementById("orderMap"), myOptions);
this.map = map;
this.initOverLay();
this.div=this.$refs.div_top_info
debugger
},
initOverLay() {
let overLay = new qq.maps.Overlay();
// construct, Dom
overLay.construct = ()=> {
// this.div = document.createElement("div");
// var divStyle = this.div.style;
// divStyle.position = "absolute";
// divStyle.width = "24px";
// divStyle.height = "24px";
// divStyle.backgroundColor = "#FFFFFF";
// divStyle.border = "1px solid #000000";
// divStyle.textAlign = "center";
// divStyle.lineHeight = "24px";
// divStyle.borderRadius = "15px";
// divStyle.cursor = "pointer";
// this.div.innerHTML = 'heihiehei';
// dom
// dom
var panes = overLay.getPanes();
// panes ，overlayMouseTarget
panes.overlayMouseTarget.appendChild(this.div);
var self = this;
this.div.onclick = ()=> {
alert(0);
};
};
// draw dom
overLay.draw = (_this)=> {
var overlayProjection = overLay.getProjection();
//
// var pixel = overlayProjection.fromLatLngToDivPixel(0);
var divStyle = this.div.style;
divStyle.left = 0 + "px";//-------------------------- 。
divStyle.top = 0 + "px";
};
// destroy Dom ， setMap(null)
overLay.destroy = ()=> {
this.div.onclick = null;
this.div.parentNode.removeChild(this.div);
this.div = null;
};
overLay.setMap(this.map);
},
click1(){
alert('111')
}
},
};
参考テンセントApi-カバー