Mapping for Sustainability
Google Mapping Workshop
http://tr.im/sustain_workshop
Sean Askay
Geometries
Points, Lines, Polygons:
• Clickable
• Altitude Modes (clamped, relative, absolute)
• Extruded / Tessellated / Styling
• Multi-Geometries
3D Models:
• Sketchup / Collada
• Not clickable (but can combined w/ multigeometry)
Ground Overlays:
• Latlong box or quad-point tie-down
• Altitude modes
• Super Overlays
Photo Overlays & Screen Overlays:
• Immersive Panoramas
• On-Screen Legends
Interactive KML Sampler
Working with large datasets
Tiling Raster Data
Working with large datasets
Regionating Vector Data
Working with GIS Data
Free, cheap and easy tools:
• shp2kml (vector)
• kml2shp online (vector)
Free but complex tools:
• gdal & ogr (raster / vector: prog. libraries & binary tools) *
• ogr2gui (vector: standalone win/os X)
• MapTiler (raster: standalone OS X) *
• Regionator (raster / vector: python library)
Commercial tools:
• Arc2Earth (ArcGIS plugin) - $300 *
• SuperOverlay (raster) - $20/35/90 *
• KMLer - (ArcGIS plugin) $20/35/50
• kml2kml - (standalone) $50/95/195 *
• shape2earth - (standalone) $30
Reviews & info at: freegeographytools.com
* - performs tiling / regionation
Don't use Google Earth Pro to
import vector data!
Google Charts API
code.google.com/apis/chart
Charts API: bar chart
http://chart.apis.google.com/chart?
cht=bhs (bar chart)
&chs=400x225 (dimensions)
&chd=t:10,50,60,80,40|50,60,100,40,20 (data)
&chco=4d89f9,c6d9fd (colors)
&chbh=20 (bar width)
test link
code.google.com/p/google-chartwrapper/
Create maps without coding
Create in Google Earth:
• Easy, but not scalable
• Earth User's Guide
Google My Maps:
• Easy to use / Collaborative
• Public vs. Unlisted
• Embedding /
• KML & view in Earth
• User's Guide
• YouTube video
Spreadsheet Mapper:
• 400 point placemarks
• 6 HTML templates
• Collaborative
• Read Tutorial
Google Earth Outreach Tutorials: earth.google.com/outreach
f_in = open('data.csv', 'r')
f_out = open('data.kml', 'w')
f_out.write('<Document>')
for row in f_in:
name, lat, lng = row.strip().split(',')
kml = '''
<Placemark>
<name>%s</name>
<Point>
<coordinates>%s,%s</coordinates>
</Point>
</Placemark>''' % (name, lng, lat)
f_out.write(kml)
f_out.write('</Document>')
Google Confidential and Proprietary
User's Guide,36.2,-84.4
Coal River Mountain,37.9,-81.4
Gauley Mountain,38.1,-81.1
Blair Mountain,37.8,-81.8
Huckleberry Ridge,37.0,-83.3
Creating KML with python
KML for programmers
code.google.com/apis/kml
• KML Reference
• Developers's Guide: Touring, time animation, extendedData, etc.
• Articles:
o CSV -> KML with python - link
o PHP & MySQL -> KML - link
• Geo Developers Blog
• KML Developer Support Group
• KML supported by Google Maps
ExtendedData
<Placemark>
  <name>Club house</name>
  <ExtendedData>
    <Data name="holeNumber">
      <value>1</value>
    </Data>
    <Data name="holeYardage">
      <value>234</value>
    </Data>
    <Data name="holePar">
      <value>4</value>
    </Data>
  </ExtendedData>
  <Point>
    <coordinates>-111.956,33.5043</coordinates>
  </Point>
