」工欲善其事,必先利其器。「—孔子《論語.錄靈公》
首頁 > 程式設計 > 如何計算 Google 地圖 V3 中兩個標記之間的距離?

如何計算 Google 地圖 V3 中兩個標記之間的距離?

發佈於2024-12-22
瀏覽:775

How to Calculate the Distance Between Two Markers in Google Maps V3?

如何計算Google 地圖V3 中標記之間的距離

計算地圖上兩點之間的距離是一項常見任務, Google Maps V3 提供了一個全面的API 來執行此操作。最直接的方法之一是使用半正弦公式,該公式考慮地球曲率來計算兩個地理座標之間的距離。

半正弦公式

The半正弦公式可以在 JavaScript 中實現,如下所示:

var rad = function(x) {
  return x * Math.PI / 180;
};

var getDistance = function(p1, p2) {
  var R = 6378137; // Earth's mean radius in meter
  var dLat = rad(p2.lat() - p1.lat());
  var dLong = rad(p2.lng() - p1.lng());
  var a = Math.sin(dLat / 2) * Math.sin(dLat / 2)  
    Math.cos(rad(p1.lat())) * Math.cos(rad(p2.lat())) *
    Math.sin(dLong / 2) * Math.sin(dLong / 2);
  var c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1 - a));
  var d = R * c;
  return d; // returns the distance in meter
};

用法範例

要用上述公式計算Google 地圖上兩個標記之間的距離,只需將標記的座標作為參數傳遞給取得距離函數。例如:

var marker1 = new google.maps.Marker({
  position: new google.maps.LatLng(51.508742, -0.120850),
  map: map
});

var marker2 = new google.maps.Marker({
  position: new google.maps.LatLng(40.712784, -74.005941),
  map: map
});

var distance = getDistance(marker1.getPosition(), marker2.getPosition());

距離變數現在將包含兩個標記之間的距離(以公尺為單位)。

