Tad 教材網 - 線上書籍

:::

\[982\]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" xmlns:v="urn:schemas-microsoft-com:vml">  
 <head>  
 <meta http-equiv="content-type" content="text/html; charset=UTF-8">  
 <title></title>  
   
 <script type="text/javascript" src="http://www.google.com/jsapi?key=ABQIAAAAiaUztwQS-JKG0vf5W\_QNPhRjgqXnQAbwVQohZoocwCPRm4POpxSO7Yb0Dfgh3asVzIS3quES0hQflA"></script>  
   
 <script type="text/javascript">  
 google.load("maps", "2");  
   
 //頁面載入完成後，執行以下函數（定位地圖起點）  
 function initialize() {  
 var map = new google.maps.Map2(document.getElementById("mymap"));  
 //定義一個標記  
 var point = new GLatLng(23.005438745204096, 120.20259618759155);  
 //設定中心點  
 map.setCenter(point, 17);  
 //定義標記圖示  
 var myIcon = new GIcon(G\_DEFAULT\_ICON);   
 //圖示的前景圖片網址。   
 myIcon.image = "icons/shoppingmall.png";   
 //圖示的前景圖片大小（以像素為單位）。   
 myIcon.iconSize = new GSize(32, 37); //此圖示錨定至地圖的位置（相對於圖示圖片左上角）   
 myIcon.iconAnchor = new GPoint(16, 37); //資訊視窗錨定至此圖示的位置（相對於圖示圖片左上角）  
 myIcon.infoWindowAnchor = new GPoint(16,37);  
   
 markerOptions = { icon: myIcon ,draggable: true };  
   
 var marker = new GMarker(point , markerOptions);  
 //插入標記  
 map.addOverlay(marker);  
   
 GEvent.addListener(marker, "click", function() {  
 //移動後要做的事情  
 var marker\_point = marker.getLatLng();  
 map.openInfoWindowHtml(marker\_point, "目前標記位置：<br />" + marker\_point.toString());  
 });  
   
 GEvent.addListener(marker, "dragend", function() {  
 //移動後要做的事情  
 var marker\_point = marker.getLatLng();  
 map.openInfoWindowHtml(marker\_point, "目前標記位置：<br />" + marker\_point.toString());  
 });  
   
 //地圖屬性  
 //map.setMapType(G\_HYBRID\_MAP);  
 //開啟說明視窗  
 //map.openInfoWindowHtml(point, "<b>這裡就是延平國中啦～<b>");  
   
 InfoWindowOptions={maxWidth:150}  
   
 var tab1 = new GInfoWindowTab("名稱", "這是7-11");  
 var tab2 = new GInfoWindowTab("座標", "目前標記位置：<br />" + point.toString());  
 var infoTabs = \[tab1,tab2\];  
   
 marker.openInfoWindowTabsHtml(infoTabs,InfoWindowOptions);  
   
   
 //縮放控件  
 map.addControl(new GLargeMapControl());  
 //比例尺  
 map.addControl(new GScaleControl());  
 //縮圖  
 map.addControl(new GOverviewMapControl());  
   
 var topleft=new GControlPosition(G\_ANCHOR\_TOP\_LEFT, new GSize(50,5));  
 //地圖切換  
 map.addControl(new GMapTypeControl());  
   
 map.removeMapType(G\_SATELLITE\_MAP);  
   
 map.addMapType(G\_PHYSICAL\_MAP);  
   
 GEvent.addListener(map, "moveend", function() {  
 var center = map.getCenter();  
 document.getElementById("message").innerHTML = center.toString();  
 });  
   
   
 }  
   
 google.setOnLoadCallback(initialize);  
 </script>  
   
 </head>  
 <body onunload="GUnload()">  
 <div id="mymap" style="width:750px;height:350px;"></div>  
 <div id='message'></div>  
   
   
   
 </body>  
 </html>

:::