多媒體應用專業社群: 使用KML來設計Google Earth Hello World!

2011年4月9日星期六

使用KML來設計Google Earth Hello World!

基礎閱讀淺談KML
此範例的連結在http://code.google.com/intl/zh-TW/articles/support/earthapikml-parsekml.html。

我們可以利用<Kml;>和<Document;>兩的標籤來定義一個KML文件，
<kml xmlns="http://www.opengis.net/kml/2.2">
<Document>
:
</Document>
</kml>

然利用<LookAt>標籤內含<longitude;>, ;<latitude;>和<range>三的標籤來定義位置的資訊
<LookAt>
<longitude>-122.6019092122753</longitude>
<latitude>37.79754178141562</latitude>
<range>10000</range>
</LookAt>
最後用<Placemark>來設定一些位置的記號。

完整的程式範例如下:
<html>
<head>
<title>Article Sample - parseKml</title>
<script src="//www.google.com/jsapi?key=ABQIAAAA5El50zA4PeDTEMlv-sXFfRSsTL4WIgxhMZ0ZK_kHjwHeQuOD4xTdBhxbkZWuzyYTVeclkwYHpb17ZQ"></script>
<script>
google.load('earth', '1');

var ge = null;

function init() {
google.earth.createInstance('map3d', initCallback, failureCallback);
}

function initCallback(pluginInstance) {
ge = pluginInstance;
ge.getWindow().setVisibility(true);

var kmlObject = ge.parseKml(
'<?xml version="1.0" encoding="UTF-8"?>' +
'<kml xmlns="http://www.opengis.net/kml/2.2">' +
' <Document>' +
' <name>Earth API KML Article Sample</name>' +
' <LookAt>' +
' <longitude>-122.6019092122753</longitude>' +
' <latitude>37.79754178141562</latitude>' +
' <range>10000</range>' +
' </LookAt>' +
' ' +
' <Placemark>' +
' <name>Hello, Earth API!</name>' +
' <Style>' +
' <IconStyle>' +
' <Icon>' +
' <href>http://maps.google.com/mapfiles/kml/paddle/red-circle.png</href>' +
' </Icon>' +
' <hotSpot x="32" y="1" xunits="pixels" yunits="pixels"/>' +
' </IconStyle>' +
' </Style>' +
' <Point>' +
' <coordinates>-122.6019092122753,37.79754178141562,0</coordinates>' +
' </Point>' +
' </Placemark>' +
' ' +
' <Placemark>' +
' <name>Path</name>' +
' <Style>' +
' <LineStyle>' +
' <color>8000ffff</color>' +
' <width>10</width>' +
' </LineStyle>' +
' </Style>' +
' <LineString>' +
' <tessellate>1</tessellate>' +
' <coordinates>' +
' -122.6294072131804,37.78070448433935,0' +
' -122.6060178553204,37.79308109966063,0' +
' -122.5994909477651,37.78366884280404,0' +
' -122.5745875848465,37.7963818374369,0' +
' </coordinates>' +
' </LineString>' +
' </Placemark>' +
' ' +
' <Placemark>' +
' <name>Polygon</name>' +
' <Style>' +
' <PolyStyle>' +
' <color>ff0000ff</color>' +
' <outline>0</outline>' +
' </PolyStyle>' +
' </Style>' +
' <Polygon>' +
' <tessellate>1</tessellate>' +
' <outerBoundaryIs>' +
' <LinearRing>' +
' <coordinates>' +
' -122.603342765523,37.80848188238179,0' +
' -122.59281964908,37.80492188939625,0' +
' -122.5848624703069,37.80776433129196,0' +
' -122.5878939818387,37.81416595215351,0' +
' -122.5992170485817,37.81772477364498,0' +
' -122.603342765523,37.80848188238179,0' +
' </coordinates>' +
' </LinearRing>' +
' </outerBoundaryIs>' +
' </Polygon>' +
' </Placemark>' +
' ' +
' <GroundOverlay>' +
' <name>GroundOverlay</name>' +
' <Icon>' +
' <href>http://www.google.com/intl/en_ALL/images/logo.gif</href>' +
' <viewBoundScale>0.75</viewBoundScale>' +
' </Icon>' +
' <LatLonBox>' +
' <north>37.80533086088634</north>' +
' <south>37.79696872797933</south>' +
' <east>-122.6098439020225</east>' +
' <west>-122.6363995437516</west>' +
' </LatLonBox>' +
' </GroundOverlay>' +
' </Document>' +
'</kml>'
);

if (kmlObject) {
ge.getFeatures().appendChild(kmlObject);

if (kmlObject.getAbstractView() !== null)
ge.getView().setAbstractView(kmlObject.getAbstractView());
}
}

function failureCallback(errorCode) {
}
</script>
</head>
<body onload="init();">
<h1>Using <code>parseKml</code></h1>
<div id="map3d_container" style="width: 500px; height: 500px;">
<div id="map3d" style="height: 100%;"></div>
</div>
<br/><br/>
<div id="notice" style="text-align: center; border: 1em 0em 1em 0em">
Except as otherwise <a
href="http://code.google.com/policies.html#restrictions">noted</a>,
the content of this page is licensed under the <a rel="license"
href="http://creativecommons.org/licenses/by/2.5/">Creative Commons
Attribution 2.5 License</a>.

</div>
</body>
</html>

多媒體應用專業社群

2011年4月9日星期六

使用KML來設計Google Earth Hello World!

沒有留言:

張貼留言

2011年4月9日 星期六

使用KML來設計Google Earth Hello World!

沒有留言:

張貼留言

2011年4月9日星期六