Google Earth personalization

I learned Java when I was in my senior year, but I have never heard of what the teacher said. Later I looked at the teaching material specified by the teacher. It seems that I spoke about the first six chapters, very funny... I read the books for two days before the examination. I read the Java programming art by myself at ordinary times. I also learned a lot about Java, next time I have the opportunity to talk about my problems and doubts. Today I am talking about what Javascript is. I have never learned this thing, but I have been using it for two days.

 

 

 

 

Everyone has used Google Earth. It's fun, and map should have been used without earth. If neither of them is used, just try it, the usage of map is similar to that of Earth. Here we will talk about Google Earth.

First, let's talk about writing our own Google Earth compilation platform. I don't know if you know that Google has one called:

This is awesome. I discovered it accidentally. It can be compiled and debugged online, right? You can try it ·····

(Google Earth plug-in needs to be installed during running. You will be prompted to install the Google Earth plug-in as soon as possible. Refresh the page after installation .)

 

Let's start to talk about our Earth, in fact, the use of this earth is not difficult, is to Google to our API to understand it is OK, for the two web site http://code.google.com/intl/zh-CN/apis/earth/documentation/index.html

Http://code.google.com/p/earth-api-utility-library/

To get started, let's take a look at these things. You know what they are. If you need them later, you can come back and find them.

This Google Earth API is easy to understand and I will not post more code ····

Below is the API demo library, very good http://code.google.com/intl/zh-CN/apis/earth/documentation/demogallery.html

I have read all of these ideas... very interesting. If you appreciate it, you will be interested in doing it yourself.

 

Let's talk about what I think is critical, and the rest of us will do it ourselves!

1. "event monitoring"

API documentation for http://code.google.com/intl/zh-CN/apis/earth/documentation/events.html

The listening of this event is very important. Similar to the "event" in windows, there is a listen function listener. When a listener event occurs, the listener responds to the listener and processes it. Let's take a look at the following to understand the basics:

// Listen for mousedown on the window (look specifically for point placemarks ). <br/> Google. earth. addeventlistener (GE. getwindow (), 'mousedown', function (event) {<br/> If (event. gettarget (). getType () = 'kmlplacemark' & <br/> event. gettarget (). getgeometry (). getType () = 'kmlpoint') {<br/> var placemark = event. gettarget (); <br/> draginfo = {<br/> placemark: event. gettarget (), <br/> dragged: false <br/>}; <br/>}< br/>} 

2. Use of object containers

API documentation http://code.google.com/intl/zh-CN/apis/earth/documentation/containers.html

 

 

Google Earth API has many container objects. They can be used to store arrays of related objects:

• GELinearRingContainerArray that stores linear ring objects. For example, the inside frame of a polygon is stored in an online ring container.
• GEFeatureContainerContains map items, just like folders in kml.
• GEGeometryContainerStore any number of ry images in a multigeometry object.

Containers are abstract classes and cannot be directly created through APIS.

In fact, this document is very detailed. You can explore it yourself. After using it, you will naturally understand it. It is really difficult to go to bed and go to O (else _ else) O ~

The following describes the simple functions I have implemented:

1. Search for the target location

2. display the longitude and latitude of the mouse point

3. display the elevation of the mouse point

4. 3D view and view height

5. Scale

6. Select the image shooting time (you can compare the landform changes within a few years)

Code is very simple, very few ·····

