control-google-maps-canvas

Some of my favorite features of geteach.com are the simple controls users have for each map’s canvas. These simple controls are located in a drop down menu accessed by clicking the Map Canvas carrot. Toggles switches in this menu allow users to take greater control of each canvas. The images below explore each of the options in this menu set.

How to access Map Canvas Options Video

 

 Map Controls – Hides Google Maps Buttons (Map Canvas 1 off / Map Canvas 2 on)

 Synchronize Maps – Maps are independent in movement North, South, East West (Zoom is still synced until turned off)

 

 Synchronize Zoom – Map canvas zoom is independent for users to look at the same place a different scales

 

 Boundary Layer – Turns off administrative boundaries (Map Canvas 1 off / Map Canvas 2 on)

 

 Labels/Icons – Turns off all labels and icons (Two images at different scale showing use cases)

 

 

Map Canvas 1 – Boundary Off | Map Canvas 2 – Labels/Icons Off

Map Canvas 1 – Labels/Icons Off | Map Canvas 2 – Labels/Icons On

 Road Layer – Toggles On/Off roads Layer (Map Canvas 1 off / Map Canvas 2 on)

 

 Legend – Toggles Legend when map is chosen (Important for smaller screens)

 

 Drawing Tools – Hides drawing tools located on the bottom right of each canvas (Often used in conjunction with Map Controls to hide all maps tool except “Search”)

 

Use the “Refresh Icon” to the right of “Drawing Tools” to clear all points, lines, and polygons

 Elevation Tools – Turn on “Elevation Tools” and click two points on map to get elevation chart

 

RIP-Earth-API-Plugin

On Wednesday, January 11, 2017 Google is finally shutting down the Google Earth API. (please note – This is the web version of Google Earth; Google Earth on a PC will still work) The shutdown is over two years in the making (Google’s 2014 Deprecation Announcement). Geteach.com’s first several versions where based off this API. (History of geteach.com here) As stated many times before, Google Maps API has been a net gain for geteach.com; mainly because Google has engineers working on the service. However, there are a couple of features I will miss from the Earth API.

geteach.com Video Tutorial (Last Google Earth API version) – Published January 14, 2014

What I will first miss most with the plugin is historic imagery. This is where geteach.com could show the same place at two different times. This was great for looking at natural disasters. (See Videos Below)

Moore, OK Tornado – Published June 11, 2013

Historical Imagery-Warsaw – Published August 4, 2012

Second, and similar to the first, most missed feature will be the historic time slider that allowed students and I to create interesting change over time kml files. (See Videos Below)

Comparing Volcanic Ash with Air Traffic – Published March 31, 2013

Hurricane Sandy with Population Density – Published January 8, 2017

There were other ways I used to time slider. For example, the video below shows sea level rise. Every decade equals +/- 10 meters. (See Videos Below)

Sea level rise with Earth at Night – Published January 8, 2017

However, what I will miss the most about the plugin was in its ability to load and share .kml files. Part of the reason why I created geteach.com was to have a platform where I could have a base set of .kml files showing physical and human spatial characteristics. (see previous blog post) A lesser known feature to geteach.com is that students can import their own .kml files and compare their student created maps with each others or one of the base sets of maps.

Climate Regions Layer with student’s quick draw ecosystem layer

This feature is still available in the new “Google Maps” version of geteach.com. However, the Google Earth plugin did a much better job rendering .kml files created in the Google Earth client. This is especially true with image overlays and other raster files; something not easily done with the Maps API and nearly impossible to teach younger students. I am sadden to shut down my first website. Hopefully Google has something up its sleeve for 2017.

#12MapComparisonsOfChristmas

