Vue集成腾讯地图和几何库

发布时间：2020-12-16 23:19:31 所属栏目：百科来源：网络整理

导读：关于Vue中如何引入腾讯地图，百度搜索中的结果已经非常明确： let script = document.createElement("script"); script.type = "text/javascript"; script.src = "http://map.qq.com/api/js?v=2.expamp;callback=initamp;key=" + key; script.onerror = reje

关于Vue中如何引入腾讯地图，百度搜索中的结果已经非常明确：

    let script = document.createElement("script");
    script.type = "text/javascript";
    script.src = "http://map.qq.com/api/js?v=2.exp&amp;callback=init&amp;key=" + key;
    script.onerror = reject;
    document.head.appendChild(script);
});

}

但是有时候我们需要来进行计算，如测量距离，这时候应该引入几何库（自带地图）代替地图：

    let script = document.createElement("script");
    script.type = "text/javascript";
    script.charset = "utf-8";
    script.src = "http://map.qq.com/api/js?v=2.exp&amp;libraries=geometry&amp;callback=init&amp;&amp;key=" + key;
    script.onerror = reject;
    document.head.appendChild(script);
});

}

使用方法如下：

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;
        });

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!