• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
Using KML for Thematic Mapping
 

Using KML for Thematic Mapping

on

  • 111,044 views

Tech talk at Googleplex 12 December 2008

Tech talk at Googleplex 12 December 2008

Statistics

Views

Total Views
111,044
Views on SlideShare
18,034
Embed Views
93,010

Actions

Likes
35
Downloads
5
Comments
4

138 Embeds 93,010

http://thematicmapping.org 74272
http://blog.thematicmapping.org 10284
http://www.thematicmapping.org 2056
http://www.geotekno.com 1892
http://www.inigis.com 657
http://terrimago.blogspot.com 645
http://googlegargle.blogspot.com 529
http://terrimago.blogspot.fr 505
http://terrimago.blogspot.be 464
http://translate.googleusercontent.com 339
http://gemtice.blogspot.fr 206
http://gemtice.blogspot.com 157
http://thematicmapping.dev 123
http://inigis.info 95
http://feeds.feedburner.com 72
http://www.slideshare.net 57
http://gemtice.blogspot.be 36
http://googlegargle.blogspot.ca 30
http://googlegargle.blogspot.co.uk 27
http://googlegargle.blogspot.jp 24
http://www.techgig.com 22
http://www.ouzelbrain.com 22
http://googlegargle.blogspot.com.au 21
http://googlegargle.blogspot.in 20
http://fpsfocus.blogspot.com 19
http://inigis.com 17
http://terrimago.blogspot.ca 16
http://support4tutors.blogspot.gr 16
http://googlegargle.blogspot.fr 15
http://googlegargle.blogspot.se 15
http://www.thematicmapping.org. 13
http://googlegargle.blogspot.de 12
http://webcache.googleusercontent.com 10
http://webdidacticanova.blogspot.com 10
http://www.planetgs.com 10
http://thematicmapping.org. 10
http://earthatlas.info 9
http://trangxoa.com 9
http://terrimago.blogspot.ch 9
http://67.20.120.230 9
http://131.253.14.66 7
http://terrimago.blogspot.co.uk 7
http://ibrr.org 7
http://gisdk.blogspot.com 7
http://googlegargle.blogspot.dk 6
http://googlegargle.blogspot.tw 6
http://googlegargle.blogspot.kr 6
http://static.slideshare.net 6
https://www.rebelmouse.com 6
http://www.google.com 5
More...

Accessibility

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

CC Attribution-ShareAlike LicenseCC Attribution-ShareAlike License

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel

14 of 4 previous next Post a comment

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment
  • Thank Michael/Google for inviting me Introduce myself This work is based on a MSc in GIS at University of Edinburgh Currenlty working as in UN Association of Norway Making data from UN organisations more accessible to the public Globalis

