关于Vue中如何引入腾讯地图，百度搜索中的结果已经非常明确：
/**
* 腾讯地图。
* @param key
* @returns {Promise<any>}
* @constructor
*/
export function TMap(key) {
return new Promise(function (resolve, reject) {
window.init = function () {
resolve(qq);//注意这里
}; let script = document.createElement("script");
script.type = "text/javascript";
script.src = "http://map.qq.com/api/js?v=2.exp&callback=init&key=" + key;
script.onerror = reject;
document.head.appendChild(script);
});
}
但是有时候我们需要来进行计算，如测量距离，这时候应该引入几何库（自带地图）代替地图：
/**
* 引入地图和几何库
* @param key
* @returns {Promise<any>}
* @constructor
*/
export function TMapGeometry(key) {
return new Promise(function (resolve, reject) {
window.init = function () {
resolve(qq);//注意这里
}; let script = document.createElement("script");
script.type = "text/javascript";
script.charset = "utf-8";
script.src = "http://map.qq.com/api/js?v=2.exp&libraries=geometry&callback=init&&key=" + key;
script.onerror = reject;
document.head.appendChild(script);
});
}
使用方法如下：
import {TMapGeometry} from "TMap";
TMapGeometry('xxxxxxxxxxxxxxxx').then(qq => {
let center = new qq.maps.LatLng(xxx, xxx);
let end = new qq.maps.LatLng(xxx, xxxx);
let distance = Math.round(qq.maps.geometry.spherical.computeDistanceBetween(center, end) * 10) / 10;
});