1 / 47

Using KML, XML, and XSL to Create Google Earth Applications: A Tutorial

Using KML, XML, and XSL to Create Google Earth Applications: A Tutorial. Betsy Page Sigman and William Garr Georgetown University. Southeast Decision Sciences Institute Conference Orlando, Florida February 22, 2008. Overview.

kylee
Download Presentation

Using KML, XML, and XSL to Create Google Earth Applications: A Tutorial

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Using KML, XML, and XSL to Create Google Earth Applications: A Tutorial Betsy Page Sigman and William Garr Georgetown University Southeast Decision Sciences Institute Conference Orlando, Florida February 22, 2008

  2. Overview • The benefits of displaying data using Google Earth/Google Maps (GE/GM) • KML and the creation of placemarks in Google Earth/Google Maps • Use an Access database to create many placemarks simultaneously • Create different styles of placemarks based on the value of an attribute.

  3. Why Use Google Earth/Maps to Show Data 1) Allows the viewer to understand the data more fully. 2) Can enable the viewer to use the data more easily. 3) Gives a more comprehensive view about how the data presented relate to each other. 4) Can aid in decision support, due to the properties discussed above.

  4. Getting Information from a Placemark • From information listed on the placemark (i.e. Address, Contact person, Phone, Email, etc.) • From the geographic location of the placemark. • From an attribute of the icon used (i.e. shape, color)

  5. XML • XML stands for “eXtensible Markup Language.” • Extensible means that it can be extended to create whatever tags you want.

  6. How it differs from HTML • XML holds data • HTML presents data • XML is about what data is • HTML is about how data looks • XML is for data description • HTML is for data display

  7. Example of XML <note> <to>Rebecca</to> <from>Donald</from> <heading>Remember</heading> <reminder>Don’t forget your MIS final</reminder> </note> Right now, this doesn’t do anything. You’d have to send it or display it.

  8. Simple KML File • <?xml version="1.0" encoding="UTF-8"?> • <kml xmlns="http://earth.google.com/kml/2.0"> <Placemark> • <description>Washington, D.C.</description> • <name>Washington, D.C.</name> • <Point> • <coordinates>-76.5427,38.583314,0</coordinates> • </Point> • </Placemark> • </kml>

  9. Ways to Create a KML File • 1) Use Google Earth’s placemark creator. • 2) Use a plain text editor such as Notepad or an XML editor. • Output data from a database in the correct format. Later, we show how to do this with an Access database and an XSL transform.

  10. Creating a Placemark • Open up Google Earth. • Click on yellow pushpin icon. • Cursor over yellow box until cursor turns into a pointing finger. Now move the box where you want to put the placemark. • Fill in a description. Click “OK.” • Look over at sidebar on left; you should see a label with whatever you called your placemark.

  11. Creating a Placemark (cont.) • Click on the link on the left to go to the placemark. • Right click and go to “Properties.” • Click on icon in upper right corner of box to select a different icon.

  12. Creating a Placemark (cont.) Experiment with changing the following: • Shape • Color of placemark • Scale • Opacity • Color, Scale and Opacity of Label • View • Altitude

  13. Examine the KML • After you’ve changed the settings, close out of the placemark by clicking “OK.” • Now find your file over on the left, right click, select “Copy” and paste it into a Notepad file. • You will see the KML for the placemark you just created.

  14. KML Placemark (Page 1) <?xml version="1.0" encoding="UTF-8"?> <kml xmlns="http://earth.google.com/kml/2.2"> <Document> <name>KmlFile</name> <Style id="sh_ylw-pushpin1"> <IconStyle> <scale>1.3</scale> <Icon> <href>http://maps.google.com/mapfiles/kml/pushpin/ylw-pushpin.png</href> </Icon> <hotSpot x="20" y="2" xunits="pixels" yunits="pixels"/> </IconStyle> </Style> <StyleMap id="msn_ylw-pushpin0"> <Pair> <key>normal</key> <styleUrl>#sn_ylw-pushpin2</styleUrl> </Pair>

  15. KML Placemark (Page 2) <Pair> <key>highlight</key> <styleUrl>#sh_ylw-pushpin1</styleUrl> </Pair> </StyleMap> <Style id="sn_ylw-pushpin2"> <IconStyle> <scale>1.1</scale> <Icon> <href>http://maps.google.com/mapfiles/kml/pushpin/ylw-pushpin.png</href> </Icon> <hotSpot x="20" y="2" xunits="pixels" yunits="pixels"/> </IconStyle> </Style> <Placemark> <name>Test Placemark One</name> <description>Here is where test placemark one is located.</description>

  16. KML Placemark (Page 3) <LookAt> <longitude>26.41145107108635</longitude> <latitude>12.13590310050818</latitude> <altitude>0</altitude> <range>7891159.275852153</range> <tilt>1.397977576698283e-014</tilt> <heading>11.99119024368262</heading> </LookAt> <styleUrl>#msn_ylw-pushpin0</styleUrl> <Point> <coordinates>26.41145107108635,12.13590310050818,0</coordinates> </Point> </Placemark> </Document> </kml>

  17. Changing an Access Database to XML • Pick fields from the Access database to include in your placemarks. • Rename fields if they have spaces and characters such as underscores (that don’t translate well to XML). • Create and save a query using those fields. • Export that query to a XML file, by going to the “External Data” tab, then going to the “Export” tab, and going to “More,” then selecting “XML File.” • Notice that each record becomes an element encompassed by tags bearing the name of the query. • This above has just been to show you how to change the data to XML. To create KML you’ll need an XSL stylesheet.

  18. XSL • XSL stands for eXtensible Style Language. • XSL gives instructions for how data should be displayed. • Since KML is a subset of XML, we can use XSL to transform KML to look the way we want.

  19. Using XSL with Access • As you output the Access records to XML, you can transform them by selecting an XSL stylesheet. • You can use this to: • Choose elements • Make decisions about elements based on values • Embed HTML to structure the data the way you wish • Automatically create placemarks formatted the way you like.

  20. Steps to Creating an XSL Transform Include information on the XML version and encoding: <?xml version="1.0" encoding="ISO-8859-1"?> Call the xml namespace for xsl transforms: <xsl:stylesheetxmlns:xsl=”http://www.w3.org/1999/XSL/Transform” version="1.0"> Say go to the root element: <xsl:template match="/"> Indicate the version of kml that will be used: <kmlxmlns="http://earth.google.com/kml/2.2"> Put in document and name tags: <Document> <name>KmlFile</name>

  21. Steps to Creating an XSL File (cont.) <Style id="sn_ylw-pushpin"> <IconStyle> <scale>1.1</scale> <Icon> <href>http://maps.google.com/mapfiles/kml/pushpin/ylw-pushpin.png</href> </Icon> <hotSpot x="20" y="2" xunits="pixels" yunits="pixels"/> </IconStyle> </Style> <Style id="sh_ylw-pushpin"> <IconStyle> <scale>1.3</scale> <Icon> <href>http://maps.google.com/mapfiles/kml/pushpin/ylw-pushpin.png</href> </Icon> <hotSpot x="20" y="2" xunits="pixels" yunits="pixels"/> </IconStyle> </Style> Add formatting for the pushpin icon. You can copy and paste from creating one by clicking on the yellow icon and reformatting it the way you like.

  22. Steps to Creating an XSL File (cont.) <StyleMap id="msn_ylw-pushpin"> <Pair> <key>normal</key> <styleUrl>#sn_ylw-pushpin</styleUrl> </Pair> <Pair> <key>highlight</key> <styleUrl>#sh_ylw-pushpin</styleUrl> </Pair> </StyleMap>

  23. Steps to Creating an XSL File (cont.) Next, we will set out a statement that will select every data record. Notice that here the exported KML file was built from a query called “ExportQuery.” <xsl:for-each select="dataroot/ExportQuery"> Then we give instructions on how to structure the placemarks. For the name element, we select each value of “Organization”. <Placemark> <name><xsl:value-of select="Organization"/></name>

  24. Steps to Creating an XSL File (cont.) Then we start the description tags. The xsl:value-of tag tells to select the value of “Community.” Notice how we use CDATA to create breaks. <description> <![CDATA[<br/>]]> <xsl:value-of select="Community"/> <![CDATA[<br/>]]>

  25. Steps to Creating an XSL File (cont.) <xsl:choose> <xsl:when test="Town=DistrictState"> <xsl:value-of select="Town"/> <![CDATA[ ,]]> <xsl:value-of select="Country"/> </xsl:when> <xsl:otherwise> <xsl:value-of select="Town"/> <![CDATA[ ,]]> <xsl:value-of select="DistrictState"/> <![CDATA[ ,]]> <xsl:value-of select="Country"/> </xsl:otherwise> </xsl:choose> <![CDATA[<br/>]]> <xsl:value-of select="Email"/> </description> What is going on here?

  26. Steps to Creating an XSL File (cont.) Below, we’ve asked the program to create placemarks circling the equator. These can then be moved by hand into appropriate positions. Another, more exact, way to position placemarks is to merge your Access file with latitude and longitude positions for places, towns, and cities. There are free and paid sources available for latitude and longitude. <Point> <coordinates><xsl:number value="5 * position()"/>,0,5</coordinates> </Point> </Placemark> </xsl:for-each> </Document> </kml> </xsl:template> </xsl:stylesheet> After you’ve completed your xslstylesheet, save it in Notepad with a .xsl extension.

  27. Using an XSL Transform To export your Access data to KML in Microsoft Access 2007 by using an XSL transform, carry out the following steps: 1) Select table or query to export; 2) Click “External Data” tab; 3) Under Export, click “More” to show more export options, then “XML File”; 4) Browse to find the location you want to export the data to (being sure that it will be saved as an XML file), click “OK”; 5) Be sure that the “Data” box is checked; 6) Click “More Options” and then click “Transforms.” 7) Click “Add” and find the .xsl file where you stored the code to transform your data into XML. Click “OK.” 8) Be sure that “Export Data” is checked and under “Records to Export”, the “All Records” radio button is selected. 9) Click “OK” to transform the data set to XML.

  28. Creating a KML file The file you just created will be output as an XML file. You will need to change it to a KML file by: • Finding the file (using Windows Explorer) and selecting it. • Right clicking and renaming it as a .kml file.

  29. Open the file in Google Earth • Be sure that Google Earth is installed on your computer. • Select the KML file you created. • Right click and select “Open with” and “Google Earth.” • Your placemarks should appear. • This file can be posted on a web site and downloaded so that others can make use of the KML file you’ve created.

  30. Creating Different Placemark Styles and Assigning Them Based on an Attribute • Often there is a need to create different types of placemarks to differentiate between types of organizations, places, etc. • This can be done using an xsl:choose statement in combination with xsl:when test statements. • An example of an xsl spreadsheet that was used to create blue ranger station icons (that look similar to schoolhouses) to represent high schools and red ranger station icons to represent colleges is shown below.

  31. <?xml version="1.0" encoding="ISO-8859-1"?> <xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0"> <xsl:template match="/"> <!--This version has schoolhouses for placemarks.--> <kml xmlns="http://earth.google.com/kml/2.2"> <Document> <!--Each organization in the file is tagged as "ExportQuery" so the line below selects each one--> <xsl:for-each select="dataroot/ExportQuery"> <name>STAND</name>

  32. <!--This begins the description of the red ranger station icon.--> <Style id="sn_ranger_station"> <IconStyle> <color>ffff5500</color> <scale>1.2</scale> <Icon> <href>http://maps.google.com/mapfiles/kml/shapes/ranger_station.png</href> </Icon> <hotSpot x="0.5" y="0" xunits="fraction" yunits="fraction"/> </IconStyle> <ListStyle> </ListStyle> </Style>

  33. <!--There is a pair of icons. Which one shows depends on whether the icon is moused over or not.--> <StyleMap id="msn_ranger_station"> <Pair> <key>normal</key> <styleUrl>#sn_ranger_station</styleUrl> </Pair> <Pair> <key>highlight</key> <styleUrl>#sh_ranger_station</styleUrl> </Pair> </StyleMap>

  34. <Style id="sh_ranger_station"> <IconStyle> <color>ffff5500</color> <scale>1.4</scale> <Icon> <href>http://maps.google.com/mapfiles/kml/shapes/ranger_station.png</href> </Icon> <hotSpot x="0.5" y="0" xunits="fraction" yunits="fraction"/> </IconStyle> <ListStyle> </ListStyle> </Style>

  35. <!--This begins the description of the blue ranger station icon.--> <StyleMap id="msn_ranger_station_copy1"> <Pair> <key>normal</key> <styleUrl>#sn_ranger_station_copy1</styleUrl> </Pair> <Pair> <key>highlight</key> <styleUrl>#sh_ranger_station_copy1</styleUrl> </Pair> </StyleMap>

  36. <Style id="sh_ranger_station_copy1"> <IconStyle> <color>ff0000ff</color> <scale>1.4</scale> <Icon> <href>http://maps.google.com/mapfiles/kml/shapes/ranger_station.png</href> </Icon> <hotSpot x="0.5" y="0" xunits="fraction" yunits="fraction"/> </IconStyle> <ListStyle> </ListStyle> </Style>

  37. <Style id="sn_ranger_station_copy1"> <IconStyle> <color>ff0000ff</color> <scale>1.2</scale> <Icon> <href>http://maps.google.com/mapfiles/kml/shapes/ranger_station.png</href> </Icon> <hotSpot x="0.5" y="0" xunits="fraction" yunits="fraction"/> </IconStyle> <ListStyle> </ListStyle> </Style>

  38. <!--The choose statement lets you apply different styles of placemark design to different classifications of data.--> <!--In this example,we differentiate between college and high school organizations.--> <xsl:choose> <xsl:when test="Division='HighSchool'"> <Placemark> <name> <xsl:value-of select="School"/> </name>

  39. <!--The tag below tells which icon style above to use.--> <styleUrl>#sn_ranger_station</styleUrl> <description> <![CDATA[<br/>]]> <xsl:value-of select="City"/> <![CDATA[,]]> <xsl:value-of select="State"/> <![CDATA[<br/>]]> <xsl:value-of select="Zip"/> <![CDATA[<br/>]]> <xsl:value-of select="CONTACTNAME"/> <![CDATA[<br/>]]> <xsl:value-of select="CONTACTEMAIL"/> </description>

  40. <Point> <coordinates><xsl:value-of select="Long"/>,<xsl:value-of select="Lat"/>,0</coordinates> </Point> </Placemark> </xsl:when> <xsl:when test="Division='College'"> <Placemark> <name><xsl:value-of select="School"/></name> <styleUrl>#sn_ranger_station_copy1</styleUrl> <description> <![CDATA[<br/>]]> <xsl:value-of select="City"/> <![CDATA[,]]> <xsl:value-of select="State"/> <![CDATA[<br/>]]> <xsl:value-of select="Zip"/> <![CDATA[<br/>]]> <xsl:value-of select="CONTACTNAME"/> <![CDATA[<br/>]]> <xsl:value-of select="CONTACTEMAIL"/> </description>

  41. <Point> <coordinates><xsl:value-of select="Long"/>,<xsl:value-of select="Lat"/>,0</coordinates> </Point> </Placemark> </xsl:when> </xsl:choose> </xsl:for-each> </Document> </kml> </xsl:template> </xsl:stylesheet>

  42. Conclusion • There are many ways to use Google Earth and Google maps to portray information easily. • We are just beginning to see the ways that this application will be able to more easily convey information. • For more information on Google Earth and KML, go to http://earth.google.com/userguide/v4/tutorials/index.html and http://code.google.com/apis/kml/documentation/kml_tut.html

  43. Thank you! Please contact me at: Betsy Page Sigman McDonough School of Business Georgetown University 412 Old North Washington, D.C. 20057 bps@georgetown.edu

More Related