当前位置: 民宿 > 民宿新闻

找附近宾馆 (找附近宾馆住宿一晚多少钱)

2024-10-15 16:55分类: 民宿新闻 阅读:

 

请输入您的位置,以查找附近的宾馆:

<script> // Google Maps API 密钥const API_KEY = 'AIzaSyA1IY2-oy9fuYrZ3TA6zlx6VV668q17F8A';// 创建地图const map = new google.maps.Map(document.getElementById('map'), {center: {lat: -34.397, lng: 150.644},zoom: 12});// 标记用户位置const userMarker = new google.maps.Marker({position: {lat: -34.397, lng: 150.644},map: map,title: '您的位置'});// 查找宾馆document.querySelector('form').addEventListener('submit', (event) => {event.preventDefault();const location = document.getElementById('location').value;const request = {query: '宾馆 ' + location,fields: ['name', 'geometry'],};const service = new google.maps.places.PlacesService(map);service.findPlaceFromQuery(request, (results, status) => {if (status === google.maps.places.PlacesServiceStatus.OK) {clearResults();for (let i = 0; i < results.length; i++) {createResult(results[i]);}map.setCenter(results[0].geometry.location);}});});// 清除结果const clearResults = () => {document.getElementById('results').innerHTML = '';};// 创建结果const createResult = (place) => {const result = document.createElement('div');result.classList.add('result');const name = document.createElement('h3');name.textContent = place.name;const address = document.createElement('p');address.textContent = place.vicinity;const distance = document.createElement('p');const distanceService = new google.maps.DistanceMatrixService();distanceService.getDistanceMatrix({origins: [userMarker.getPosition()],destinations: [place.geometry.location],travelMode: 'DRIVING'}, (response, status) => {if (status === 'OK') {distance.textContent = `距离:${response.rows[0].elements[0].distance.text}`;}});const bookButton = document.createElement('a');bookButton.classList.add('book-button');bookButton.textContent = '预订';bookButton.href = `宾馆 ${place.name} ${place.vicinity}`;result.appendChild(name);result.appendChild(address);result.appendChild(distance);result.appendChild(bookButton);document.getElementById('results').appendChild(result);};// 加载 Google Maps APIconst script = document.createElement('script');script.src = `${API_KEY}&libraries=places`;document.head.appendChild(script);


郑重声明:本文由:民宿新闻于(2024-10-15)发表了关于找附近宾馆 (找附近宾馆住宿一晚多少钱)的文章。如转载请注明出处!部分文章来源于网络,仅作为参考,如果网站中图片和文字侵犯了您的版权,请联系我们处理!

上一篇:我要找住宿 (我要住宿最近的)

下一篇:查找附近住宿 (查找附近住宿旅馆)

附近酒店推荐

关注我们

    民宿酒店不一样的选择,更好的体验