Concepts

Web World Wind is a virtual globe component that you embed in web pages. It provides an interactive, 3D geographic context for information. As a component, it comprises one aspect of a web application or web page. Other components provide textual or graphic information or provide a user interface. In the following  figure, Web World Wind is just the portion outlined in red. The rest of the components on the web page — the menus, the buttons, the text — are HTML developed by the web page creator.

Layout

The Web World Wind component is called a World Window. The web page may contain more than one World Window. Each operates independently of the others. The World Window is the primary object the application interacts with.

The World Window

The following figure illustrates Web World Wind’s overall architecture. Objects in red are objects the app typically interacts with, in addition to the World Window. Items in cyan represent objects that work behind the scenes to retrieve data from the internet and create what the user sees.

Architecture

The World Window object encapsulates the Web World Wind functionality around an HTML canvas. The canvas is created by the app, typically within a <div> element in an HTML page. It’s ID is passed to World Wind during construction of a WorldWindow object. An app (web page) may contain more than one WorldWindow object, each for a different canvas.

In addition to acting as a container for the Globe and other objects, the World Window provides picking and scene control. See the World Window chapter of this developer’s guide for more information about it. Also see the World Window API documentation for its interface details.

Layers

Aside from the World Window, the most fundamental objects in Web World Wind are layers. Layers contain all the information displayed in the World Window. All imagery, shapes and decorations such as the compass are defined in layers.

Each World Window contains one Layer List, which holds all the layers displayed in that World Window. When the World Window draws the scene, it traverses its layer list in order and draws the imagery and other content listed there.

Typically a layer list includes imagery layers followed by shape layers followed by decoration layers. The World Window’s layer list is empty by default. The first thing a Web World Wind application must do is add layers to the layer list. You can see this in all the Web World Wind examples. Here’s an example of adding initial imagery layers along with a compass, a coordinates display and view controls:

// Create the World Window.
var wwd = new WorldWind.WorldWindow("canvasOne");

// Create and add imagery layers.
wwd.addLayer(new WorldWind.BMNGLayer());
wwd.addLayer(new WorldWind.BingAerialWithLabelsLayer(null));

// Create and add decoration layers.
wwd.addLayer(new WorldWind.CompassLayer());
wwd.addLayer(new WorldWind.CoordinatesDisplayLayer(wwd));
wwd.addLayer(new WorldWind.ViewControlsLayer(wwd));

See the Layers section of this developer’s guide for lots more information about layers.

Shapes

Shapes represent information that you want to display on or relative to the globe. They can be simple placemarks, complex volumes or shapes draped on the terrain. All shapes are contained in layers and the layers contained in a World Window’s layer list. Web World Wind provides many different kinds of shapes. See the Shapes section of this developer’s guide for a listing and complete description of Web World Wind’s shapes.

Globe

The Globe is responsible for representing the WGS84 ellipsoid and its terrain. It also handles implementation of the various 2D projections that can be utilized instead of the 3D globe. Aside from selecting these projections, the application does not typically interact with the globe. The exception is when the application desires to know terrain elevations, such as when performing line-of-sight calculations, or when it needs to convert between geographic and Cartesian coordinates. See the API documentation for Globe and Globe2D to learn more about the Globe object.

Each World Window has one Globe, created automatically when the World Window is created. The application may replace this globe with another. Most Web World Wind examples replace the globe with a 2D, flat globe when the user selects a 2D projection.

Navigator

The Navigator is responsible for converting user actions to manipulations of the globe. It monitors mouse events and user gestures and translates them to pan, zoom or tilt operations on the globe. The Navigator can also be driven by the application to move the view to a particular location or to set its tilt and heading.

Each World Window has its own Navigator, which is created automatically when the World Window is created. The application may subsequently replace this Navigator, perhaps with one the app developer created to operate differently or in response to different gestures.

Other Objects

The above objects — World Window, Layers, Shapes, Globe, Navigator — are the objects that applications typically interact with. Web World Wind contains many other objects, most of which operate behind the scenes without any direction needed from the application. This includes those objects that automatically retrieve data such as imagery and elevations from the internet. Applications may interact with these objects to achieve non-default behavior, but doing so is not necessary.

Extensibility

Web World Wind is designed to be readily extensible. Developers should feel free to customize Web World Wind objects to achieve effects that Web World Wind does not already provide. Applications often extend and customize shapes, for example, or create completely new ones.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s