Posts Tagged → map

Simplification of Country Outlines

Simplification is a common task in vector-based map visualization. In some situations you don’t want to display a map in its full resolution for reasons like the overall filesize and the rendering time. One major class of simplification algorithms works by removing some vertices without moving the remaining ones. While there are already some good tutorials for implementation of line simplification algorithms online1, none of them takes into account the special requirements of map data simplifications. This gap will be closed by this post. Continue reading →

  1. for instance the Douglas Peuker Line Generalization or Lang Simplification and McMaster’s Slide Averaging Algorithm ↩

Map Rendering Speed: Flash vs. HTML5 Canvas

Many people are talking about html5 and the death of Flash in these days, so I decided to do a small speed comparison of map renderings between HTML5 and Flash. I took the quick and dirty example from my previous map rendering tutorial and ported it into html5/javascript. The only thing it does is reading in a fat list of 95,162 map coordinates, projecting them using the Hatano projection and finally rendering the resulting polygons on screen. I chose Hatano because it’s a nice looking projection with only a few lines of code. You can benchmark the rendering yourself by visiting the html5 map rendering demo and the flash map rendering demo. I tested the browsers Firefox 3.6.3, Chome 4.1 and Internet Explorer 8 on my notebook (intel core 2 cpu, t5600 @1.83GHz, 2gb ram) and averaged the results over 10 test runs.

So here are my results. I achieved the fastest map projection calculations in Firefox (314ms), followed by Chrome (657ms) and Flash (1,036ms). The fastest map renderings were achieved in Flashplayer (83ms), followed in distance by Chrome (446ms) and Firefox (610ms). Seems as if the days of flash aren’t counted yet (no big surprise).

Also no surprise are the bad results of the internet explorer, because it lacks a native implementation of the html5 canvas. If you really want to run the tests in IE8 you probably want to disable the javascript timeout notifications in the registry ;-). You find the complete list of my test results below.

Map Projection in ActionScript

Today I want to introduce as3-proj, an actionscript port of the java map projection library by Jerry Huxtable, which is itself an partial port of the PROJ.4 library. It’s basically a huge set of over sixty map projection classes which you can use to convert geographical coodinates (pairs of latitude and longitude values) into screen coordinates.

Usage example

You can use the projection classes like this:

var lat:Number, lng:Number, proj:Projection, p:Point;
lat = 40.2302; // degrees
lng = 24.32434; // degrees
proj = new RobinsonProjection();
proj->initialize();
p = proj->project(lat, lng, new Point());
// p contains converted values in metres

Demonstration

I built a sample application that shows static world maps in different map projection. You can switch the map projection using the menu at the bottom. Also you can filter out some map projections, e.g. to only display rectilinear map projections. The visualization of some projections (like the Orthographic Projection) still need a little more coding to be perfect (eg. removal of hidden lines and faces), but this was out of the scope of this demo.

Supported projections

You find a alphabetically sorted list of all included map projections and their properties below.

projection has invers parallels are parallels is rectilinear is conformal is equal area
Airy’s Minimum-Error Azimuthal no no no no no
Aitoff no no no no no
Albers Equal Area yes no no yes yes
Boggs Eumorphic no yes no no yes
Bonne yes no no no yes
Cassini yes no no no no
Central Cylindrical yes yes yes yes no
Collignon yes yes no no yes
Craster Parabolic (Putnins P4) yes no no no yes
Cylindrical Equal Area yes yes yes yes no
Denoyer Semi-elliptical no yes no no no
Eckert I yes yes no no no
Eckert II yes yes no no no
Eckert IV yes yes no no no
Eckert V yes yes no no no
Euler yes no no yes no
Fahey yes yes no no no
Foucaut Sinusoidal yes yes yes yes no
Gall Stereographic yes yes yes yes no
Gall-Peters yes yes yes yes yes
projection has invers parallels are parallels is rectilinear is conformal is equal area
Ginsburg VIII (TsNIIGAiK) no yes no no no
Goode Homolosine yes yes no no yes
Hammer & Eckert-Greifendorff no no no no yes
Hatano Asymmetrical Equal Area yes yes no no no
Kavraisky V yes yes no no yes
Lagrange no no no yes no
Lambert Conformal Conic yes no no yes no
Lambert Equal Area Conic yes no no yes yes
Landsat no no no no no
Larrivée no no no no no
Laskowski Tri-Optimal no no no no no
Loximuthal yes yes no no no
McBride-Thomas Flat-Polar Parabolic yes yes no no no
McBryde-Thomas Flat-Polar Quartic yes yes no no no
McBryde-Thomas Flat-Polar Sine I yes yes no no no
McBryde-Thomas Flat-Polar Sine II yes yes no no no
Mercator yes yes yes yes no
Miller Cylindrical yes yes yes yes no
Mollweide yes yes no no yes
Murdoch I yes no no yes no
projection has invers parallels are parallels is rectilinear is conformal is equal area
Murdoch II yes no no yes no
Murdoch III yes no no yes no
Nell yes yes no no yes
Nell-Hammer yes yes no no no
Nicolosi Globular no no no no no
Orthographic Azimuthal yes no no no no
Perspective Conic yes no no yes no
Plate Carrée yes yes yes yes no
Putnins P’4 yes yes no no yes
Putnins P’5 yes no no no no
Craster Parabolic (Putnins P4) yes no no no yes
Putnins P5 yes no no no no
Quartic Authalic yes yes no no yes
Robinson yes yes no no no
Sinusoidal yes yes no no no
Transverse Central Cylindrical no no no no no
Transverse Cylindrical Equal Area yes no no no yes
Tissot yes no no yes no
Urmaev Flat-Polar Sinusoidal yes no no no no
van der Grinten (I) yes no no no no
projection has invers parallels are parallels is rectilinear is conformal is equal area
Vitkovsky yes no no yes no
Wagner II yes no no no no
Wagner III yes yes no no no
Wagner IV yes yes no no no
Wagner V yes yes no no no
Wagner VII no no no no yes
Werenskiold I yes yes no no yes
Winkel Tripel no no no no no

