離線vue如何調用騰訊地圖（vue引入騰訊地圖獲取當前經緯度）

2023-09-15 13:41:54

1.登錄騰訊位置服務

地址：https://lbs.qq.com/dev/console/application/mine

2.點擊應用管理創建應用

3.新建一個js引入

export function TMap {

return new Promise(function(resolve, reject) {

window.init = function {

resolve(qq)

}

var script = document.createElement('script')

script.type = 'text/javascript'

script.src = 'http://map.qq.com/api/js?v=2.exp&callback=init&key=這裡填申請的秘鑰'

script.onerror = reject

document.head.appendChild(script)

})

}

import { TMap } from '@/api/parking'

export default {

name: 'parking-parkText',

data {

return {}

},

methods: {

mapTX {

TMap.then(qq => {

var map = new qq.maps.Map(document.getElementById('atlas'), {

//這裡經緯度代理表進入地圖顯示的中心區域

center: new qq.maps.LatLng(22.53588500, 113.95251400),

zoom: 13

})

//綁定單擊事件添加參數

qq.maps.event.addListener(map, 'click', function(event) {

alert('您點擊的位置為: [' event.latLng.getLat ', '

event.latLng.getLng ']')

})

})

}

},

created {

this.mapTX

}

}

#atlas {

min-width: 600px;

min-height: 767px;

width: 50%;

}