layer.bindTooltip(
`
<divclass="tip-box">
<div class="tip-box-top">
<div class="item">米</div>
<div class="item">千米</div>
<div class="item">海里</div>
</div>
<div class="tip-box-bottom">
长度：${this.messureLength.toFixed(4)} 千米
</div>
</div>
`,{direction:'top', permanent:true,interactive:true}).openTooltip();
//permanent:true 让tooltip一直显示 ； interactive:true 让tooltip可以绑定事件
this.switchUnits(layer)
switchUnits(target) {
let that = this
let mytooltip = target.getTooltip()
let items = mytooltip._container.getElementsByClassName('item')
items.forEach((element,index) => {
element.addEventListener('click',function () {
let temp = ''
switch(index)
{
case 0:
temp = 'metre'
break;
case 1:
temp = 'kilometre'
break;
case 2:
temp = 'seamile'
break;
}
that.changeVal(temp,mytooltip._container);
});
});
},
changeVal(val,element) {
let dom = element.getElementsByClassName('tip-box-bottom')[0]
if(val == 'metre') {
let length = this.messureLength * 1000
dom.innerHTML = `${length.toFixed(4)}`
}else if(val == 'kilometre') {
dom.innerHTML = `${this.messureLength.toFixed(4)}`
}else if(val == 'seamile') {
let length = this.messureLength * 0.539956803456
dom.innerHTML = `${length.toFixed(4)}`
}
},
| 
