UPDATED: trying to store an array in php then call a javascript function
I'm trying to store results in an array from mysql using php, then using the results to call a javascript function to use the results there. I'm not sure why my map isn't showing up (trying to implement google maps into my page)
My php/html/javascript call
<?php
.....
<div id="content"
......
$address=array();
//will list out where to go
while ($sec = mysql_fetch_array($result2)) {
$address[$x++] = ($sec[5] . " " . $sec[7]);
}
print_r($latlng);
print_r($address);
mysql_close($link);
?>
<div id="address_container">
<?php
print array_shift($address);
?>
</div>
</div>
My Javascript code:
<script type="text/javascript">
var geocoder;
var map;
function initialize() {
geocoder = new google.maps.Geocoder();
var latlng = new google.maps.LatLng(-34.397, 150.644);
var myOptions = {
zoom: 8,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
map = new google.maps.Map(document.getElemen开发者_开发知识库tById("map_canvas"), myOp$
}
function codeAddress() {
var address = document.getElementByID("address_container").innerHTML;
console.log(address);
geocoder.geocode( { 'address': address}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
map.setCenter(results[0].geometry.location);
var marker = new google.maps.Marker({
map: map,
position: results[0].geometry.location
});
} else {
alert("Geocode was not successful for the following reason: " + s$
}
});
}
See if this produces the result you are expecting:
PHP:
<?php
// ......
$address = array();
while ($sec = mysql_fetch_array($result2)) $address[++$x]= "$sec[5] $sec[7]";
// this should print the same data as you were getting before if you un-comment it
// print_r($address);
mysql_close($link);
?>
<div id="address_container"><?php print array_shift($address); ?></div>
</div> <!-- I left this here because I don't know what the rest of your HTML looks like... -->
<script type="text/javascript">
document.write(codeAddress());
</script>
Javascript:
function codeAddress() {
var address = document.getElementByID("address_container").innerHTML;
geocoder.geocode( { 'address': address}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
map.setCenter(results[0].geometry.location);
var marker = new google.maps.Marker({
map: map,
position: results[0].geometry.location
});
} else {
alert("Geocode was not successful for the following reason: " + status);
}
});
}
don't print_r $address, but echo it into a js var
</div>
<script type="text/javascript">
var address = <?php echo json_encode($address); ?> ;
document.write(codeAddress());
</script>
then no need to select it in your function
This was what example I was going off from... from the google api
var geocoder;
var map;
function initialize() {
geocoder = new google.maps.Geocoder();
var latlng = new google.maps.LatLng(-34.397, 150.644);
var myOptions = {
zoom: 8,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
}
function codeAddress() {
var address = document.getElementById("address").value;
geocoder.geocode( { 'address': address}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
map.setCenter(results[0].geometry.location);
var marker = new google.maps.Marker({
map: map,
position: results[0].geometry.location
});
} else {
alert("Geocode was not successful for the following reason: " + status);
}
});
}
<body onload="initialize()">
<div id="map_canvas" style="width: 320px; height: 480px;"></div>
<div>
<input id="address" type="textbox" value="Sydney, NSW">
<input type="button" value="Encode" onclick="codeAddress()">
</div>
</body>
ref: http://code.google.com/apis/maps/documentation/javascript/services.html#GeocodingAddressTypes
精彩评论