使用Google地圖的測距功能

使用google地圖API的測距功能 首先需要引入對應的Google地圖的庫（drawing,geometry,spherical）

引入方法在

<script src="https://maps.googleapis.com/maps/api/js?language=en&key=你的key&libraries=drawing,places,geometry,spherical">

這裏的思路是：先劃線然後取點 通過API進行測量距離顯示結果

Step1 劃線的準備工作

var _styleOptions = {
    strokeColor:"red",          //邊線顏色。
    fillColor:"white",          //填充顏色。當參數爲空時，圓形將沒有填充效果。
	strokeWeight: 2,            //邊線的寬度，以像素爲單位。
	strokeOpacity: 0.5,         //邊線透明度，取值範圍0 - 1。
	fillOpacity: 0.5,           //填充的透明度，取值範圍0 - 1。
	strokeStyle: 'solid'        //邊線的樣式，solid或dashed。
    };

//劃線完成後的事件
google.maps.event.addListener(_drawingManager, 'polylinecomplete', function(polyline) {
    var pointxy = polyline.getPath();
    var triangleCoords= [];
	for(var i=0; i<pointxy.length;i++){
		var pointstemp =  new google.maps.LatLng(pointxy.getAt(i).lat(),             pointxy.getAt(i).lng());
		triangleCoords.push(pointstemp);
	}
			
    //直接調用API接口來計算幾條線段的長度和 單位米
	var distanceValue = google.maps.geometry.spherical.computeLength(triangleCoords);
	distanceValue = (distanceValue/1000).toFixed(2);
	distanceValue += "Km";
	var marker = new google.maps.Marker({
	    map: _map,
		position: triangleCoords[triangleCoords.length-1],
		label: distanceValue
	});
				
   });

Step2 觸發Step1的條件（具體功能入口）

 function testDistance(){    
    _drawingManager.setMap(_map);
    _drawingManager.setDrawingMode(google.maps.drawing.OverlayType.POLYLINE);
 }

效果圖：

這樣就基本實現了這個功能，折線也可以計算；