最新教學 更多>
  • 在 Go 中使用 WebSocket 進行即時通信
    在 Go 中使用 WebSocket 進行即時通信
    构建需要实时更新的应用程序(例如聊天应用程序、实时通知或协作工具)需要一种比传统 HTTP 更快、更具交互性的通信方法。这就是 WebSockets 发挥作用的地方!今天,我们将探讨如何在 Go 中使用 WebSocket,以便您可以向应用程序添加实时功能。 在这篇文章中,我们将介绍: WebSoc...
    程式設計 發佈於2024-12-22
  • 為什麼 Java 的整數常數池在 127 以上表現不同?
    為什麼 Java 的整數常數池在 127 以上表現不同?
    問題:127處Java整數常數池行為的分歧簡介:The整數常數池是Java中的一種機制,可以優化常見整數值的快取以提高效能。然而,該池的行為在 127 時出現了變化,引起了開發人員的困惑。 理解行為:對於從 -128 到 127 的整數,Java 保證引用相同常數的變數具有相同的引用。 Intege...
    程式設計 發佈於2024-12-22
  • 如何在 Go 中解組具有混合資料類型的 JSON 數組?
    如何在 Go 中解組具有混合資料類型的 JSON 數組?
    解組具有混合資料類型的JSON 陣列解組包含不同資料型別值的JSON 陣列的任務通常會帶來挑戰。例如,考慮以下JSON 陣列:{["NewYork",123]}問題:首先,需要注意的是提供的JSON 在語法上不正確。 JSON 物件需要每個值的鍵,因此正確的表示形式是{"...
    程式設計 發佈於2024-12-22
  • Bootstrap 4 Beta 中的列偏移發生了什麼事?
    Bootstrap 4 Beta 中的列偏移發生了什麼事?
    Bootstrap 4 Beta:列偏移的刪除和恢復Bootstrap 4 在其Beta 1 版本中引入了重大更改柱子偏移了。然而,隨著 Beta 2 的後續發布,這些變化已經逆轉。 從 offset-md-* 到 ml-auto在 Bootstrap 4 Beta 1 中, offset-md-*...
    程式設計 發佈於2024-12-22
  • 如何使用 Java 和 JFreeChart 用軸註解 .png 檔案?
    如何使用 Java 和 JFreeChart 用軸註解 .png 檔案?
    如何使用 Java 用軸註釋 .png 檔案無需依賴外部軟體即可用軸註釋 .png 影像。以下是利用 Java 內建功能和 JFreeChart 進行進階自訂的方法:建立圖表基礎首先,使用 JFreeChart 的 ChartFactory.createXYLineChart 方法建立圖表。這將建立...
    程式設計 發佈於2024-12-22
  • 新部落格系列:Python 人工智慧基礎知識
    新部落格系列:Python 人工智慧基礎知識
    歡迎來到我的新部落格系列,我們將在機器學習的背景下探索 Python 的迷人世界。由於其簡單性和提供的強大庫,Python 已成為資料科學和機器學習領域的基石。無論您是初學者還是希望提升自己的技能,本系列都將引導您了解 Python 的基礎知識,為您的機器學習之旅奠定堅實的基礎。 ...
    程式設計 發佈於2024-12-22
  • 如何在 JavaScript 變數中安全地嵌入 PHP 字串?
    如何在 JavaScript 變數中安全地嵌入 PHP 字串?
    為JavaScript 變數編碼PHP 字串當嘗試將包含引號或換行符的PHP 字串嵌入到JavaScript 變數中時,有必要正確編碼它們以避免解析錯誤。對這些字串進行編碼的最直接方法是透過 PHP 的 json_encode() 函數。 要使用此函數,請確保您使用的是 PHP 版本 5.2.0 或...
    程式設計 發佈於2024-12-22
  • 如何使用 AJAX 有效率地將 JavaScript 陣列傳送到 PHP?
    如何使用 AJAX 有效率地將 JavaScript 陣列傳送到 PHP?
    使用 AJAX 有效地將 JavaScript 陣列傳遞給 PHP許多 JavaScript 應用程式使用需要傳送到 PHP 進行處理的資料數組。一次遍歷和處理數組中的一個元素可能效率很低,尤其是對於大型數組。本文提供了一種使用 JSON 和 AJAX 來優化此流程的替代方法。 問題:應用程式需要透...
    程式設計 發佈於2024-12-22
  • 探索 Python 認證 4
    探索 Python 認證 4
    Python 認證近年來獲得了極大的普及和重要性。隨著對 Python 程式設計師和資料分析師的需求不斷增長,這些認證對於個人展示其在該領域的技能和專業知識變得至關重要。雖然有多種 Python 認證可供選擇,但全球公認的最負盛名的認證是 Python Institute 提供的認證。在本文中,我們...
    程式設計 發佈於2024-12-22
  • 提升 JavaScript 錯誤處理等級:從「try...catch」到自訂錯誤
    提升 JavaScript 錯誤處理等級:從「try...catch」到自訂錯誤
    错误处理是每个 JavaScript 开发人员都会遇到的事情之一,但并不是每个人都深入掌握它。如果您一直依赖简单的 try...catch 语句,那么是时候提升您的游戏水平了。这篇文章将带您完成从基本错误处理到制作自定义错误的整个过程,使您的代码更具弹性且更易于调试。 1. 基础知识...
    程式設計 發佈於2024-12-22
  • 為什麼 BULK INSERT 不接受預存程序中的變數檔案路徑?
    為什麼 BULK INSERT 不接受預存程序中的變數檔案路徑?
    使用預存程序批次插入:故障排除在嘗試使用預存程序批次插入資料時,開發人員遇到了語法錯誤。目標是將有效的 BULK INSERT 查詢複製到流程中。以下是對此問題及其解決方案的分析。 此問題是由於嘗試將檔案名稱作為變數傳遞給預存程序中的 BULK INSERT 指令而造成的。不幸的是,這是 BULK ...
    程式設計 發佈於2024-12-22
  • 儘管程式碼有效,為什麼 POST 請求無法擷取 PHP 中的輸入?
    儘管程式碼有效,為什麼 POST 請求無法擷取 PHP 中的輸入?
    解決PHP 中的POST 請求故障在提供的程式碼片段中:action=''而非:action="<?php echo $_SERVER['PHP_SELF'];?>";?>"檢查$_POST陣列:表單提交後使用 var_dump 檢查 $_POST 陣列的內...
    程式設計 發佈於2024-12-22
  • 普通算術轉換如何決定帶有符號和無符號運算元的二元「+」運算子的結果類型?
    普通算術轉換如何決定帶有符號和無符號運算元的二元「+」運算子的結果類型?
    有符號和無符號二元運算子的提升規則有符號和無符號二元運算子的提升規則// Snippet 1 int max = std::numeric_limits<int>::max(); unsigned int one = 1; unsigned int result = max one;...
    程式設計 發佈於2024-12-22
  • C 中的可變長度數組 (VLA) 如何在堆疊上運作?
    C 中的可變長度數組 (VLA) 如何在堆疊上運作?
    堆疊上的動態數組大小C 中的可變大小數組(VLA) 允許在運行時指定數組的大小無需訴諸動態分配技術,例如malloc 或new。這與聲明具有固定大小的陣列的傳統方法形成對比。 您提供的程式碼滿足宣告具有在執行時間確定的大小的陣列的標準:int main(int argc, char **argv) ...
    程式設計 發佈於2024-12-22
  • 如何在保持文字不傾斜的同時傾斜容器?
    如何在保持文字不傾斜的同時傾斜容器?
    如何傾斜元素但保持文本正常(不傾斜)創建具有不傾斜文本的傾斜按鈕創建立具有未傾斜文字的傾斜元素,您可以對父級和子級應用轉換elements:傾斜父元素:使用transform: skew()屬性傾斜父元素(在本例中為元素)。 取消子元素的傾斜:對子元素應用相反的變換( 元素)使用transform:...
    程式設計 發佈於2024-12-22

免責聲明: 提供的所有資源部分來自互聯網,如果有侵犯您的版權或其他權益,請說明詳細緣由並提供版權或權益證明然後發到郵箱:[email protected] 我們會在第一時間內為您處理。

Copyright© 2022 湘ICP备2022001581号-3