3D Spinning interactive globe

Amazing realtime 3D globe – utilizing Papervision

Update – 10 dec 09

• Fixed scrollwheel functionality bug in Firefox and on Macs
• Now you can define the globetexture from the xmlfile
• Now you can define the markersize from the xmlfile
• Now you can define the globes initial zoom on startup from the xmlfile

Here’s a snippet from the xmlfile, controlling the globes content and settings

<?xml version="1.0" encoding="UTF-8"?>
<items>

<!-- initialZoom controls the globes initial size 1=unchanged 2=double 0.5=half -->
<!-- globemap determines with texture the globe should have, images with a 2:1 ratio (ex. 800x400) gives best results -->
<!-- markersize determines the size of the markers / hotspots on the map -->
<conf 
    initialZoom ="1" globemap="terra_equi.jpg" markerSize="20" 
/>

    <location lat="9.7957" long="22.5000">
        <content><![CDATA[<H1>AFRICA</H1><img src='thumbs/globepic.jpg' align='right' height='116' width='120' hspace='10px' vspace='0px'/>
            <p class="intro">These menus can be cssstyled using css version 1. Lorem ipsum dolor sit at diam mauriscursus imperdiet. Morbi vitae sem Lorem ipsum dolor sit at diam mauriscursus imperdiet. Morbi vitae sem Lorem ipsum dolor sit at diam mauriscursus imperdiet. Morbi vitae sem</p>

            <p>Lorem ipsum dolor sit at diam mauriscursus imperdiet. Morbi vitae sem.Lorem ipsum dolor sit at diam mauriscursus imperdiet. Morbi vitae sem.Lorem ipsum dolor sit at diam mauriscursus imperdiet. Morbi vitae sem.Lorem ipsum dolor sit at diam mauriscursus imperdiet. Morbi vitae sem.Lorem ipsum dolor sit at diam mauriscursus imperdiet. Morbi vitae sem.</p>

            <p>Lorem ipsum dolor sit at diam mauriscursus imperdiet. Morbi vitae sem.Lorem ipsum dolor sit at diam mauriscursus imperdiet. Morbi vitae sem.Lorem ipsum dolor sit at diam mauriscursus imperdiet. Morbi vitae sem.Lorem ipsum dolor sit at diam mauriscursus imperdiet. Morbi vitae sem.Lorem ipsum dolor sit at diam mauriscursus imperdiet. Morbi vitae sem.</p>

            <li><a href="http://www.demo.com" target="_blank">Dinamic factory</a> Sed quis diam.</li>
            <li><a href="http://www.demo.com" target="_blank">demo</a> dolor sit amet.</li>
            <li><a href="http://www.demo.com" target="_blank">demo</a> Sed quis diam.</li>
        ]]>
        </content>
    </location>

3D globe – general description

Great for displaying different points on the earth, f.ex. traveldestinations, ipaddress-locations global addresslist etc. with descriptions, pictures and links.

The 3D rendering is handled with papervision, the points of interest is dynamically loaded with a very simple XMLfile. Everything you need to create a new point of interest on the globe is the lat-long position of the point and a describing text. The text can be htmltagged and CSS styled. You can zoom the globe in and out using the scrollwheel.

• 3D globe with dynamic points of interest containing HTML and CSS styled menus.
• The globe can be hooked up with any cms that outputs XML , or the XML can be edited by hand.
• The globes dragbehaviour is controlled with variables, so its easily changed.
• All animation is done with caurina.tweener – theres no timelined motiontween.
• Everything is customizeable.
• All actionscript is AS3 and located in a seperate .AS classfile (documentClass).
• You dont even need flash to modify / add points of interest.