<! -- <Br/> you are free to copy and use this sample in accordance with the terms of the <br/> Apache license (http://www.apache.org/licenses/LICENSE-2.0.html) <br/> --> <br/> <! Doctype HTML public "-// W3C // dtd xhtml 1.0 strict // en" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <br/> <HTML xmlns = "http://www.w3.org/1999/xhtml"> <br/> <pead> <br/> <meta http-equiv = "Content-Type" content = "text/html; charset = GBK "> <br/> <title> my Google Earth </title> <br/> <MCE: script src =" http://www.google.com/jsapi? Key = clerk "mce_src =" http://www.google.com/jsapi? Key = plain "type =" text/JavaScript "> </MCE: SCRIPT> <br/> <MCE: script src = ". /myearth_files/jsapi "mce_src =" myearth_files/jsapi "type =" text/JavaScript "> </MCE: SCRIPT> <br/> <MCE: script src = ". /myearth_files/extensions. pack. JS "mce_src =" myearth_files/extensions. pack. JS "type =" text/JavaScript "> </MCE: SCRIPT> <br/> <MCE: script ty Pe = "text/JavaScript"> <! -- </P> <p> var Ge; <br/> var Gex = NULL; </P> <p> var placemarka; <br/> var placemarkb; <br/> var draginfo = NULL; </P> <p> Google. load ("Earth", "1.x"); <br/> Google. load ("maps", "2.x"); </P> <p> Google. setonloadcallback (init); </P> <p> function Init () {<br/> Google. earth. createinstance ('map3d ', initcallback, failurecallback); <br/>}</P> <p> function initcallback (Instance) {<br/> Ge = instance; <br/> // G E. getsun (). setvisibility (true); <br/> ge. getwindow (). setvisibility (true); <br/> ge. getoptions (). setscalelegendvisibility (true); <br/> ge. getoptions (). setstatusbarvisibility (true); <br/> ge. getoptions (). setoverviewmapvisibility (true); <br/> // ge. getoptions (). setgridvisibility (true); <br/> // Add a navigation control <br/> ge. getnavigationcontrol (). setvisibility (GE. visibility_auto); </P> <p> // Add s Ome layers <br/> ge. getlayerroot (). enablelayerbyid (GE. layer_borders, true); <br/> ge. getlayerroot (). enablelayerbyid (GE. layer_roads, true); <br/> ge. getlayerroot (). enablelayerbyid (GE. layer_terrain, true); </P> <p> // fly to the grand canyon <br/> var LA = Ge. createlookat (''); <br/> La. set (39.90419, 116.40742, 0, GE. altitude_relative_to_ground, <br/>-30, 40,100 00); <br/> ge. getview (). setabstractview (LA); </P> <p> Gex = new gearthur extensions (instance); </P> <p> Gex. util. lookat ([1, 1], {range: 800000, tilt: 40 }); </P> <p> // create start and end placemark <br/> var rulercolor = '# fc0 '; </P> <p> var placemarkoptionsa = {<br/> name: 'device A', <br/> style: {<br/> icon: {<br/> color: rulercolor, <br/> stockicon: 'paddle/WHT-Stars', <br/> hotspot: {left: '000000', bottom: 0 }< br/>}< br/>}; <br/> VaR placemarkoptionsb = {<br/> name: 'device B ', <br/> style: {<br/> icon: {<br/> color: rulercolor, <br/> stockicon: 'paddle/WHT-Stars', <br/> hotspot: {left: '000000', bottom: 0 }< br/>}< br/>}; </P> <p> var startplacemark = Gex. dom. addpointplacemark ([39.90047, 116.41409], placemarkoptionsb); <br/> var endplacemark = Gex. dom. addpointplacemark ([39.90389, 116.39812], placemarkoptionsa); </P> <p> // Create the distance Updater function <br/> VaR _ updatedistance = function () {<br/> document. getelementbyid ('distance '). innerhtml = <br/> (new Geo. point (startplacemark. getgeometry ()). distance (<br/> new Geo. point (endplacemark. getgeometry ()/1000 ). tofixed (4) + <br/> 'km '; <br/> }; </P> <p> // create the line placemark <br/> var lineplacemark = Gex. dom. addplacemark ({<br/> linestring: {<br/> Path: [startplacemark. getgeometry (), <br/> endplacemark. getgeometry ()], <br/> altitudemode: GE. altitude_clamp_to_ground, <br/> Tessellate: True <br/>}, <br/> style :{< br/> line: {color: rulercolor, opacity: 0.5, width: 15} <br/>}< br/>}); </P> <p> // make them draggable <br/> var dragoptions ={< br/> bounce: false, <br/> dragcallback: function () {<br/> lineplacemark. setgeometry (<br/> Gex. do M. buildlinestring ({<br/> path: [startplacemark. getgeometry (), <br/> endplacemark. getgeometry ()], <br/> altitudemode: GE. altitude_clamp_to_ground, <br/> Tessellate: True <br/>})); </P> <p> // update the distance on Drag <br/> _ updatedistance (); <br/>}< br/>}; </P> <p> // show start distance <br/> _ updatedistance (); </P> <p> Gex. edit. makedraggable (startplacemark, dragoptions); <br/> Gex. edit. makedragg Able (endplacemark, dragoptions); </P> <p> // listen to the click event on the globe and window <br/> Google. earth. addeventlistener (GE. getwindow (), 'mousemove ', function (event) {<br/> var statushtml = 'n'/A'; <br/> var statushtml1 = 'n'/B '; <br/> var statushtml2 = 'n'/C'; <br/> If (event. getdidhitglobe () {<br/> var latitude = event. getlatitude (); <br/> If (latitude) {<br/> statushtml1 = '<span Style = "Color: #000; font-weight: bold;" mce_style = "color: #000; font-weight: bold;"> '+ <br/> latitude. tofixed (5) + '</span>'; <br/>}< br/> var longpolling = event. getlongpolling (); <br/> If (longpolling) {<br/> statushtml2 = '<span style = "color: #000; font-weight: bold; "mce_style =" color: #000; font-weight: bold; "> '+ <br/> longpolling. tofixed (5) + '</span>'; <br/>}</P> <p> var groundaltitude = Ge. getglobe (). getg Roundaltitude (latitude, longpolling); <br/> If (groundaltitude) {<br/> statushtml = '<span style = "color: #000; font-weight: bold; "mce_style =" color: #000; font-weight: bold; "> '+ <br/> groundaltitude. tofixed (5) + 'meters </span> '; <br/>}</P> <p> document. getelementbyid ('ground-latitude '). innerhtml = statushtml1; <br/> document. getelementbyid ('ground-longyun '). innerhtml = statushtml2; </P> <p> d Ocument. getelementbyid ('ground-altitude '). innerhtml = statushtml; <br/>}); </P> <p> // look at the placemark we created </P> <p> var LA = Ge. createlookat (''); </P> <p> La. set (39.90419, 116.40742, </P> <p> 0, // altitude </P> <p> ge. altitude_relative_to_ground, </P> <p> 0, // heading </P> <p> 0, // straight-down Tilt </P> <p> 5000 // range (inverse of zoom) </P> <p>); </P> <p> ge. getview (). setabstractview (LA); </P> <p >}</P> <p> function failurecallback (errorcode) {<br/>}</P> <p> function gobuttonclick () {<br/> var geocodelocation = document. getelementbyid ('location '). value; </P> <p> var geocoder = new Google. maps. clientgeocoder (); <br/> geocoder. getlatlng (geocodelocation, function (point) {<br/> If (point) {<br/> var lookat = Ge. createlookat (''); <br/> lookat. set (point. y, point. x, 10, GE. altitude_relative_to _ Ground, <br/> 0, 60,200 00); <br/> ge. getview (). setabstractview (lookat); <br/>}< br/>}); <br/>}</P> <p> // --> </MCE: SCRIPT> <MCE: script src = ". /myearth_files/saved_resource "mce_src =" myearth_files/saved_resource "type =" text/JavaScript "> </MCE: SCRIPT> <MCE: script src = ". /myearth_files/default. i. JS "mce_src =" myearth_files/default. i. JS "type =" text/JavaScript "> </MCE: SCRIPT> <br/> </pead> <br/> <input id =" Location "type =" text "value =" Dalian "/> <input name =" go "type =" button "value =" Go! "Onclick =" gobuttonclick () "> <br/> <p> surface elevation: <span id =" ground-altitude "style =" color: # CCC; "mce_style =" color: # CCC; "> N/A </span> latitude: <span id =" ground-latitude "style =" color: # CCC; "mce_style =" color: # CCC; "> N/B </span> longitude: <span id =" ground-longpolling "style =" color: # CCC; "mce_style =" color: # CCC; the distance between "> N/C </span> <strong> device a </strong> and <strong> device B </strong> is: <strong> <span id = "distance"> N/d </strong> </span> </P> <p> <body> <br/> <Div id = "map3d_container"> <br/> <Div id = "map3d" style = "width: 100%; Height: 625px; "> </div> <br/> </div> </P> <p> <br> </P> <p> </body> <br/> </ptml> </P> <p>

Oh... sleeping ~~~~