Interactive Earth Globe 3D

Interactive Earth Globe 3D

Interactive Earth 3D allows to rotate a globe and call actions after clicking on the defined hotspots. This animated globe uses the HTML5 feature called WebGL. No plug-ins (e.g. Flash) are required.
You can add your own hotspots, connect and customize them:

  • position (longitude and latitude)
  • color
  • title
  • action

These actions are available:

  • open an image in the build-in lightbox
  • show a text or html content in the build-in lightbox
  • open a hyperlink
  • call a JavaScript callback
  • call your own JavaScript code

Following parameters are editable too:

  • earth radius
  • rotation speed
  • sun intensity
  • path to the directory with texture

How does it work?
Just adda a <div> element to your html code:

 <div id="globe"> ... </div>

Create a <div> element within it to add a hotspot:

 <div class="poi" latitude="51.179" longitude="-1.826" label="Stonehenge"> </div> 

COMPATIBILITY:
Does your browser support the WebGL functionality? You can find out here:
http://en.wikipedia.org/wiki/WebGL
http://doesmybrowsersupportwebgl.com This item was tested and works in:
Chrome (version 38) on Windows & OSX
IE (version 11) on Windows
Firefox (version 33) on Windows & OSX
Opera (version 25) on Windows & OSX
Safari (version 7.0.6) OSX&ast;
&ast;after activation WebGL in Safari settings
CREDITS:
This component uses jQuery and Three.js:
http://jquery.com
http://threejs.org

More items by flash_fx

Interactive Earth Globe 3D