In last week’s post “geteach.com-layers” readers learned how to select and load hundreds of maps curated for geteach.com. Since that post, and in the spirit of the holidays, I have been posting my own Twelve Map Comparisons of Christmas. (#12MapComparisonsOfChristmas) Below is the list and media for these 12 out of thousands of spatial comparisons that can be made with geteach.com.

1. 1492 – Behaim with 2016 Google Maps

2. Connectivity with Human Development Index

3. Seafloor Age with Tsunami events since 2000 B.C.

4. Sea Surface Salinity with Sea Surface Density

5. Lowest with Highest points on Earth’s land (not exact, but close enough)

6. Sea Surface Temperatures January with July (Check out Caspian Sea)

7. Precipitable Water January with August (Check out the monsoons of South Asia)

8. Seasonal Change: Blue Marble with Land Temperature


9. Oil Exports with Petroleum Consumption

10. Cropland Density with Pastureland Density

11. Labor Percent Agriculture with Gross Domestic Product (per capita)

12. Population Density and Earth at Night

Bonus Holiday (Easter) Eggs

geteach.com – layers

In a previous post I wrote about a project that got away from me… the creation of geteach.com. In this post I inferred that I wanted a Google Earth layer package where my students could easily explore and create understandings/connections between physical and human systems. Over the past several months, at many professional development events, I have heard teachers tell me it would be cool if Google Maps/Earth had a layer that visualized this or that spatial distribution. While geteach.com does not have every layer these professionals requested, it does have a foundational set of maps/layers that are easily comparable for k-12 students. These map layers were chosen because thy are either in my own curriculum or discussed often in k – 12 classrooms. There are over 140 maps/layers across 21 categories in geteach.com and I have spent countless hours trying to find a menu system and organization that makes it easier for teachers and students to find what they are looking for. Unfortunately, I feel this is one of the weaknesses of geteach.com. In order to maximize the visual space of two maps, selecting map data sets takes 3 to 5 clicks. Most of this is due to my limited knowledge in design and JavaScript, but hey…I am a high school teacher and not a professional web designer. At any rate, below is a how to select maps and layers in geteach.com along with a list and short (5 – 30 second) video of each map data set. So, in less than 10 minutes you can discover what free data is already out in geteach.com’s cosmos.

**Caution…potential rabbit hole of spatial distributions and comparisons below**

How to select maps and get map information in geteach.com (3 minute video)


Physical Geography Layers

Blue Marble: No clouds/ice, January – December

Physical Maps: Natural Earth, NOAA Physical Map, NOAA DEM, Topographic NASA, World Topo-Bathy

Plate Tectonics: Seafloor Age, NOAA DEM, Tsunami Events from 2000BC, World Topo-Bathy, Volcanoes

Climate: Climate Regions, NOAA DEM, Wind Currents, Ocean Currents, El Nino Sea Temperature Anomaly, La Nina Temperature Anomaly, Summer Impacts El Nino, Winter Impacts El Nino, Summer Impacts La Nina, Winter Impacts La Nina

Precipitable Water: January – December

Land Temperature: January – December

Sea Surface Temperature: January – December

Land Cover: Land Cover

Vegetation Index: January – December

Carbon Dioxide: January – December

Oceans: Average Sea Surface Temp., Sea Surface Salinity, Sea Surface Density, Ocean Currents

Forest Change: Forest Extent, Forest Loss, Forest Gain, Forest Gain/Loss


Human Geography Layers

CIA Factbook (January 2016): CIA Factbook – Quick reference of many indicators

Historic Maps: 1492 – Behaim , 1544 – Agnese, 1570 – Ortelius, 1589 – Jode, 1595 – Hondius, 1630 – Hondius, 1670 – de Wit, 1691 – Sanson, 1720 – de l’Isle, 1744 – Bowen, 1786 – Faden, 1794 – Dunn

Geography-Land: Area, Arable Land, Cropland, Pastureland, Food vs. Feed

Demographics: Total Population, Growth Rate, Total Fertility Rate, Birth Rate, Death Rate, Net Migration, Infant Mortality Rate, Life Expectancy, % Urban, Total Literacy, Predominant Religion by country

Economy: GDP (Per Capita), % Agricultural Labor, Exports, Imports, Oil Exports, Oil Imports, Petroleum Consumption

Earth at Night: Earth at Night 2002, Earth at Night 2012

Anthropocene (Hold “Ctrl” + click to select two layers): Anthropocene (ALL), City Lights Base Maps, Air Traffic, Shipping Traffic, Roads, Transmission lines

Human Development: 2013 HDI, 2000 HDI, 1990 HDI, 1980 HDI

thanksgiving-fun-with-kml

“I borrowed this code from NASA.” That comment received quite a laugh during one of my presentations. The comment was intended to be an acknowledgment that I did not create this code along with crediting the agency that did. Judging from the reaction, that is not how the line hit. At any rate, the irony of the statement is in how simple the code truly is. To me, coding fits well within the definition of geography I was taught…, “observe and analyze anything distributed across Earth’s space.” Learning to read and write KML is observing and analyzing spatial distributions. Granted the distribution is pixels on a screen and not Earth’s space, but the mental task is the same. Therefore, spatial reasoning, Google Earth, and NASA were part of the initial stepping stones in the creation of geteach.com.

imageoverlay

Keyhole Markup language (KML) is an open standard language used to display geographic data. KML is what Google Earth reads to show raster files (collocations of pixel that create an image…common form jpeg, png files. These images are often not geo-referenced with latitude and longitude coordinates) and vector files (points , lines, polygons, and multigeometry that are often geo-referenced). KML is a variant of XML (Extensible Markup Language) that includes geo-spatial language. Sorry for the jargon. that entire paragraph is just a fancy way of saying that kml is based off of a ubiquitous language that is easy to read and write.

The easiest way to write KML is through Google Earth. Whenever you add a placemark, line, polygon, or overlay Google Earth is writing code. However, sometimes you might want more precise control over these points, lines, polygons, and images. This is when you might want to edit your KML via any text editor. As a Windows user, I prefer Notepad++. Mac users can use TextWrangler, but I believe the company is moving users to BBEdit. If you are looking to collaborate on kml in the cloud you can use Google Drive and XML Editey. I taught my 8 year old html and css via Editey.

While KMLs can get extremely complicated, the aforementioned NASA code is about as simple as it gets. NASA Earth Observations is a great site to get environmental data about Earth. If you have visited geteach.com you will notice many of the datasets I use comes from NASA Earth Observations because it is free (make sure to pay your taxes) and open to use. Clicking around in NASA Earth Observations you will find out you can download Google Earth (KML) files of these datasets. Initially, these Google Earth files download as KMZ files. KMZ is a .zip version of a KML. Opening a .kmz in Google Earth and then saving the file as a .kml is equivalent to unzipping a .zip file. Basically, what the user downloads from NASA Earth Observations is a 3600 x 1800 image and a .kml file that wraps the image around the Earth. Fortunately for users, NASA uses the same map projection (WGS84) as Google Earth and Google Maps. Otherwise the locations of the image would not align with Google Earth.

Enough geo-spatial technology talk…it is time to impress your family and friends for 5 minutes after Thanksgiving dinner.
marioearth
Step 1: Take a family picture (If you are using a phone make sure you are shooting in landscape not portrait)
Step 2: Upload image to Google Drive and share “Anyone with a link can view” (This is going to complicate the code, but I prefer hosting images online)
Step 3: Code KML
Step 4: Save

Below is the breakdown of the code. Each snippet is highlighted followed by a brief description of how the code is being read. Feel free to copy/paste this kml code into your text editor of choice

<?xml version="1.0" encoding="UTF-8"?>
<kml xmlns="http://www.opengis.net/kml/2.2" xmlns:gx="http://www.google.com/kml/ext/2.2" xmlns:kml="http://www.opengis.net/kml/2.2" xmlns:atom="http://www.w3.org/2005/Atom">
	<Document>
		<name>Learning to Use 3D Printer</name>
		<LookAt>
			<longitude>0</longitude>
			<latitude>0</latitude>
			<altitude>0</altitude>
			<heading>0</heading>
			<tilt>0</tilt>
			<range>20770075.42761702</range>
		</LookAt>
		<GroundOverlay>
			<name>Learning to Use 3D Printer</name>
			<Icon>
				<href>https://drive.google.com/uc?view&amp;id=0B1eALoRda8FTdDlfTnVRSWpSclU</href>
			</Icon>
			<LatLonBox>
				<north>90</north>
				<south>-90</south>
				<east>180</east>
				<west>-180</west>
			</LatLonBox>
		</GroundOverlay>
	</Document>
</kml>

Line 1 tells Google Earth that this is an xml file with UTF-8 characters. This is similar to telling your browser which html version to use in reading the file.

<?xml version="1.0" encoding="UTF-8"?>
<kml xmlns="http://www.opengis.net/kml/2.2" xmlns:gx="http://www.google.com/kml/ext/2.2" xmlns:kml="http://www.opengis.net/kml/2.2" xmlns:atom="http://www.w3.org/2005/Atom">
	<Document>
		<name>Learning to Use 3D Printer</name>
		<LookAt>
			<longitude>0</longitude>
			<latitude>0</latitude>
			<altitude>0</altitude>
			<heading>0</heading>
			<tilt>0</tilt>
			<range>20770075.42761702</range>
		</LookAt>
		<GroundOverlay>
			<name>Learning to Use 3D Printer</name>
			<Icon>
				<href>https://drive.google.com/uc?view&amp;id=0B1eALoRda8FTdDlfTnVRSWpSclU</href>
			</Icon>
			<LatLonBox>
				<north>90</north>
				<south>-90</south>
				<east>180</east>
				<west>-180</west>
			</LatLonBox>
		</GroundOverlay>
	</Document>
</kml>

The highlights show an open (line 2) and closed (line 26) tag. Every open tag, with the exception of line 1, has to have a close tag. Notice the indented spacing of the file. Code is written like a Russian nested doll. Google Earth reads this as all tags between lines 2 and 26 will use the kml 2.2 standard.

<?xml version="1.0" encoding="UTF-8"?>
<kml xmlns="http://www.opengis.net/kml/2.2" xmlns:gx="http://www.google.com/kml/ext/2.2" xmlns:kml="http://www.opengis.net/kml/2.2" xmlns:atom="http://www.w3.org/2005/Atom">
	<Document>
		<name>Learning to Use 3D Printer</name>
		<LookAt>
			<longitude>0</longitude>
			<latitude>0</latitude>
			<altitude>0</altitude>
			<heading>0</heading>
			<tilt>0</tilt>
			<range>20770075.42761702</range>
		</LookAt>
		<GroundOverlay>
			<name>Learning to Use 3D Printer</name>
			<Icon>
				<href>https://drive.google.com/uc?view&amp;id=0B1eALoRda8FTdDlfTnVRSWpSclU</href>
			</Icon>
			<LatLonBox>
				<north>90</north>
				<south>-90</south>
				<east>180</east>
				<west>-180</west>
			</LatLonBox>
		</GroundOverlay>
	</Document>
</kml>

Lines 3 and 25 are the start and end of the visualization instructions…The container of the document.

<?xml version="1.0" encoding="UTF-8"?>
<kml xmlns="http://www.opengis.net/kml/2.2" xmlns:gx="http://www.google.com/kml/ext/2.2" xmlns:kml="http://www.opengis.net/kml/2.2" xmlns:atom="http://www.w3.org/2005/Atom">
	<Document>
		<name>Learning to Use 3D Printer</name>
		<LookAt>
			<longitude>0</longitude>
			<latitude>0</latitude>
			<altitude>0</altitude>
			<heading>0</heading>
			<tilt>0</tilt>
			<range>20770075.42761702</range>
		</LookAt>
		<GroundOverlay>
			<name>Learning to Use 3D Printer</name>
			<Icon>
				<href>https://drive.google.com/uc?view&amp;id=0B1eALoRda8FTdDlfTnVRSWpSclU</href>
			</Icon>
			<LatLonBox>
				<north>90</north>
				<south>-90</south>
				<east>180</east>
				<west>-180</west>
			</LatLonBox>
		</GroundOverlay>
	</Document>
</kml>

Line 4 is the name of the Google Earth file.

<?xml version="1.0" encoding="UTF-8"?>
<kml xmlns="http://www.opengis.net/kml/2.2" xmlns:gx="http://www.google.com/kml/ext/2.2" xmlns:kml="http://www.opengis.net/kml/2.2" xmlns:atom="http://www.w3.org/2005/Atom">
	<Document>
		<name>Learning to Use 3D Printer</name>
		<LookAt>
			<longitude>0</longitude>
			<latitude>0</latitude>
			<altitude>0</altitude>
			<heading>0</heading>
			<tilt>0</tilt>
			<range>20770075.42761702</range>
		</LookAt>
		<GroundOverlay>
			<name>Learning to Use 3D Printer</name>
			<Icon>
				<href>https://drive.google.com/uc?view&amp;id=0B1eALoRda8FTdDlfTnVRSWpSclU</href>
			</Icon>
			<LatLonBox>
				<north>90</north>
				<south>-90</south>
				<east>180</east>
				<west>-180</west>
			</LatLonBox>
		</GroundOverlay>
	</Document>
</kml>

Lines 5 through 12 are where the camera (Point of view) is pointed. Camera is pointed at 0° Longitude, 0° Latitude, 0 altitude (looks at the ground and not above ground), heading and tilt are are set to 0 (look straight down to the ground), and a range of 20770075.42761702 (camera’s distance from the ground)

<?xml version="1.0" encoding="UTF-8"?>
<kml xmlns="http://www.opengis.net/kml/2.2" xmlns:gx="http://www.google.com/kml/ext/2.2" xmlns:kml="http://www.opengis.net/kml/2.2" xmlns:atom="http://www.w3.org/2005/Atom">
	<Document>
		<name>Learning to Use 3D Printer</name>
		<LookAt>
			<longitude>0</longitude>
			<latitude>0</latitude>
			<altitude>0</altitude>
			<heading>0</heading>
			<tilt>0</tilt>
			<range>20770075.42761702</range>
		</LookAt>
		<GroundOverlay>
			<name>Learning to Use 3D Printer</name>
			<Icon>
				<href>https://drive.google.com/uc?view&amp;id=0B1eALoRda8FTdDlfTnVRSWpSclU</href>
			</Icon>
			<LatLonBox>
				<north>90</north>
				<south>-90</south>
				<east>180</east>
				<west>-180</west>
			</LatLonBox>
		</GroundOverlay>
	</Document>
</kml>

Between lines 13 and 24 <GroundOverlay> are the instructions on loading and positioning the image

<?xml version="1.0" encoding="UTF-8"?>
<kml xmlns="http://www.opengis.net/kml/2.2" xmlns:gx="http://www.google.com/kml/ext/2.2" xmlns:kml="http://www.opengis.net/kml/2.2" xmlns:atom="http://www.w3.org/2005/Atom">
	<Document>
		<name>Learning to Use 3D Printer</name>
		<LookAt>
			<longitude>0</longitude>
			<latitude>0</latitude>
			<altitude>0</altitude>
			<heading>0</heading>
			<tilt>0</tilt>
			<range>20770075.42761702</range>
		</LookAt>
		<GroundOverlay>
			<name>Learning to Use 3D Printer</name>
			<Icon>
				<href>https://drive.google.com/uc?view&amp;id=0B1eALoRda8FTdDlfTnVRSWpSclU</href>
			</Icon>
			<LatLonBox>
				<north>90</north>
				<south>-90</south>
				<east>180</east>
				<west>-180</west>
			</LatLonBox>
		</GroundOverlay>
	</Document>
</kml>

Line 14: The name of the image layer

<?xml version="1.0" encoding="UTF-8"?>
<kml xmlns="http://www.opengis.net/kml/2.2" xmlns:gx="http://www.google.com/kml/ext/2.2" xmlns:kml="http://www.opengis.net/kml/2.2" xmlns:atom="http://www.w3.org/2005/Atom">
	<Document>
		<name>Learning to Use 3D Printer</name>
		<LookAt>
			<longitude>0</longitude>
			<latitude>0</latitude>
			<altitude>0</altitude>
			<heading>0</heading>
			<tilt>0</tilt>
			<range>20770075.42761702</range>
		</LookAt>
		<GroundOverlay>
			<name>Learning to Use 3D Printer</name>
			<Icon>
				<href>https://drive.google.com/uc?view&amp;id=0B1eALoRda8FTdDlfTnVRSWpSclU</href>
			</Icon>
			<LatLonBox>
				<north>90</north>
				<south>-90</south>
				<east>180</east>
				<west>-180</west>
			</LatLonBox>
		</GroundOverlay>
	</Document>
</kml>

Between lines 15 and 17 <Icon> is the url for the image that you want to wrap around the Earth. <href> translates to file path or in this case…url. Replacing the url between the <href> tag with you own image and save will change your Earth. You can use a local file and save as a kmz later. Again, I am using the direct download link from Google Drive. This is different then the shared link. Explanation to how to get this link will follow.

<?xml version="1.0" encoding="UTF-8"?>
<kml xmlns="http://www.opengis.net/kml/2.2" xmlns:gx="http://www.google.com/kml/ext/2.2" xmlns:kml="http://www.opengis.net/kml/2.2" xmlns:atom="http://www.w3.org/2005/Atom">
	<Document>
		<name>Learning to Use 3D Printer</name>
		<LookAt>
			<longitude>0</longitude>
			<latitude>0</latitude>
			<altitude>0</altitude>
			<heading>0</heading>
			<tilt>0</tilt>
			<range>20770075.42761702</range>
		</LookAt>
		<GroundOverlay>
			<name>Learning to Use 3D Printer</name>
			<Icon>
				<href>https://drive.google.com/uc?view&amp;id=0B1eALoRda8FTdDlfTnVRSWpSclU</href>
			</Icon>
			<LatLonBox>
				<north>90</north>
				<south>-90</south>
				<east>180</east>
				<west>-180</west>
			</LatLonBox>
		</GroundOverlay>
	</Document>
</kml>

<LatLonBox> positions the image. The top of the image will be positioned at 90° north, the bottom 90° south, right side will be 180° east and left side will be positioned -180° west.

Again, if you would like to create your own picture Earth copy and paste the code below into your text editor and replace the name of the Google Earth file (line 4), the name of the images layer (line 14), and the url between <href> tags with your own image (line 16). If your image and kml are in the same folder on your PC you can just enter the file name (ex.image.jpg). Make sure to save as a kml in your text editor then open the file in Google Earth then save as a .kmz file before sharing. This will pack/zip the image and kml together. Uncheck all the layers in the lower left frame in Google Earth to turn off boundaries etc.

<?xml version="1.0" encoding="UTF-8"?>
<kml xmlns="http://www.opengis.net/kml/2.2" xmlns:gx="http://www.google.com/kml/ext/2.2" xmlns:kml="http://www.opengis.net/kml/2.2" xmlns:atom="http://www.w3.org/2005/Atom">
	<Document>
		<name>Learning to Use 3D Printer</name>
		<LookAt>
			<longitude>0</longitude>
			<latitude>0</latitude>
			<altitude>0</altitude>
			<heading>0</heading>
			<tilt>0</tilt>
			<range>20770075.42761702</range>
		</LookAt>
		<GroundOverlay>
			<name>Learning to Use 3D Printer</name>
			<Icon>
				<href>https://drive.google.com/uc?view&amp;id=0B1eALoRda8FTdDlfTnVRSWpSclU</href>
			</Icon>
			<LatLonBox>
				<north>90</north>
				<south>-90</south>
				<east>180</east>
				<west>-180</west>
			</LatLonBox>
		</GroundOverlay>
	</Document>
</kml>

How to use Google Drive to host your Google Earth images.
I am not sure how long this will work. Google has a habit of changing/discontinuing these things, but for now you can get a direct link to your uploaded files by modifying the shared url. All you do is take the Google Drive’s file ID and add it to this url: https://drive.google.com/uc?view&id=

Example:
Google Drive’s shared url: https://drive.google.com/open?id=0B1eALoRda8FTYnBGa1NfY1ZQa1E and/or https://drive.google.com/file/d/0B1eALoRda8FTYnBGa1NfY1ZQa1E/view?usp=sharing (this depends on which shared url you prefer to use)
Direct link: https://drive.google.com/uc?view&id=0B1eALoRda8FTYnBGa1NfY1ZQa1E

**Important** Because Google Earth uses xml, the “&” sign after “view” needs to be replaced by xml equivalent “&amp;”
Therefore the direct image link when coding kml via text editor is:https://drive.google.com/uc?view&amp;id=0B1eALoRda8FTYnBGa1NfY1ZQa1E (same url as above direct link replacing the “&” with “&amp;”)

Feel free to use this url converter created for my students if you have a number of images to convert (You will still have to manually replace “&” with “&amp;”)
http://geteach.com/staticstreet
Google Chrome Extension here: Link

ROYALTY FREE MUSIC by BENSOUND