Using KML for Thematic Mapping Using KML for Thematic Mapping Presentation Transcript

  • Using KML for Thematic Mapping Bjørn Sandvik thematicmapping.org MSc in Geographical Information Science University of Edinburgh Project Manager at United Nations Association of Norway Tech Talk at Googleplex 12 December 2008
    • Thematic mapping techniques
      • Proportional symbol maps
      • Chart maps
      • Choropleth
      • 3-D prism maps
      • 3-D bar maps
      • Animated maps
    • Thematic Mapping Engine
    • Google Earth issues
    Outline Geo- browsers Thematic mapping techniques KML standard Public datasets Visualisations
  • Proportional symbols
  • Proportional symbols #1 Scaling image icons
  •  
  •  
  •  
  •  
  •  
  • Mathematical scaling of 2-D point symbols: symbolSize = power(value/maxValue; 1/2) * maxSize KML for proportional icon images <Style id='sharedStyle'> <IconStyle> <Icon> <href>files/symbol.png</href> </Icon> </IconStyle> <Style> KML <Placemark> <name>China</name> <Snippet>1,312,978,855 (2005)</Snippet> <styleUrl>#sharedStyle</styleUrl> <Style> <IconStyle> <color>e50066ff</color> <scale>7</scale> </IconStyle> </Style> <Point> <coordinates>106.514,33.42,0</coordinates> </Point> </Placemark> KML
  • Problem: Size affected by viewport
  • Not working in Google Maps
  • Proportional symbols #2 Drawing regular polygons
  •  
  • Problem: Complicated! function kmlSymbolCalculator ( $longitude, $latitude, $radius, $vertices) { $EARTH_RADIUS_EQUATOR = 6378140.0; $RADIAN = 180 / pi(); $long = $longitude / $RADIAN; $lat = $latitude / $RADIAN; $f = 1/298.257; $e = 0.08181922; $kml = '<Polygon><outerBoundaryIs><LinearRing><coordinates>'; for ( $bearing = 45; $bearing <= 405; $bearing += 360/$vertices ) { $b = $bearing / $RADIAN; $R = $EARTH_RADIUS_EQUATOR * (1 - $e * $e) / pow( (1 - $e*$e * pow(sin($lat),2)), 1.5); $psi = $distance/$R; $phi = pi()/2 - $lat; $arccos = cos($psi) * cos($phi) + sin($psi) * sin($phi) * cos($b); $latA = (pi()/2 - acos($arccos)) * $RADIAN; $arcsin = sin($b) * sin($psi) / sin($phi); $longA = ($long - asin($arcsin)) * $RADIAN; $kml .= &quot; “ . round($longA,$this->coordDecimals) . &quot;,“ . round($latA,$this->coordDecimals); } $kml = '</coordinates></LinearRing><outerBoundaryIs></Polygon>'; return $kml; }
  • Proportional symbols #3 Scaling 3-D Collada objects
  •  
  •  
  • Mathematical scaling of 3-D point symbols: symbolSize = power(value/maxValue; 1/3) * maxSize Making proportional Collada objects Position Measure / scale Colorize Google SketchUp <Placemark> <name>China</name> <Snippet>1,312,978,855 (2005)</Snippet> <Model> <Link> <href>files/object.dae</href> </Link> <altitudeMode>absolute</altitudeMode> <Location> <longitude>106.514</longitude> <latitude>33.42</latitude> <altitude>0</altitude> </Location> <Scale> <x>140000</x> <y>140000</y> <z>140000</z> </Scale> </Model> </Placemark> KML
  • Chart maps
  •  
  •  
  •  
  • Using Google Chart API in KML <Style id='sharedStyle'> <BalloonStyle> <text><![CDATA[ <img src='http://chart.apis.google.com/chart ?cht=p&chd=t:20,45,5 &amp;chd=t: $[chartValues] '> ]]></text> </BalloonStyle> </Style> KML <Placemark> <name>China</name> <Snippet>1,312,978,855 (2005)</Snippet> <styleUrl>#sharedStyle</styleUrl> <Style> <IconStyle> <scale>7</scale> <Icon> <href> http://chart.apis.google.com/chart?cht=p&chd=t:20,45,5&chs=300x150 &amp;chf=bg,s,ffffff00</href> </Icon> </IconStyle> </Style> <Point> <coordinates>106.514,33.42,0</coordinates> </Point> <ExtendedData> <Data name=&quot;chartValues&quot;> <value>20,45,5</value> </Data> </ExtendedData> </Placemark> KML
  • Choropleth maps
  •  
  • Prism maps
  •  
  •  
  •  
  • Problem: Polygon holes
  • KML used in prism maps Suggestion: <Placemark> <name>China</name> <Snippet>1,312,978,855 (2005)</Snippet> <styleUrl>#sharedStyle</styleUrl> <Style> <PolyStyle> <color>DC0066FF</color> </PolyStyle> </Style> <MultiGeometry> <Polygon> <extrude>1</extrude> <altitudeMode>absolute</altitudeMode> <outerBoundaryIs> <LinearRing> <coordinates> 110.72,20.06, 2000000 109.26,19.9, 2000000 108.63,19.28, 2000000 108.69,18.51, 2000000 110.05,18.38, 2000000 111.03,19.64, 2000000 (...) </coordinates> </LinearRing> </outerBoundaryIs> </Polygon> <Polygon> (...) </Polygon> </MultiGeometry> </Placemark> KML <Placemark> <name>China</name> <Snippet>1,312,978,855 (2005)</Snippet> <styleUrl>#sharedStyle</styleUrl> <Style> <PolyStyle> <color>DC0066FF</color> </PolyStyle> </Style> <MultiGeometry> <Polygon> <extrude>1</extrude> <altitude>2000000</altitude> <altitudeMode>clampToAltitude</altitudeMode> <outerBoundaryIs> <LinearRing> <coordinates> 110.72,20.06 109.26,19.9 108.63,19.28 108.69,18.51 110.05,18.38 111.03,19.64 (...) </coordinates> </LinearRing> </outerBoundaryIs> </Polygon> <Polygon> (...) </Polygon> </MultiGeometry> </Placemark> KML
  • 3-D bar maps
  • 3-D bars: One variable
  • 3-D bars: Two variables
  • Animated maps
  •  
  • Thematic Mapping Engine
  • Thematic mapping parameters Web Interface PHP Library Web Processing Service KML/KMZ Thematic Mapping Engine Thematic Mapping Engine
  •  
  •  
  •  
  • Apache MySQL PHP Web server HTML / JavaScript Ext JS Google Earth API Web browser 1. Get list of indicators 2. Get list of available years 3. Make KML/KMZ document 4. Download KML/KMZ file How it works
  • MySQL Data Connector Form Handler Database File Server Web server Web browser KML/KMZ files Web server infrastructure Thematic Mapping Engine
  • include ('TME_MySQL_DataConnector.php'); include ('TME_Engine.php'); $dataConnector = new DataConnector(); $dataStore = $dataConnector->getDataStore(68, 2005, 0); $parameters = array( 'mapType’ => 'choropleth', 'indicator' => 68, 'year' => 2005, 'classification' => 'equal' ); $map = new ThematicMap($dataStore, $parameters); $file = $map->getKML(); Application Programming Interface (API)
  • KML structure Add KML header Technique Choropleth Prism Bar Image Polygon Collada Type For each year For each feature Technique Choropleth Bar Image Polygon Collada Type Prism Add shared style Add shared style Add shared style Add shared style Colourise Collada object(s) Add style and feature Add style and feature Add style and feature Add style and feature Add style and feature Add link to Collada object Add map title and legend <Folder> <Placemark> </Placemark> </Folder> <kml> </kml> Symbol Symbol
  • Map legends Unclassed Equal intervals Quantiles
    • Same icon size in different viewports
    • Clickable polygons (not ctrl-click!)
    • Clickable extruded polygons
    • Clickable Collada models
    • Support alternative base maps
    • Google Legend API
    Google Earth fix!
  • thematic mapping.org