Forum Moderators: open
trying to get info from a few variables
$address
$zip
and put them into a function that geocodes and then shows a google map.
found some stuff on google but cant understand. The examples they have you have to actually click a button, I want to have this done by displaying a list of locations with a link on the end that when you click on it a window opens with the map in it. so on that page that opens it gets the ID number and does a MySQL query pulling out the address & zip then my question is where to go from there, i know that those variables need to be put in a function but not sure how to do that.
Google has a whole Geocoding API which you can tie into and there are easily found tutorials to show you how to do this with javascript and php.
All you need is the address variable, which you have already. You then send that to the Geocoder service to return the longitude and latitude and then carry on as normal with your Maps javascript.
getLatLng(address, callback)
getLocations(address, callback)
how exactly do I emplement these? I tried looking up fuctions but still dont understand how to code it into the javascript.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>Google Maps JavaScript API Example</title>
<script src="http://maps.google.com/maps?file=api&v=2.x&key=ABQIAAAAVIm_nXhr64G6CDK
Thb94UxScDmGhiaHtU9ppecF#*$!H1L9SCQBTd5j-ac2GXXSp8VoSOM-P6-qyfkg" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
function load() {
if (GBrowserIsCompatible()) {
var map = new GMap2(document.getElementById("map"));
}
}
//]]>
var map = new GMap2();
var geocoder = new GClientGeocoder();
showAddress("76 9th ave new york");
function showAddress(address) {
geocoder.getLatLngAsync(
address,
function(latlng) {
if (!latlng) {
alert(address + " not found");
} else {
map.setCenter(latlng, 15);
var marker = new GMarker(latlng);
map.addOverlay(marker);
marker.openInfoWindowHtml(address);
}
}
);
}
</script>
</head>
<body onload="load()" onunload="GUnload()">
<div id="map" style="width: 500px; height: 300px"></div>
</body>
</html>
this obviously is not working, how might i modify this so I can have it auto pull up the address
76 9th ave new york
then I would want to be able to do something like this
<? $address = "76 9th ave new york";?>
showAddress($address);
[edited by: tedster at 6:51 am (utc) on Aug. 10, 2007]
[edit reason] added line break to prevent side-scroll [/edit]
<script type="text/javascript">//<![CDATA[
function load() {
if (GBrowserIsCompatible()) {
var map = new GMap2(document.getElementById("map"));
var geocoder = new GClientGeocoder();
showAddress(map, geocoder, "76 9th ave new york");
}
}function showAddress(map, geocoder, address) {
geocoder.getLatLng(
address,
function(latlng) {
if (!latlng) {
alert(address + " not found");
} else {
map.setCenter(latlng, 15);
var marker = new GMarker(latlng);
map.addOverlay(marker);
marker.openInfoWindowHtml(address);
}
}
);
}//]]>
</script>
1) You already know how to pull it out of the database (I presume) so you define a relevant $address variable in php before the javascript.
2) <?php
//php code that prints out javascript variables from php
print ("var address =\"$address\";\n");
?>
in the relevant part of the javascript code for the address variable.
This is due to a different (and less accurate?) mapping technology being used by the Geocoding API. In this case, you will probably be better off finding the correct LatLong from Google Maps, hardcoding it into your database and then calling it from there rather than the geocoder function.
