Zo moet je het doen:
PHP
Tabel `punten`:
Veld id int, autoincrement
Veld naam varchar
Veld xcoordinaat int
Veld ycoordinaat int
Veld plaatjeurl varchar
Veld omschrijving text
Met het volgende script:
PHP
<!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&key=(mijncode)"
type="text/javascript"></script>
<script src="maps.js" type="text/javascript"></script>
<?php
$res = mysql_query("SELECT naam, xcoordinaat, ycoordinaat, plaatjeurl, omschrijving FROM punten");
while($sel = mysql_fetch_array($res)){
?>
<script type="text/javascript">
//<![CDATA[
function load() {
if (GBrowserIsCompatible()) {
var map = new GMap2(document.getElementById("map"));
map.setCenter(new GLatLng(<?php echo $sel['xcoordinaat']; ?>, <?php echo $sel['ycoordinaat']; ?>), 10);
var marker = new GMarker(new GLatLng(<?php echo $sel['xcoordinaat']; ?>, <?php echo $sel['ycoordinaat']; ?>));
map.addOverlay(marker);
marker.openInfoWindowHtml("<?php echo $sel['omschrijving']; ?>");
}
}
//]]>
</script>
<?php
}
?>
</head>
<body onload="load()" onunload="GUnload()">
<div id="map" style="width: 500px; height: 300px"></div>
</body>
</html>
Toon Meer
Zoiets moet het worden, succes!