如何在不使用Google地圖的情況下將經度/緯度轉換爲HTML5座標？

目標是使用座標數組來繪製路線而不使用Google地圖。將標準緯度/經度座標轉換爲HTML5畫布座標的最佳方法是什麼？如何在不使用Google地圖的情況下將經度/緯度轉換爲HTML5座標？

來源

2016-07-22 Noel Baron

你看看Haversine公式編輯？它會給你距離和角度，你可以很容易地轉換爲x，y。 –

我發佈了一個很好的答案。 –

請注意發生在日期線（即第180子午線）的奇怪現象。幸運的是，沒有太多的道路穿過它，目前只有斐濟。但是，根據您要處理的區域的大小，您可能需要對短距離使用反轉座標的特殊情況進行編碼。 –

我發現了一個相當簡單的方法來將緯度/經度轉換爲點。

獲取您設置的最小/最大座標。
讓您的畫布尺寸得心應手。
使用浮點計算來獲取畫布上x和y的百分比。
提供點數給D3。

見JS小提琴： https://jsfiddle.net/12stct3y/

var bounds = { 
    "minLon": -81.267555236816, 
    "maxLon": -81.261039733887, 
    "maxLat": 28.979709625244, 
    "minLat": 28.977783203125 
} 
var dimensions = { 
    width:400, 
    height:150 
} 
function getX(x) { 
    var position = (x - bounds.minLon)/(bounds.maxLon - bounds.minLon); 
    return dimensions.width*position; 
} 
function getY(y) { 
    var position = (y - bounds.minLat)/(bounds.maxLat - bounds.minLat); 
    return dimensions.height*position; 
}

不包括在小提琴：

旋轉基於北視
創建尺寸基於可變範圍

來源

2016-07-22 17:10:14

如何在不使用Google地圖的情況下將經度/緯度轉換爲HTML5座標？

回答

相關問題