The following projection are also included but are a bit buggy yet. Maybe someone with more knowledge about map projection math is able to stop those formulas from throwing weird exceptions.

projection has invers parallels are parallels is rectilinear is conformal is equal area
August Epicycloidal no no no yes no
Bipolar Conic yes no no no no
Equidistant Azimuthal yes no no no no
Lambert Equal Area Azimuthal yes no no no yes
Space-oblique Mercator yes no no no no

Since I only tested the one-way projection of geographic coordinates into screen coordinates there still might be some bugs on the inverse projections. The java code of the map projection library had a few errors. Hope the classes are helpful anyway.

Download & License

The source code of as3-proj is released under the Apache License.

You can download the sources from my bitbucket account. Here is a direct link to the zipped sources.

If my work is useful to you, please feel free to donate an amount of your choice via paypal. Thanks!


World Map of Internet Adresses

World Map of Internet Adresses (cutout)

This visualizations shows the geographic location of 1,139,441,531 ip adresses. The locations are grouped by city, divided into four categories according to the total number of ip adresses belonging to a city. The categories are net-metropoles (more than 10,000,000 IPs), net-capitals (1,000,000 up tp 10,000,000 IPs), net-cities (100,000 up 1,000,000 IPs) and net-villages (fewer than 100,000 IPs). IP adresses that cannot be allocated to a city were left out.

I created this visualization using ActionScript, based on my classes for map projections and polygon maths, which you can download for own usage. The data was extracted from the free GeoLite-City database by MaxMind.

Selected Map Projections in ActionScript

Update: I strongly recommend the use of as3-proj instead, which includes far more map projections and lots of other features.

Something you definitely need if you’re planning to create some geospatial visualizations from scratch is map projection. Map projection means the conversion of sphere coordinates (basically pairs of latitude and longitude values) to 2D-screen coordinates. While this is very easy for smaller regions like single countries things are getting complicated if you want to display the whole world. Continue reading →

Visualization and interpretation of weather station data

There’s some kind of hype around climate data these days. Since the UK’s National Weather Service recently published an enormous set of weather station data files there’s a growing number of visualizations spreading the net. Among a few other examples I found this very nice and clear looking chart:

Figure 1: Visualization of climate changes taken from EagerEyes.org

Figure 1: Visualization of climate changes taken from EagerEyes.org

It’s showing the average world temperature over the last 250 years. Looking at this chart your first thought is something like: Oh my god, it’s getting hot on earth. But wait a minute. An mean temperature increase of 10°C in only 200 years? And what about this hard step around 1950? To answer these questions I had to step deeper into the data. Therefore I made a visualization myself, that simply shows a world map with all weather stations. The temperature range is from -70°C (dark blue) over 0° (white), 10°C (yellow), 32°C (red) to 40°C (dark red). The video goes through 3 loops showing the mean temperature (MT), the summer mean temperature (SMT) and the winter mean temperature (WMT).

One of the major insights you get from seeing this is the unequal and unsteady distribution of weather stations around world and time. While there are only few stations outside europe in 1850 the world is almost complete “filled” in 2000. Did you notice how suddenly africa fills with weather stations around 1950? To get a clearer look at the distribution of weather stations I made this stacked area chart:

Figure 2: Distribution of weather stations over latitude ranges

Figure 2: Distribution of weather stations over latitude ranges

You can see that there was a steady increasing number of weather stations in the near equator regions. You can even find the peak around 1950 in this chart.

As it’s always warmer near the equator than near the poles and this temperature difference is much bigger than the estimated increase over 200 years, one cannot simply average the data from unevenly distributed weather stations. The more stations you have in africa, the higher your global temperature gets. What you have to do instead is something like taking the average of the average temperature of the weather stations on the same latitude. I think this type of error is called a systematic bias.

So, who is going to make a corrected version of the firstly shown chart?

Real-time Visualization of Site Traffic

The last days I worked on a visualization experiment that shows the geographic locations of blog page requests on a world map. Furthermore, the visualization should be animated over time, so one can replay past events or just view the current live data. The last thing I added was an indicator for night and day phases in the world. Here you can see a little preview video showing the current results…

I did this with pure AS3.