Lesson9:GoogleEarth Plug-in


Google Earth Plug-in是利用下載並安裝JavaScript API後,就可以將Google Earth內坎至網頁中,可以Drape影像在地形上,也可以顯示3D的Sketcup模型。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Using Google Earth with the Maps API</title>
<script type="text/javascript" src="http://maps.google.com/maps?file=api&v=2.x&key=ABQIAAAAEP4JfY_0WuuqO-_le09ZJhRe7Zh1I3Boyx5c-cn-rdkhkujO2RTxBvMLBsPw8as-S4BCUf9utOWKrQ"></script>

<script type="text/javascript">
function initialize() {
var map = new GMap2(document.getElementById("map"));
map.setCenter(new GLatLng(22.047795, 121.516900), 7);

// The following line makes the map Earth-enabled by adding the "Earth" button to the map type control.
// Note that you still need to add a map type control (GMapTypeControl, GMenuMapTypeControl, or GHierarchicalMapTypeControl) to the the map.
// Also, be sure you are loading v=2.x of the Maps API and not v=2, otherwise the G_SATELLITE_3D_MAP map type will not work properly.


map.addControl(new GHierarchicalMapTypeControl());
map.addControl(new GLargeMapControl());

var marker = new GMarker(new GLatLng(22.047795, 121.516900));
GEvent.addListener(marker, "click", function() {
var html = '<div style="width: 210px; padding-right: 10px">蘭嶼<\/div>';
GEvent.trigger(marker, "click");

var polyline = new GPolyline([
new GLatLng(22, 123),
new GLatLng(22.9, 122),
new GLatLng(22.2, 121.3),
new GLatLng(22.2, 120.3)
], "#ff0000", 4);
GEvent.addListener(polyline, "click", function(latlng) {
var html = '<div style="width: 210px; padding-right: 10px">A polyline.<\/div>';
map.openInfoWindowHtml(latlng, html);
<body onload="initialize()" onunload="GUnload">
<div id="map" class="map" style="width:800px;height:600px"></div>


Last modified: Wednesday, 18 December 2013, 04:49 PM