Using KML for Thematic Mapping

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 .= " “ . round($longA,$this->coordDecimals) . ",“ . 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 &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 &chf=bg,s,ffffff00</href> </Icon> </IconStyle> </Style> <Point> <coordinates>106.514,33.42,0</coordinates> </Point> <ExtendedData> <Data name="chartValues"> <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

http://thematicmapping.org	22289
http://blog.thematicmapping.org	9159
http://www.geotekno.com	737
http://www.thematicmapping.org	736
http://terrimago.blogspot.com	570
http://www.inigis.com	325
http://googlegargle.blogspot.com	319
http://translate.googleusercontent.com	192
http://gemtice.blogspot.com	131
http://inigis.info	95
http://terrimago.blogspot.fr	61
http://www.slideshare.net	57
http://feeds.feedburner.com	55
http://gemtice.blogspot.fr	35
http://googlegargle.blogspot.in	13
http://googlegargle.blogspot.jp	13
http://fpsfocus.blogspot.com	13
http://www.planetgs.com	10
http://webdidacticanova.blogspot.com	10
http://www.ouzelbrain.com	10
http://googlegargle.blogspot.se	8
http://67.20.120.230	8
http://gisdk.blogspot.com	7
http://googlegargle.blogspot.co.uk	7
http://www.techgig.com	7
http://ibrr.org	7
http://terrimago.blogspot.co.uk	6
http://webcache.googleusercontent.com	6
http://static.slideshare.net	6
http://googlegargle.blogspot.ca	5
http://www.gisiana.info	5
http://thematicmapping.org.	4
http://www.thematicmapping.org.	4
http://207.46.192.232	4
http://mizarmobile.blogspot.com	4
http://fsweb.geoportal.fs.fed.us	3
http://blocs.xtec.cat	3
http://terrimago.blogspot.ca	3
http://www.webdidacticanova.blogspot.com	3
http://googlegargle.blogspot.co.nz	3
http://feeds2.feedburner.com	3
http://googlegargle.blogspot.com.au	3
http://wildfire.gigya.com	2
http://googlegargle.blogspot.fr	2
http://honyaku.yahoofs.jp	2
https://recrossed.appspot.com	2
http://geolab21.blogspot.com	2
http://65.55.177.205	2
http://terrimago.blogspot.com.es	2
http://googlegargle.blogspot.com.es	2
http://gemtice.blogspot.ca	1

Using KML for Thematic Mapping

by Bjorn Sandvik on Dec 13, 2008

Accessibility

Categories

Tags

Upload Details

Usage Rights

74 Embeds 34,979

Statistics

Using KML for Thematic Mapping — Presentation Transcript