竹部落

My studying notebook

2008/05/29

Embedding Google Earth in Your Web Page

5/29/2008 09:16:00 PM Posted by Kai-Chu Chung , , 3 comments
Google Earth 於5/28 釋出 Google Earth Browser Plugin
所以現在想要使用Google Earth多了一種選擇
不一定要下載Google Earth

donwloading plugin

並於幾個小時之後也公開了Google Earth plug API
讓使用者可以把Google Earth直接嵌入到自己的網頁中


<html>
<head>
 <title>Google</title>
<script src="http://maps.google.com/maps?file=api&v=2&key=YourGoogleMapKey" type="text/javascript"></script>
<script src="http://www.google.com/jsapi?key=YourGoogleMapKey"></script>
 <script type="text/javascript">
google.load("earth", "1");
google.load("maps", "2.99");  // For JS geocoder

var ge = null;
var geocoder;

function init() {
 geocoder = new GClientGeocoder();
 google.earth.createInstance("map3d", initCB, failureCB);
}

function initCB(object) {
 ge = object;
 ge.getWindow().setVisibility(true);
}

function failureCB(object) {
 alert('load failed');
}

function submitLocation() {
 var address = document.getElementById('address').value;
 geocoder.getLatLng(
   address,
   function(point) {
     if (point && ge != null) {
       var la = ge.createLookAt('');    
       la.set(point.y, point.x, 100, ge.ALTITUDE_RELATIVE_TO_GROUND,
              0, 0, 4000);
       ge.getView().setAbstractView(la);
     }
   }
 );
}

 </script>
</head>
<body onload='init()' id='body'>
 <div id='map3d_container' style='border: 1px solid silver; height: 500px;'>
   <div id='map3d' style='height: 100%;'></div>
 </div>
</body>
</html>


Live Demo簡單展示把Google Earth 嵌入到自己的網頁中

參考資料：

3 comments: