在开发Web应用程序时，Google Maps是一个非常流行的工具，它提供了强大的地图功能。本文将介绍如何使用Google Maps JavaScript API v3获取Google地图中心点的坐标。
步骤1： 在HTML中引入Google Maps API
要使用Google Maps JavaScript API v3，您需要先在HTML文件中引入API：
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY"></script>
您需要将YOUR_API_KEY替换为您自己的API密钥。如果您还没有API密钥，请按照以下步骤创建一个新的API密钥：
- 登录到Google Cloud Console。
- 创建一个新的项目或选择您要使用的现有项目。
- 转到“API和服务”>“凭据”。
- 单击“创建凭据”>“API密钥”>“服务器密钥”。
- 输入您的密钥名称，并填写以下内容：
- 允许IP地址：留空即可，这样任何人都可以使用该密钥。
- 允许HTTP referrers: 添加
*/*，这样任何网站都可以使用该密钥。
- 单击“创建”并将生成的API密钥复制到您的HTML文件中。
步骤2： 创建Google地图对象
接下来，您需要创建一个新的Google地图对象。在这个例子中，我们将使用google.maps.Map构造函数创建地图。
function initMap() {
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 8,
center: {lat: 37.7749, lng: -122.4194}
});
}此示例代码将创建一个具有默认缩放级别和中心点坐标的新地图，并将其添加到具有“map”ID的DOM元素中。
步骤3： 获取地图中心点的坐标
要获取Google地图的中心点坐标，您可以使用以下代码：
function getCenter() {
var center = map.getCenter();
console.log(center.lat(), center.lng());
}此代码将返回地图中心点的纬度和经度，并将它们分别打印到浏览器控制台上。
完整的示例代码
-- -------------------- ---- -------
--------- -----
------
------
-------------- --- ------ -- --- ------ ---- -- ------ ------------
-------
---- -
------- ------
------ -----
-
--------
------- ------------------------------------------------------------------------
--------
-------- --------- -
--- --- - --- ----------------------------------------------- -
----- --
------- ----- -------- ---- ----------
---
-------- ----------- -
--- ------ - ----------------
------------------------- --------------
-
-- --- --- ------ -- --- --- ---- --- ---- ----- ------ --
---------------------------------- ------- -----------
-
---------
-------
----- -------------------
---- ---------------
-------
-------在此示例代码中，我们使用google.maps.event.addListener()方法来侦听地图的“空闲”事件。每当用户停止移动地图时，该事件将触发getCenter()函数，并获取地图的中心点坐标。
结论
现在您已经知道如何使用Google Maps JavaScript API v3获取Google地图中心点的坐标了！这对于许多Web应用程序都是非常有用的，例如在地图上显示附近的商家或计算两个地点之间的距离。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/28021