Home    Back    Document


Introducing Animated Maps

Introducing Animated Maps

Logi Info
v10.0.101 - 7 Jun 2010

Logi Info includes Animated Maps, which are animated, interactive, data-driven, Flash-based maps, for your Logi applications. Data range coloring makes it easy to relate data within specified thresholds to map regions. Topics in this document include:


About Animated Maps

Logi Info's Animated Maps are animated, interactive, data-driven, Flash-based maps for Logi applications. Developers can use them to display geographical data distributed by category, regions, or entities. The best usage examples include statistical display of data, flight routes, office locations, election results, survey results, or business intelligence such as "Revenue by Regions" or "Revenue by States". They do not work with zip codes or geocoded (latitude- & longitude-based) data.

Like all Logi data visualizations, map portions can be interactive links that can be clicked in order to "drill-down" to other reports, charts, and URLs.

These maps are based on Adobe's Flash technology and require that the free Flash Player browser-extension be installed in order for them to be viewed by consumers. Maps for 186 countries and regions are included with Logi Info; see the list of available maps below.

In almost all of these maps, their subdivisions (regions, provinces, states, etc.) are referenced by a internal numeric ID. In order to relate these ID numbers to "real world" names more likely to be encountered in your data, such as "Montana" or "Belgium", each map has a companion XML data file that can be used to cross-reference a region name to the internal ID. This is discussed in detail later in the Referencing Data section.

  Back to the top

 

The Animated Map Element

Animated Maps are included in Logi Info applications by adding the Animated Map element to a report definition.
 

In the example above, an Animated Map element has been added and its attributes set as shown.
 

The resulting map is shown above. When the cursor passes over a state, its color changes and a "tooltip" appears with the full state name. The attributes for the Animated Map element are explained below. Unless otherwise noted, attribute values are optional.

Attribute

Description

Height

(Required) The height of the map, in pixels.

Map Type

(Required) The type of base map to be rendered; e.g. World, USA, China, USARegion etc. A complete list is provided at the end of this document.

Specific map type values can be found by examining the .swf files in the application folder's rdTemplate\rdFusionMap folder. The Arizona map, for example, is called FCMap_Arizona.swf and the file name portion "Arizona" is entered in this attribute.

Regional Name Column

(Required) The name of a column in the datalayer, with data representing the name for each region to be mapped. If a datalayer is not being used, enter an arbitrary placeholder value.

Regional Value Column

(Required) The name of a column in the datalayer, with data representing the value for each region to be mapped. If a datalayer is not being used, enter an arbitrary placeholder value.

Width

(Required) The width of the map, in pixels.

Background Color