</Placemark>
ExtendedData +
BalloonStyle
<?xml version="1.0" encoding="UTF-8"?>
<kml xmlns="http://www.opengis.net/kml/2.2">
<Document>
<name>Data+BalloonStyle</name>
<Style id="golf-balloon-style">
<BalloonStyle>
<text>
<![CDATA[
This is $[name]
This is hole $[holeNumber]
The par for this hole is $[holePar]
The yardage is $[holeYardage]
]]>
</text>
</BalloonStyle>
</Style>
<Placemark>
<name>Club house</name>
<styleUrl>#golf-balloon-style</styleUrl>
<ExtendedData>
<Data name="holeNumber">
<value>1</value>
</Data>
<Data name="holeYardage">
<value>234</value>
</Data>
<Data name="holePar">
<value>4</value>
</Data>
</ExtendedData>
<Point>
<coordinates>-111.956,33.5043</coordinates>
</Point>
</Placemark>
</Document>
</kml>
Easy Map Embedding
Embed Google My Maps:
• Create your map, click "Link" at upper right
• Choose URL or HTML embed code
• Tutorial
Import your KML into My Maps:
• Create new map, click on "Import"
• Choose your GeoRSS or KML file
Embed Google Earth & KML file:
• Embedded KML Gadget: tr.im/embedkml
Embed Google Earth & Tour file:
• Embedded Tour Gadget: tr.im/embedtour
Embedding Google Maps API
<script src="http://maps.google.com/maps?file=api&amp;v=2&amp;
key= YOURAPIKEY" type="text/javascript"></script>
<script type="text/javascript">
var map;
var geoXml;
function init() {
if (GBrowserIsCompatible()) {
geoXml = new GGeoXml("http://path/to/your.kml");
map = new GMap2(document.getElementById("map_canvas"));
map.addOverlay(geoXml);
}
}
</script> ...
<body onload="init()">
<div id="map_canvas"></div>
...
code.google.com/apis/maps
<script src="http://www.google.com/jsapi?key=YOURAPIKEY"></script>
<script>
google.load('earth', '1');
var ge = null;
function init() {
google.earth.createInstance('map3d', initCallback, failureCallback);
}
function initCallback(pluginInstance) {
pluginInstance.getWindow().setVisibility(true);
addKmlFromUrl('http://path/to/your.kml');
}
function addKmlFromUrl(kmlUrl) {
var link = ge.createLink('');
link.setHref(kmlUrl);
var networkLink = ge.createNetworkLink('');
networkLink.setLink(link);
ge.getFeatures().appendChild(networkLink);
}
</script>
....
<body onload="init()">
<div id="map3d"></div>
3...
Embedding Google Earth Plugin/API
code.google.com/apis/earth
Google Confidential and Proprietary
Resources:
• NPO Intro to GMapping
• Google My Maps
• Google Earth
• Google Maps API
• Google Earth API
• KML Reference
More Examples:
• Google Earth Gallery
• Outreach Showcase
tr.im/map4npo (TechSoup)
maps.google.com > "My Maps"
earth.google.com
code.google.com/apis/maps
code.google.com/apis/earth
code.google.com/apis/kml
earth.google.com > "Gallery"
earth.google.com/outreach > "Showcase"
Links to examples:
• ilovemountains.org & "Global Awareness" in Google Earth
• NAIL: mountainresource.org/nail
• Conservation Solutions for Renewable Energy
• Crisis in Darfur: at ushmm.org & "Global Awareness" Layer
• Geo-Thermal Energy Potential: google.org/egs
• Oil Imports Map: move.rmi.org
More Mapping examples:
• Google Earth Outreach Showcase
• Google Earth Gallery
• Google LatLong blog
• Google Earth blog
• OgleEarth blog

