1、引用 <script charset="utf-8"src="https://map.qq.com/api/js?v=2.exp&key=“自己的key”&libraries=drawing,geometry"></script>

2、js

map = new qq.maps.Map(document.getElementById("map-canvas"), {zoom: /*sov:zoom*/9/*eov*/,center: new qq.maps.LatLng(/*sov:center_lat*/31.5/*eov*/, /*sov:center_lng*/121.5/*eov*/) });//繪圖工具 drawingManager = new qq.maps.drawing.DrawingManager({drawingMode: qq.maps.drawing.OverlayType.null,drawingControl: true,drawingControlOptions: {position: qq.maps.ControlPosition.TOP_CENTER,drawingModes: [qq.maps.drawing.OverlayType.MARKER,qq.maps.drawing.OverlayType.CIRCLE,qq.maps.drawing.OverlayType.POLYGON,qq.maps.drawing.OverlayType.POLYLINE,qq.maps.drawing.OverlayType.RECTANGLE]},circleOptions: {fillColor: new qq.maps.Color(255, 208, 70, 0.3),strokeColor: new qq.maps.Color(88, 88, 88, 1),strokeWeight: 3,clickable: false},PolylineOptions: {strokeLinecap: 'square',},// polylinecomplete:getPolylinecomplete(qq.maps.Polyline), }); drawingManager.setMap(map); // 當(dāng)一個(gè)折線覆蓋物繪制完成時(shí)，觸發(fā)此事件 qq.maps.event.addListener(drawingManager, 'polylinecomplete', function (event) {let polyline = event;let polylineLatLng = event.getPath();let start = new qq.maps.LatLng(polylineLatLng.elems[0].lat, polylineLatLng.elems[0].lng),end = new qq.maps.LatLng(polylineLatLng.elems[polylineLatLng.length-1].lat, polylineLatLng.elems[polylineLatLng.length-1].lng);//計(jì)算距離let distance = Math.round(qq.maps.geometry.spherical.computeDistanceBetween(start, end) * 10) / 10000;let label = new qq.maps.Label({position: end,map: map,content: distance + 'km'});polyline.setVisible(false);polyline = new qq.maps.Polyline({//折線是否可點(diǎn)擊clickable: true,map: map,//折線的路徑path: [start,end],//折線的寬度strokeWeight: 3,//折線末端線帽的樣式strokeLinecap: 'square',//折線是否可見(jiàn)visible: true,//折線的zIndexzIndex: 1000});});

?

總結(jié)

以上是生活随笔為你收集整理的腾讯地图利用绘图工具测量距离的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。