The color of the map background; can be either a color name, a decimal RGB value, or a hex RGB value prefixed with a pound sign (#112233). "Transparent" is a valid value.

Border Color

The color of the map border lines, can be either a color name, a decimal RGB value, or a hex RGB value prefixed with a pound sign (#112233). "Transparent" is a valid value.

Color

The default color of the map; can be either a color name, a decimal RGB value, or a hex RGB value prefixed with a pound sign (#112233). "Transparent" is a valid value.

Font The family name of font in the map. Can be followed by a space and "bold" or "italic".
Font Color

The color of the font in the map; can be either a color name, a decimal RGB value, or a hex RGB value prefixed with a pound sign (#112233).

Font Size The size, in points, of the font in the map.
Hover Color Sets the region's color when the mouse pointer is hovered over it; can be either a color name, a decimal RGB value, or a hex RGB value prefixed with a pound sign (#112233).
ID The element's unique identifier.
Include Value in Labels If working with a datalayer, set this value to 1 to have data values appear in the labels along with region identifiers.
Outer Border Color

The color of the outer border of the chart canvas; can be either a color name, a decimal RGB value, or a hex RGB value prefixed with a pound sign (#112233).

Show Labels

Set this to False if you do not want the labels to be displayed. Default: True

  Back to top

 

Referencing Data

It's nice to be able to show maps, but the Animated Map element becomes really useful when it associates data with map regions. To do this, a datalayer element is added to the definition.

In the following example, a map of Canada will be produced, showing its provinces with their abbreviations. When the cursor passes over a province, a "tooltip" will appear showing the full province name and the number of members in a mythical book club chapter from that province.
 

In the example definition above, a DataLayer.Static element has been added as a child of the Animated Map element, and some Static Data Row elements have been added to provide data values. Naturally, depending on the datasource, other types of datalayers can be used here.
 

A fragment of this map's companion XML data file, Canada.xml, is shown above. Note its highlighted attributes, "InternalID" and "LongName". In order to relate the Province value in our data to the appropriate region in the map, a datalayer Join can be used between the data and the companion XML file.
 

First, as shown above, the Animated Map element's Region Name Column attribute value is set to the InternalID in the companion XML file. The Regional Value Column attribute is set to the MemberCount value in the static data.
 

Next, a Join element is added, as shown above. The Join element performs the equivalent of a SQL JOIN on two datalayers. In this case, an Inner Join will used between the static datalayer and...
 

...a new DataLayer.XML File element which is added. This datalayer retrieves the data from the map's companion XML file and its XML File attribute value is shown but has been truncated to fit on this page. The real value should always begin with:

    @Function.AppPhysicalPath~\rdTemplate\rdFusionMap\    

and end with the name of the map's companion XML data file. The companion XML file names correspond to those of the map type .swf files (without the "FCMap_" prefix and with an .xml file extension). So, for example, the file FCMap_Canada.swf corresponds to the companion XML file Canada.xml.
 

Finally, a Match Condition element is used to provide the JOIN criteria: the Province column value in the static datalayer must match the LongName column value in the companion XML file. Note that, as in any JOIN, the choice of which column is on the left and which is on the right is significant. Generally, the Left Data Column comes from the datalayer above the join and the Right Data Column from the datalayer below it.
 

Now when the map is displayed, as shown above, and the cursor is placed over a region, the LongName and MemberCount information appear in a tooltip.
 

"Drill-down" capability can be added by placing an Action element, as shown above, beneath the Animated Map element. Region-specific data can be accessed using @Chart tokens and passed, as Link Parameters, to the next report or process.

  Back to top

 

Adding Color Ranges

Once data values have been associated with them, individual regions in an Animated Map can be color-coded based on those values.
 

This is accomplished, as shown above, by adding one or more Map Color Range elements beneath the Animated Map element. Each element represents one color, which is set in its Color attribute. A legend is automatically generated for the map and the text in the DisplayValue attribute is used in it. The assignment of a color to a particular map region is controlled by the Max Value and Min Value attributes; the color will be assigned if the data value is within this range. These values correspond to the data value identified in the Animated Map element's Region Value Column attribute.
 

And the results can be seen in the example shown above. If no text is entered in the Display Value attributes, the numeric minimum and maximum values will be displayed in the legend instead.

  Back to top

 

Using a Color Spectrum Legend

Instead of using Map Color Range elements, you can add a "color spectrum" legend to your animated map; this legend uses colors to illustrate the distribution of the data values used to generate the map and assigns those colors to the appropriate map regions.
 

The first step, as shown above, is to add a Color Spectrum Column element beneath the datalayer. Configure its attributes to identify the data column used as the Animated Map element's Region Value Column, and the desired colors for the low, medium, and high values.
 


     

The next step is to add an Animated Map Color Spectrum Legend element, as shown above, beneath the Animated Map and to set its caption. The legend appears by default below the map, but its Location attribute can be set to make it appear to the right of the map.  

And the resulting map and legend are shown above.

  Back to top

 

Available Maps

The following maps are provided with Logi Info:

Map Type

Description

World

The World, with six major regions: North and Central America, South America, Europe, Africa, Asia, and Australia

World8

The World, with eight major regions: North America, Central America, South America, Europe, Africa, Middle East, Asia, and Oceana

NorthAmerica

Includes Canada, United States, Mexico, Central America, and Caribbean Islands

NorthAmerica_WOCentral

Includes Canada, United States, and Mexico
SouthAmerica South America
CentralAmerica Central America

CentralAmericawithCaribbean

Central America, with Caribbean Islands

Europe

Europe, with 46 countries

EuropewithCountries

Europe, with 49 countries (adds England, Northern Ireland, and Wales)

EuropeRegion

Europe, with five major regions: Western, Central, Eastern, Northen, Southern

EastEuropeanRegion

Includes Bulgaria, Romania, Moldova, Ukraine, Belarus, and Russia

CentralEuropeanRegion

Includes Switzerland, Germany, Liechtenstein, Slovenia, Austria, Czech Republic, Hungary, Slovakia, and Poland

WestEuropeanRegion

Includes France, Monaco, Luxembourg, Belgium, and the Netherlands
NorthEuropeanRegion Includes Iceland, Ireland, UK, Denmark, Norway, Sweden,
SouthEuropeanRegion Includes Portugal, Spain, Andorra, Italy, San Marino, Vatican City, Malta, Croatia, Bosnia, Montenegro, Albania, Greece, Macedonia, Serbia, Turkey, and Cyprus
Asia Asia, including Iran, Pakistan, Afghanistan, Turkmenistan, Uzbekistan, Kyrgyzstan, and Tajikistan
Asia3 Asia, without the Middle-East countries in the previous map
Africa Africa
MiddleEast Middle East, including Saudi Arabia, Israel, Turkey, Syria, Iraq, Qatar, Oman, Yemen, Kuwait, Bahrain, Emirates, and countries listed as included in Asia map
Oceania Australia, New Zealand, and nearby Pacific islands
   
USA United States, including individual states
USARegion United States, with five regions: Northwest, Southwest, Central, Northeast, Southeast

USANorthWestRegion

Northwest states, including Alaska, Washington, Oregon, Idaho, Montana, and Wyoming

USASouthWestRegion

Southwest states, including Hawaii, California, Nevada, Utah, Arizona, Colorado, and New Mexico

USACentralRegion

Central states, including North and South Dakota, Nebraska, Kansas, Oklahoma, Texas, Minnesota, Iowa. Missouri, western Michigan, Wisconsin, and Illinois

USANorthEastRegion

Northeast states, including eastern Michigan, Indiana, Ohio, Kentucky, Virginia, West Virginia, Pennsylvania, Maryland, Delaware, New Jersey, New York, Connecticut, Rhode Island, Massachusetts, Vermont, New Hampshire, and Maine, and the District of Columbia

USASouthEastRegion

Southeast states, including Arkansas, Louisiana, Mississippi, Tennessee, Alabama, Georgia, Florida, South Carolina, and North Carolina

(Individual States)

Map Type value is the state name, without any spaces; maps show counties
   
Canada Canada, including thirteen provinces: Yukon Territory, British Columbia, Northwest Territories, Alberta, Saskatchewan, Nunavut, Manitoba, Ontario, Quebec, Newfoundland & Labrador, New Brunswick, Nova Scotia, and Prince Edward Island
(Provinces) Maps provide counties. Map Type value is Ontario or Quebec.
   

UK

United Kingdom, including England, Wales, Northern Ireland, and Scotland
(UK Countries) Map Type value is one of four country names listed above, maps show counties
EnglandRegion England, with nine regions: Southwest, Southeast, London, East, East Midlands, West Midlands, Northwest, Yorkshire & the Humber, and Northeast

ScotlandRegion

Scotland, with ten regions: Dumfries & Galloway, Borders, Strathclyde, Lothian, Central, Fife, Tayside, Grampian, Highland, and Western Isles
   
(Countries)

These maps provide counties or other regional divisions. The Map Type values are: Afghanistan, Albania, Andorra, Antigua, Argentina, Armenia, AsiaGeorgia, Australia, Austria, Azerbaijan, Bahamas, Bahrain, Bangladesh, Belarus, Belgium, Belize, Bolivia, BosniaHerzegovina, Brazil, BritishColumbia, Bulgaria, Chile, China, Columbia, CostaRica, Croatia, Cuba, Cyprus, CzechRepublic, Denmark, Dominica, DominicanRepublic, Ecuador, Egypt, ElSalvador, Estonia, Finland, France, Germany, Greece, Greenland, Grenada, Guatemala, Haiti, Honduras, Hungary, Iceland, India, Indonesia, Iraq, Ireland, Israel, Italy, Jamaica, Japan, Kenya, Latvia, Liechtenstein, Lithuania, Luxembourg, Malaysia, Malta, Mexico, Moldova, Montenegro, Mozambique, Netherland, NewZealand, Nicaragua, NorthIreland, NorthKorea, Norway, Paraguay, Peru, Poland, PuertoRico, Romania, Russia, SaintLucia, SaintKitssandNevia, SaintVincentandtheGrenadines, SanMarino, Saudia Arabia, Slovakia, Slovenia, SouthAfrica, SouthKorea, Spain, Suriname, Sweden, Switzerland, Taiwan, Thailand, Turkey, UAE, Ukraine, Uruguay, and Venezuela.

(Special Maps)

These maps provide regions or provinces: NorwayRegion, SpainProvinces

  Back to top

 

Sample Application

A sample application can be found in the DevNet Sample Applications page.

  Back to top

 





        © Copyright 2007-2010 LogiXML, Inc. All rights reserved.