google map api

原來把Google map放在網頁上還挺容易的!!
我的成果

不過我的目的不只是要放一個點，還要放很多點，而且要從資料庫內抓點來放!!

<script type="text/javascript">
//<![CDATA[
var map = new GMap(document.getElementById("mymap"));

//設定要顯示的控制項
map.addControl(new GLargeMapControl());
map.addControl(new GMapTypeControl());
map.addMapType(G_PHYSICAL_MAP);

//決定你 Google 地圖的中心點位置(緯度, 經度)和縮放大小以及預設的地圖模式
map.setCenter(new GLatLng(23.753611, 120.3), 8, G_HYBRID_MAP);
</script>

//已經將資料放在陣列 $loc 中
//因為資料庫的經緯度資料是度分秒的，所以要先將他們轉成二度分帶
//先用php做個迴圈讀資料，然後再用javascript將每一個點點上去
<?php
for ($i=0;$i<count($loc);$i++){
$loc[$i]['Y']=$loc[$i]['DegY']+$loc[$i]['MinY']/60+$loc[$i]['SecY']/3600;
$loc[$i]['X']=$loc[$i]['DegX']+$loc[$i]['MinX']/60+$loc[$i]['SecX']/3600;
?>

<script type="text/javascript">
//標示在 Google 地圖上的經緯度
var point<?php echo $i;?> = new GLatLng(<?php echo $loc[$i]['Y'];?>, <?php echo $loc[$i]['X'];?>);
var marker<?php echo $i;?> = new GMarker(point<?php echo $i;?>);
map.addOverlay(marker<?php echo $i;?>);

//在地圖上放置標點說明，可以放文字、連結、圖，就如同一班html的寫法
var html<?php echo $i;?> = "<?php echo $i;?>";


GEvent.addListener(marker<?php echo $i;?>, "click", function() {
    marker<?php echo $i;?>.openInfoWindowHtml(html<?php echo $i;?>);
});
map.addOverlay(marker<?php echo $i;?>);

//]]>
</script>
<?php };?>

這樣就可以在同一張圖上顯示很多點了，而且還可以有內容說明喔

參考資料:
Google Map 的中文製作簡介
Google Maps API 實作範例