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.
This tutorial is the third part of a tutorial series about customized map projection in flash/actionscript. It demonstrates how to draw a world map using the as3-proj library and some helper classes. I assume that we read in a shapefile using the SHP library as shown in the previous tutorial.Continue reading →
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.
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 →
Yesterday I read an interesting article in the “AI Journal“, which is the german news journal of amnesty international. It was about how many people in the world having internet access and how some governments and companies are censoring internet content. Thereby I saw this map:
Visualization of world-wide internet access taken from the current german "AI Journal"
Thanks to the Mercator projection, the European countries are about twice as large as there are in reality, Iceland appears as big as Spain and Alaska as big as Australia. As it’s impossible to map the surface of a sphere to a plane without distortions, every map projection has to deal with some kind of errors. But there is at least one mistake that cannot be tolerated. Can anybody see where Greenland has gone? I mean, it’s quite a large country so it’s not easy to forget. I think they simply left it out. Who cares about the 57,000 people living there? Who cares about all the people seeing this map in the journal? Who cares about visualization integrity? At least not the editorial staff from the German AI Journal.
So, I want to apologize to all people living in Greenland by completing this post with a map of Greenland in it’s real size and proportion. I know you are there!
