Google Maps API 3：以像素爲單位計算多邊形的長度

Question

我在稱爲p1和p2的地圖中有2（lat，lng）標記。我需要計算在像素中從p1到p2的多邊形的長度。

這是我通過獲取斜邊值目前的解決方案：

//set global variables 
var pixel_coordinates = []; 
var overlay; 

//create map 
map = new google.maps.Map(document.getElementById('map'),myOptions); 

//create overlay using this solution http://stackoverflow.com/questions/1538681/how-to-call-fromlatlngtodivpixel-in-google-maps-api-v3 
function MyOverlay(options) { 
    this.setValues(options); 
    var div = this.div_= document.createElement('div'); 
    div.className = "overlay"; 
}; 
MyOverlay.prototype = new google.maps.OverlayView; 
MyOverlay.prototype.onAdd = function() { 
var pane = this.getPanes().overlayLayer; 
    pane.appendChild(this.div_); 
} 
MyOverlay.prototype.onRemove = function() { 
    this.div_.parentNode.removeChild(this.div_); 
} 
MyOverlay.prototype.draw = function() { 
    var projection = this.getProjection(); 
    var position = projection.fromLatLngToDivPixel(this.getMap().getCenter()); 
    var div = this.div_; 
    div.style.left = position.x + 'px'; 
    div.style.top = position.y + 'px'; 
    div.style.display = 'block'; 
}; 
overlay = new MyOverlay({ map: map }); 

//fill x,y coordinates (from lat/lng points) 
pixel_coordinates[0] = overlay.getProjection().fromLatLngToContainerPixel(p1); 
pixel_coordinates[1] = overlay.getProjection().fromLatLngToContainerPixel(p2); 

//calculate hypotenuse 
var distance = Math.round(
    Math.sqrt(
     Math.pow(Math.abs(pixel_coordinates[0].x - pixel_coordinates[1].x),2) 
     + 
     Math.pow(Math.abs(pixel_coordinates[0].y - pixel_coordinates[1].y),2) 
    ) 
); 
console.log(pixel_coordinates[0].x + ', ' + pixel_coordinates[0].y); 
console.log(pixel_coordinates[1].x + ', ' + pixel_coordinates[1].y); 
console.log(distance); 

的問題是，pixel_coordinates正在接收沒有在地圖匹配原始P1和P2點的像素座標。有人能發現錯誤嗎？

更新：它的工作原理已經，只要確保計算像素前使用map.fitBounds（視口）座標:)

Answer 1

上述工程的代碼，只是避免使用fitBounds的獲取fromLatLngToContainerPixel數據後。

Answer 2

每條折線都有腿，每條腿都有臺階。每個步驟都包含start lat_lng和end lat_lng。計算這兩點之間的距離可以給出確切的像素距離。

function getPixelDistance(polyline){ 
    var legs = polyline.legs; 
    var steps; 
    var distance = 0; 
    for(var k = 0; k < legs.length; k++){ 
     steps = legs[k].steps; 
     for(var i = 0; i < steps.length; i++){  

      distance += getDistance(steps[i].start_location, steps[i].end_location); 
     } 
    }  
    return distance;  
}  

    function getDistance(p1, 2){ 
     var pixel_coordinates = []; 
     overlay = new MyOverlay({ map: map }); 
     pixel_coordinates[0] = overlay.getProjection().fromLatLngToContainerPixel(p1); 
     pixel_coordinates[1] = overlay.getProjection().fromLatLngToContainerPixel(p2); 
     var distance = Math.round(
      Math.sqrt(
      Math.pow(Math.abs(pixel_coordinates[0].x - pixel_coordinates[1].x),2) 
      + 
      Math.pow(Math.abs(pixel_coordinates[0].y - pixel_coordinates[1].y),2) 
      ) 
     ); 
     return distance; 
    }