我正在研究Core PHP,我已经为单个静态地址创建了谷歌地图标记,我需要从数据库传递动态多个名称和地址,在这里将编写查询从数据库获取数据,单个地址工作正常,但我需要多个地址和多个谷歌标记,如何做到这一点,请帮助我。
这里是我的代码:index.php
<!DOCTYPE html>
<html>
<head>
<title>Simple Map</title>
<meta name="viewport" content="initial-scale=1.0">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css">
<script type="text/javascript" charset="utf8" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-2.0.3.js"></script>
<meta charset="utf-8">
<style>
#map {
height: 100%;
}
html, body {
height: 100%;
margin: 0;
padding: 0;
}
</style>
</head>
<body>
<div id="map"></div>
</body>
<script type="text/javascript">
var map;
//alert(map);
function getData() {
$.ajax({
url: "map_api.php",
async: true,
dataType: 'json',
success: function (data) {
console.log(data);
init_map(data);
}
});
}
function init_map(data) {
var map_options = {
zoom: 14,
center: new google.maps.LatLng(data['latitude'], data['longitude'])
}
map = new google.maps.Map(document.getElementById("map"), map_options);
marker = new google.maps.Marker({
map: map,
position: new google.maps.LatLng(data['latitude'], data['longitude'])
});
infowindow = new google.maps.InfoWindow({
content: data['formatted_address']
});
google.maps.event.addListener(marker, "click", function () {
infowindow.open(map, marker);
});
infowindow.open(map, marker);
}
</script>
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyC3cIb3aYyySipxodqNJgRDUpIC17VrnXY&callback=getData" async defer></script>
</html>
这是我的map_api.php文件:
<?php
function get_geocode($address){
$address = urlencode($address);
$url = "http://maps.google.com/maps/api/geocode/json?address={$address}";
$resp_json = file_get_contents($url);
$resp = json_decode($resp_json, true);
//response status will be 'OK'means if able to geocode given address
if($resp['status']=='OK'){
$data_arr = array();
$data_arr['latitude'] = isset($resp['results'][0]['geometry']['location']['lat']) ? $resp['results'][0]['geometry']['location']['lat'] :'';
$data_arr['longitude'] = isset($resp['results'][0]['geometry']['location']['lng']) ? $resp['results'][0]['geometry']['location']['lng'] : '';
$data_arr['formatted_address'] = isset($resp['results'][0]['formatted_address']) ? $resp['results'][0]['formatted_address'] :'';
if(!empty($data_arr) && !empty($data_arr['latitude']) && !empty($data_arr['longitude'])){
return $data_arr;
}else{
return false;
}
}else{
return false;
}
}
echo json_encode(get_geocode('4102/4C, SRK Arcade, Tavarkere Main Road, BTM 1st Stage,Bengaluru, Karnataka 560029'));
?>