Space Station tracker with embedded live video from outer space

Below is Google Map that tracks the current path and location of the International Space Station (ISS) with an inset showing live video feed from outer space.

How do you embed a video inset in a Google Map? It is really quite easy. The method involves identifying the video iframe with an 'id' tag and then creating a 'div' element for the iframe within the map. Needless to say, you need to know a little about JavaScript and Google Maps to do this.

Latitude

Longitude

Altitude (km)

Velocity (km/h)

This map combines an International Space Station (ISS) tracker with a live video feed from the space station.

Below is the iframe code for this example. You can place this above or below the map canvas (<div id="map"></div>). Note how the iframe is identified by the id="video" tag.

<iframe id="video" src="https://www.ustream.tv/embed/9408562?html5ui=1&volume=0" style="margin:10px; border:0" width="240" height="135"></iframe>

And here is the code that you need to insert within the map JavaScript. Put it just before the closing bracket (...}) of the map initialization function (look for this string: {function init...). Note how it incorporates the id of the video iframe. Note also how the position of the inset within the map is specified.

var videoDiv = document.getElementById('video'); map.controls[google.maps.ControlPosition.LEFT_TOP].push(videoDiv);