获取当前的经度和纬度,并以HTML格式传递给Google Places API,可以通过以下步骤实现:
<!DOCTYPE html>
<html>
<head>
<title>获取经纬度</title>
<script>
function getLocation() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition);
} else {
alert("浏览器不支持地理位置获取。");
}
}
function showPosition(position) {
var latitude = position.coords.latitude;
var longitude = position.coords.longitude;
var html = "经度:" + longitude + "<br>纬度:" + latitude;
document.getElementById("location").innerHTML = html;
// 将经度和纬度传递给后端或直接使用JavaScript发送请求到Google Places API
}
</script>
</head>
<body>
<button onclick="getLocation()">获取经纬度</button>
<div id="location"></div>
</body>
</html>
const express = require('express');
const axios = require('axios');
const app = express();
app.get('/places', async (req, res) => {
const latitude = req.query.latitude;
const longitude = req.query.longitude;
try {
const response = await axios.get('https://maps.googleapis.com/maps/api/place/nearbysearch/json', {
params: {
location: `${latitude},${longitude}`,
radius: 1000, // 搜索半径,单位为米
key: 'YOUR_GOOGLE_PLACES_API_KEY'
}
});
// 处理Google Places API的响应数据
res.json(response.data);
} catch (error) {
console.error(error);
res.status(500).json({ error: '服务器错误' });
}
});
app.listen(3000, () => {
console.log('服务器已启动');
});
在上述代码中,将经度和纬度作为查询参数传递给/places
接口。然后使用axios库发送GET请求到Google Places API的nearbysearch
端点,并将经度、纬度、搜索半径和你的Google Places API密钥作为查询参数传递。最后,将Google Places API的响应数据返回给前端。
请注意,上述代码中的YOUR_GOOGLE_PLACES_API_KEY
需要替换为你自己的Google Places API密钥。
这样,你就可以通过点击"获取经纬度"按钮获取用户的经度和纬度,并将其传递给Google Places API进行进一步的地点搜索和处理。
领取专属 10元无门槛券
手把手带您无忧上云