我需要将我的php地址转换为js然后转换为纬度和经度。 我有下面显示的代码,它初始化地图。
var LocationData = [
[-40.156886, -71.352581, "Plaza San Martin" ],
[-40.155116, -71.345129, "Asoc Hotelera SMA" ],
[-40.156763, -71.354438, "Cheminee" ],
[-40.155888, -71.350558, "Airdesign" ],
[-40.157998, -71.353683, "Dubling" ]
];
function initialize()
{
var map = new google.maps.Map(document.getElementById('map-canvas'));
var bounds = new google.maps.LatLngBounds();
var infowindow = new google.maps.InfoWindow();
for (var i in LocationData)
{
var p = LocationData[i];
var latlng = new google.maps.LatLng(p[0], p[1]);
bounds.extend(latlng);
/*var marker = new google.maps.Marker({
position: latlng,
map: map,
title: p[2]
});*/
var image = 'img/pin_pink.png';
var pin_pink_marker = new google.maps.Marker({
position: latlng,
map: map,
icon: image,
title: p[2]
});
google.maps.event.addListener(pin_pink_marker, 'click', function() {
infowindow.setContent(this.title);
infowindow.open(map, this);
});
}
map.fitBounds(bounds);
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
php中的地址来自数据库中的查询,它显示在表格中。我还想告诉你的是,我不知道我将在地图中显示多少地址。数字可能会根据我的查询而改变。
答案 0 :(得分:1)
更新:
<!DOCTYPE html>
<html>
<head>
<title>lat/long</title>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp"></script>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
</head>
<body onload="initialize()">
<div id="map-canvas" style="width:800px; height:500px;"></div>
<?php
$array = Array(
"R. Aurora, 611 - Santa Ifigênia, São Paulo - SP, 01209-001",
"R. dos Timbiras, 521 - Santa Ifigênia, São Paulo - SP",
"R. Vitória, 678 - Jardim Ataliba Leonel, São Paulo - SP, 02324-250",
"R. Joaquim Gustavo, 531 - República, São Paulo - SP, 01045-020",
"R. Conselheiro Nébias, 236 - Campos Elíseos, São Paulo - SP"
);
?>
</body>
</html>
<script>var address = new Array(<?php echo "'".implode("','", $array)."'"?>);</script>
<script src="map.js"></script>
<script>setTimeout(function(){codeAddress()},1000);</script>
map.js
var geocoder;
var map;
function initialize() {
geocoder = new google.maps.Geocoder();
var mapOptions = {
zoom: 16,
}
map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions);
}
function codeAddress() {
for(var i = 0; i < address.length; i++){
geocoder.geocode( { 'address': address[i]}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
map.setCenter(results[0].geometry.location);
str = String(results[0].geometry.location);
var comma = str.indexOf(",");
lat = str.substr(1,comma -1);
lng = str.substr(comma+1, str.length-comma-2);
var latlng = new google.maps.LatLng(lat,lng);
var image = 'http://icons.iconarchive.com/icons/pelfusion/long-shadow-media/32/Maps-Pin-Place-icon.png';
var marker = new google.maps.Marker({
map: map,
position: latlng,
icon: image,
title: results[0].address_components[1].long_name
});
} else {
//alert("Geocode was not successful for the following reason: " + status);
}
});
}
}