Mysql/php結合Google Maps Api

woff

首先先建立一個名為wholocations的資料表
內有id,lat&lon(經緯度),description(內文或HTML語法)

1. 
   
2. CREATE TABLE wholocations (
   
3.   id int(11) NOT NULL auto_increment,
   
4.   lat decimal(10,6) NOT NULL default '0.000000',
   
5.   lon decimal(10,6) NOT NULL default '0.000000',
   
6.   description varchar(255) NOT NULL default '',
   
7.   PRIMARY KEY  (id)
   
8. ) TYPE=MyISAM;

複製代碼

再來就是將HEADER的部份填入您的API KEY,這個大家都知道

1. <script type="text/javascript">
   
2. //<![CDATA[
   
3. 
   
4. var map = new GMap2(document.getElementById("map"));
   
5. map.addControl(new GLargeMapControl());
   
6. map.addControl(new GMapTypeControl());
   
7. map.addControl(new GScaleControl());
   
8. map.setCenter(new GLatLng(51.512161, -0.14110), 11, G_NORMAL_MAP);
   
9. 
   
10. // Creates a marker whose info window displays the given number
    
11. function createMarker(point, number)
    
12. {
    
13. var marker = new GMarker(point);
    
14. // Show this markers index in the info window when it is clicked
    
15. var html = number;
    
16. GEvent.addListener(marker, "click", function() {marker.openInfoWindowHtml(html);});
    
17. return marker;
    
18. };

複製代碼

最後則是將php的資料庫資訊填入,如資料庫位置,資料庫名稱,使用者名稱/密碼
填入之後該php程式就會自資料庫裡去將所有的經緯度,description資訊帶出來
透過echo的方式把圖釘點一個個產生出來

1. <?php
   
2. $link = mysql_connect("[database server]", "[username]", "[password]") or die("Could not connect: " . mysql_error());
   
3. mysql_selectdb("[database name]",$link) or die ("Can\'t use dbmapserver : " . mysql_error());
   
4. 
   
5. $result = mysql_query("SELECT * FROM wholocations",$link);
   
6. if (!$result)
   
7. {
   
8. echo "no results ";
   
9. }
   
10. while($row = mysql_fetch_array($result))
    
11. {
    
12. echo "var point = new GLatLng(" . $row['lat'] . "," . $row['lon'] . ");\n";
    
13. echo "var marker = createMarker(point, '" . addslashes($row['description']) . "');\n";
    
14. echo "map.addOverlay(marker);\n";
    
15. echo "\n";
    
16. }
    
17. 
    
18. mysql_close($link);
    
19. ?>
    
20. 
    
21. //]]>
    
22. </script>
    
23. 
    
24. </body>

複製代碼

</html>資料來源:Google Maps via PHP/Mysql Tutorial - API version 2
http://www.map-server.com/googlemaps/tutorial_api2.html