我正在开发一个旅馆预订平台,在该平台中旅馆可以注册并输入其街道地址(以及其他信息)。然后,我使用Google地理编码API来获取其坐标。然后将坐标提交给该旅馆的Db。当访客访问旅馆信息时,他们可以查看坐标,并且指向“在地图上查看”的链接应允许然后在弹出式地图上查看确切的位置。我的问题是我最初输入的地址不正确,现在,当地图打开时,尽管我将物理地址以及新坐标更改为正确的坐标,但下面的代码仍在地图上显示了错误的位置。如果我打开Google地图并输入相同的坐标,那么我可以看到正确的位置。我在每个地方都搜寻了无济于事的解决方案,希望有人可以为我指出。.
Am使用此代码获取给定地址的坐标
<?php
$address = '166,hillhead,road,brighton beach,South Africa';
$url = file_get_contents("https://maps.google.com/maps/api/geocode /json?address=".urlencode($address)."&key=AIzaSyA8CRucwaTnPngXyVAl12enhwOpiUubyl0&sensor=true");
$response = json_decode($url);
if ($response->status == 'OK') {
$latitude = $response->results[0]->geometry->location->lat;
$longitude = $response->results[0]->geometry->location->lng;
echo 'Latitude: ' . $latitude;
echo '<br />';
echo 'Longitude: ' . $longitude;
} else {
echo $response->status;
}
下面的代码用于我的弹出地图,该地图使用通过上面的代码获取的相同坐标
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">
<title>Simple Markers</title>
<style>
/* Always set the map height explicitly to define the size of the div
* element that contains the map. */
#map {
height: 100%;
}
/* Optional: Makes the sample page fill the window. */
html, body {
height: 100%;
margin: 0;
padding: 0;
}
</style>
</head>
<body>
<div id="map"></div>
<script>
function initMap() {
var myLatLng = {lng: 30.99802,lat: -29.937642};
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 28,
center: myLatLng
});
var marker = new google.maps.Marker({
position: myLatLng,
map: map,
title: 'hhh'
});
google.maps.event.addListener(marker, 'click', function() {
infowindow.setContent("<div style='height:60px;width:200px;'>"+contentString+"<br>coordinates:"+marker.getPosition().toUrlValue(6)+"</div>");
infowindow.open(map,marker);
});
}
</script>
<script async defer
src="https://maps.googleapis.com/maps/api/js?key=<?php echo $api_key;?>&callback=initMap">
</script>
我没有收到任何错误,但希望客人能够查看他们打算预订的确切位置,但是标记显示的位置与应该预订的地方有些距离