
剛剛在某個網站看到有全螢幕的Google Map可瀏覽,令常常在研究地圖的我好生心動。
於是找了幾個國內外網站相關教學,自己弄了一個全螢幕Google map網頁..。
Tomoo's Google Map (請點選看看,如果是Firefox用戶可接著按 F11放全螢幕)
點入文章有Html原始碼可參考..
在開始之前,先提醒您,必須先申請自己的Google Map API key,才能夠在自己的網頁中載入Google Map。
Google Map API申請網址HTML Code 如下

<!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>
<title>Google Maps Full Screen</title>
//以下這段要將key換成自己的才行!
<script src="http://maps.google.com/maps?
file=api&v=2&key=ABQIAAAAbH5QalZthKNyAGjILUSjUxQ5_W22ppizZ1bVFazS6LxQ
WtUfrBSra8Xa3NdY3YfF3Lvv64XTyUuucA"
type="text/javascript"></script>
</script>
//就是這裡讓他變成全螢幕的
<!-- Make the document body take up the full screen -->
<style type="text/css"> v\:* {behavior:url(#default#VML);} html, body {width: 100%;
height: 100%} body {margin-top: 0px; margin-right: 0px; margin-left: 0px; margin-
bottom: 0px} </style>
</head>
<body>
<!-- Declare the div, make it take up the full document body -->
<div id="map" style="width: 100%; height: 100%;"></div>
<!-- This div just for the description -->
<div style="top:25px; left:50px; position:absolute; background-color:white; border:2px
solid black;">
Tomoo's Gmap Full<br/>
</div>
<script type="text/javascript">
//<![CDATA[
var map;
if (GBrowserIsCompatible()) {
map = new GMap(document.getElementById("map"));
map.centerAndZoom(new GPoint(121.535944, 25.033953), 1);
//顯示G map的控制項
map.addControl(new GSmallMapControl());
map.addControl(new GMapTypeControl());
// Monitor the window resize event and let the map know when it occurs if
(window.attachEvent) { window.attachEvent("onresize", function() {this.map.onResize()}
); } else { window.addEventListener("resize", function() {this.map.onResize()} , false); }
}
//]]>
</script>
</body></html>

此文件參考了下列兩個網站製作而成,thank you very much :)
http://my-web-design.blogspot.com/2007/09/google-maps-api.html
http://www.leapbeyond.com/ric/scuba/appletdemo/FullScreenMap.htm