Askayworkshop

  • 1.
    Mapping for Sustainability GoogleMapping Workshop http://tr.im/sustain_workshop Sean Askay
  • 2.
    Geometries Points, Lines, Polygons: •Clickable • Altitude Modes (clamped, relative, absolute) • Extruded / Tessellated / Styling • Multi-Geometries 3D Models: • Sketchup / Collada • Not clickable (but can combined w/ multigeometry) Ground Overlays: • Latlong box or quad-point tie-down • Altitude modes • Super Overlays Photo Overlays & Screen Overlays: • Immersive Panoramas • On-Screen Legends Interactive KML Sampler
  • 3.
    Working with largedatasets Tiling Raster Data
  • 4.
    Working with largedatasets Regionating Vector Data
  • 5.
    Working with GISData Free, cheap and easy tools: • shp2kml (vector) • kml2shp online (vector) Free but complex tools: • gdal & ogr (raster / vector: prog. libraries & binary tools) * • ogr2gui (vector: standalone win/os X) • MapTiler (raster: standalone OS X) * • Regionator (raster / vector: python library) Commercial tools: • Arc2Earth (ArcGIS plugin) - $300 * • SuperOverlay (raster) - $20/35/90 * • KMLer - (ArcGIS plugin) $20/35/50 • kml2kml - (standalone) $50/95/195 * • shape2earth - (standalone) $30 Reviews & info at: freegeographytools.com * - performs tiling / regionation Don't use Google Earth Pro to import vector data!
  • 6.
  • 7.
    Charts API: barchart http://chart.apis.google.com/chart? cht=bhs (bar chart) &chs=400x225 (dimensions) &chd=t:10,50,60,80,40|50,60,100,40,20 (data) &chco=4d89f9,c6d9fd (colors) &chbh=20 (bar width) test link code.google.com/p/google-chartwrapper/
  • 8.
    Create maps withoutcoding Create in Google Earth: • Easy, but not scalable • Earth User's Guide Google My Maps: • Easy to use / Collaborative • Public vs. Unlisted • Embedding / • KML & view in Earth • User's Guide • YouTube video Spreadsheet Mapper: • 400 point placemarks • 6 HTML templates • Collaborative • Read Tutorial Google Earth Outreach Tutorials: earth.google.com/outreach
  • 9.
    f_in = open('data.csv','r') f_out = open('data.kml', 'w') f_out.write('<Document>') for row in f_in: name, lat, lng = row.strip().split(',') kml = ''' <Placemark> <name>%s</name> <Point> <coordinates>%s,%s</coordinates> </Point> </Placemark>''' % (name, lng, lat) f_out.write(kml) f_out.write('</Document>') Google Confidential and Proprietary User's Guide,36.2,-84.4 Coal River Mountain,37.9,-81.4 Gauley Mountain,38.1,-81.1 Blair Mountain,37.8,-81.8 Huckleberry Ridge,37.0,-83.3 Creating KML with python
  • 10.
    KML for programmers code.google.com/apis/kml •KML Reference • Developers's Guide: Touring, time animation, extendedData, etc. • Articles: o CSV -> KML with python - link o PHP & MySQL -> KML - link • Geo Developers Blog • KML Developer Support Group • KML supported by Google Maps
  • 11.
  • 12.
    ExtendedData + BalloonStyle <?xml version="1.0"encoding="UTF-8"?> <kml xmlns="http://www.opengis.net/kml/2.2"> <Document> <name>Data+BalloonStyle</name> <Style id="golf-balloon-style"> <BalloonStyle> <text> <![CDATA[ This is $[name] This is hole $[holeNumber] The par for this hole is $[holePar] The yardage is $[holeYardage] ]]> </text> </BalloonStyle> </Style> <Placemark> <name>Club house</name> <styleUrl>#golf-balloon-style</styleUrl> <ExtendedData> <Data name="holeNumber"> <value>1</value> </Data> <Data name="holeYardage"> <value>234</value> </Data> <Data name="holePar"> <value>4</value> </Data> </ExtendedData> <Point> <coordinates>-111.956,33.5043</coordinates> </Point> </Placemark> </Document> </kml>
  • 13.
    Easy Map Embedding EmbedGoogle My Maps: • Create your map, click "Link" at upper right • Choose URL or HTML embed code • Tutorial Import your KML into My Maps: • Create new map, click on "Import" • Choose your GeoRSS or KML file Embed Google Earth & KML file: • Embedded KML Gadget: tr.im/embedkml Embed Google Earth & Tour file: • Embedded Tour Gadget: tr.im/embedtour
  • 14.
    Embedding Google MapsAPI <script src="http://maps.google.com/maps?file=api&amp;v=2&amp; key= YOURAPIKEY" type="text/javascript"></script> <script type="text/javascript"> var map; var geoXml; function init() { if (GBrowserIsCompatible()) { geoXml = new GGeoXml("http://path/to/your.kml"); map = new GMap2(document.getElementById("map_canvas")); map.addOverlay(geoXml); } } </script> ... <body onload="init()"> <div id="map_canvas"></div> ... code.google.com/apis/maps
  • 15.
    <script src="http://www.google.com/jsapi?key=YOURAPIKEY"></script> <script> google.load('earth', '1'); varge = null; function init() { google.earth.createInstance('map3d', initCallback, failureCallback); } function initCallback(pluginInstance) { pluginInstance.getWindow().setVisibility(true); addKmlFromUrl('http://path/to/your.kml'); } function addKmlFromUrl(kmlUrl) { var link = ge.createLink(''); link.setHref(kmlUrl); var networkLink = ge.createNetworkLink(''); networkLink.setLink(link); ge.getFeatures().appendChild(networkLink); } </script> .... <body onload="init()"> <div id="map3d"></div> 3... Embedding Google Earth Plugin/API code.google.com/apis/earth
  • 16.
    Google Confidential andProprietary Resources: • NPO Intro to GMapping • Google My Maps • Google Earth • Google Maps API • Google Earth API • KML Reference More Examples: • Google Earth Gallery • Outreach Showcase tr.im/map4npo (TechSoup) maps.google.com > "My Maps" earth.google.com code.google.com/apis/maps code.google.com/apis/earth code.google.com/apis/kml earth.google.com > "Gallery" earth.google.com/outreach > "Showcase"
  • 17.
    Links to examples: •ilovemountains.org & "Global Awareness" in Google Earth • NAIL: mountainresource.org/nail • Conservation Solutions for Renewable Energy • Crisis in Darfur: at ushmm.org & "Global Awareness" Layer • Geo-Thermal Energy Potential: google.org/egs • Oil Imports Map: move.rmi.org More Mapping examples: • Google Earth Outreach Showcase • Google Earth Gallery • Google LatLong blog • Google Earth blog • OgleEarth blog

Editor's Notes

  • #10 As you have seen from the keynote API traffic is increasing steadily We are now getting roughly 1 billion hits per day across our APIs So increasingly we have users using our data in other places than google.com
  • #15 As you have seen from the keynote API traffic is increasing steadily We are now getting roughly 1 billion hits per day across our APIs So increasingly we have users using our data in other places than google.com
  • #16 As you have seen from the keynote API traffic is increasing steadily We are now getting roughly 1 billion hits per day across our APIs So increasingly we have users using our data in other places than google.com
  • #17 As you have seen from the keynote API traffic is increasing steadily We are now getting roughly 1 billion hits per day across our APIs So increasingly we have users using our data in other places than google.com