map Virtual Earth

Component identification parameters

Name | Value
--- | ---
component-type | org.richfaces.VirtualEarth
component-class | org.richfaces.component.html.HtmlVirtualEarth
component-family | org.richfaces.VirtualEarth
renderer-type | org.richfaces.VirtualEarthRenderer
tag-class | org.richfaces.taglib.VirtualEarthTag

## Creating the Component with a Page Tag

Here is a simple example as it could be used on a page:

Example:

    ...
        <rich:virtualEarth lat="..." lng="..."/>
    ...

## Creating the Component Dynamically Using Java

Example:

    import org.richfaces.component.html.HtmlVirtualEarth;
    ...
    HtmlVirtualEarth myMap = new HtmlVirtualEarth();
    ...

## Details of Usage

Here are the main settings of initial rendering performed with a component map that are accessible with the following attributes:

- "zoom" defines an approximation size (boundary values 1-18)
- "lat" specifies an initial latitude coordinate in degrees, as a number between -90 and +90
- "lng" specifies an initial longitude coordinate in degrees, as a number between -180 and +180
- "dashboardSize" specifies a type of a rendered map (Normal, Small, Tiny)

For example, the city of Paris is shown after rendering with the following initial settings: "lat" = 48.833, "lng" = 2.40 and "zoom" = 11.

virtualEarth initial rendering

Code for this example is placed below:

Example:

    ...
        <rich:virtualEarth  style="width:800px;" id="vm" lat="48.833" lng="2.40"
                                         dashboardSize="Normal"  zoom="11" mapStyle="Hybrid" var="map" />
    ...

To set all these parameters and perform some activity (Zoom In/Out etc.) is possible with your JavaScript, i.e. declare a name of an object on a map in the "var" attribute and then call the object directly with API Microsoft Virtual Earth map.

For example, to approximate a map for "var" = "map" declared inside the component, call map.ZoomIn() on an event.

Moreover, to add e.g. some JavaScript effects, events defined on it are used.

- onmouseover
- onclick
- onmouseout
- etc.

## Look-and-Feel Customization

<rich:virtualEarth> component isn't tied to skin parameters, as there is no additional elements on it, except the ones provided with Virtual Earth map.

## Definition of Custom Style Classes

Classes names that define a component appearance

Class name | Description
--- | ---
rich-virtualEarth | Defines styles for a wrapper <div> element of a component

In order to redefine styles for all <rich:virtualEarth> components on a page using CSS, it's enough to create class with the same name and define necessary properties in it.

To change styles of particular <rich:virtualEarth> components, define your own style class in the corresponding <rich:virtualEarth> attribute.

## Relevant Resources Links

Here you can found additional information about Microsoft Virtual Earth map.