,可以通过以下步骤实现:
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap" async defer></script>
请将YOUR_API_KEY替换为您自己的Google Maps API密钥。如果没有密钥,您可以在Google Cloud控制台上创建一个。
var map;
function initMap() {
map = new google.maps.Map(document.getElementById('map'), {
center: {lat: 0, lng: 0}, // 设置初始中心点的经纬度
zoom: 8 // 设置初始缩放级别
});
// 监听地图的拖动事件
map.addListener('dragend', function() {
var center = map.getCenter(); // 获取地图当前中心点的坐标
console.log('地图中心点坐标:', center.lat(), center.lng());
});
}
在上述代码中,我们创建了一个地图对象,并将其绑定到HTML页面中具有id为"map"的元素上。初始中心点的经纬度设置为{lat: 0, lng: 0},可以根据实际需求进行调整。然后,我们通过监听地图的dragend事件来获取地图的中心点坐标。在控制台中打印出中心点的经纬度。
<div id="map"></div>
完成上述步骤后,当用户在Google地图上滚动或拖动地图时,会触发dragend事件,并在控制台中显示地图的中心点坐标。
推荐的腾讯云相关产品:腾讯云地图(https://cloud.tencent.com/product/tianditu)
领取专属 10元无门槛券
手把手带您无忧上云