30 Superb Examples of Infographic Maps | Webdesigner Depot

20 Oct
30 Superb Examples of Infographic Maps
Data Visualization, Design, Infographics
42

As you search the web you’ll come across a wide range of interactive and graphical maps.
Deciding when, where and how to integrate or display a map on your site is the first step, the second should be what technology and illustrations to use.
If you’re all about interaction, JQuery, Ajax, or Flash are all effective technologies that hold their own ground.
Map illustrations are a dime a dozen however, a strong and balanced display of graphics, information, and colors is what makes an infographic stand out and reach its target audience effectively.
As designers, we’re constantly searching for ways to improve and style our designs, this is exactly what the following 30 infographics and sites display below; the breaking of rules.
Sites with Interactive Maps

Illustrative Infographics

Compiled exclusively for WDD by Liz Fulghum.
Did we miss any great examples? Please post them in the comments’ area below…

Share this story

Tweet Share
Related Posts
25+ Useful Infographics for Web Designers 30 Useful Web Design Books for 2009 101 Examples of Text Treatments on the Web
42 Comments »

#1
Sean Clarke
October 20th, 2009 at 21:22
Nice — all I need now is to learn how to draw maps !

Reply Close comment form

#2
Evan Jones
October 20th, 2009 at 21:23
I love info-graphics like these! Such a beautiful organization of data

Reply Close comment form

#3
Jad Graphics
October 20th, 2009 at 21:57
Great examples. I recently wrote a blog post about infograpics as well. They are awesome!

Reply Close comment form

#4
Paul Randall
October 20th, 2009 at 22:04
As a visual learner, these are great, and much more interesting than tables and pie charts!

Reply Close comment form

#5
Most Interesting Ideas
October 20th, 2009 at 22:06
Cool maps

Reply Close comment form

#6
Web Design Maidstone Kent
October 20th, 2009 at 22:24
Wow, what a great way to display info, I remember doing demographics using a 3d uk map, took forever but looked great… site no live anymore though which is a masisve shame!

Reply Close comment form

#7
Greg
October 20th, 2009 at 22:26
Amazing Maps!!!!
This can really bring clarity to information in a way charts just cannot

Reply Close comment form

#8
Joel Sutherland
October 20th, 2009 at 22:51
Here is a link to a writeup on the second map. It was done entirely in jQuery and is driven by a CMS:
http://www.newmediacampaigns.com/page/jquery-vs-flash-for-interactive-map

Reply Close comment form

#9
Web Design Kilkenny
October 20th, 2009 at 23:15
Thanks for putting all this together – I’m always looking for inspiration when it come to maps – trying to get away from the plain vanilla google maps.

Reply Close comment form

#10
Oscar Martell
October 20th, 2009 at 23:40
Wow, I´m very impresed, great recopilation. Thanks for sharing

Reply Close comment form

#11
Sean
October 21st, 2009 at 00:07
Can anyone provide a good link for the Hurricane Hugo graphic?

Reply Close comment form

#12
App Sheriff
October 21st, 2009 at 03:30
Another Great Comparison Map
http://www.appsheriff.com/inspiration/creative/14-exceptionally-interesting-infographic-comparison-maps/

Reply Close comment form

#13
Dzinepress
October 21st, 2009 at 08:18
really superb examples which you mention in post titile, there is all graphs fulfill requirements, me also getting idea because now a days i am also working on an project which belong to same idea and your article helping me too much.

Reply Close comment form

#14
s.holstens
October 21st, 2009 at 10:34
Thank you for inspirating me =) and thanks for this nice collection.

Reply Close comment form

#15
pesho
October 21st, 2009 at 10:54
Thanks,these are very amazing

Reply Close comment form

#16
2expertsDesign
October 21st, 2009 at 13:33
LOOKS GREAT!!! really very impressive. Anyway, really enjoyed the post.

Reply Close comment form

#17
Scarlett
October 21st, 2009 at 14:03
Beautiful maps! Makes figures less boring =]

Reply Close comment form

#18
Sami Susiaho
October 21st, 2009 at 14:17
I cannot believe you just posted this, without including the classic example of an infographic map. Made by Harry Beck in 1933 and widely known, it also made headlines a few weeks ago, as a very important part of it was removed
http://www.bbc.co.uk/london/travel/downloads/tube_map.html
It is ofcourse, the London tube map and the part that was removed in august was the Thames. As the Thames is a very integral part of the map, it cannot be removed and will be reinstated. The alpha and the omega of the infographic maps, portraying just the information you need in an understandable (yet abstract) form.

Reply Close comment form

#19
aledesign.it
October 21st, 2009 at 14:39
Thank for this post..The firs adn second examples are so nice.

Reply Close comment form

#20
RoaldA
October 21st, 2009 at 18:46
Great stuff!

Reply Close comment form

#21
Designerkan
October 21st, 2009 at 19:09
Perfect Maps Thank you…

Reply Close comment form

#22
wien
October 21st, 2009 at 20:25
nice post

Reply Close comment form

#23
Julia
October 21st, 2009 at 21:18
Really impressive and gives a lot of inspiration. The best demonstration at all – infographics don´t have to be boring! Thanks WD!

Reply Close comment form

#24
Inside the Webb
October 21st, 2009 at 23:33
These are some pretty cool designs, glad I checked out the post

Reply Close comment form

#25
sushil
October 22nd, 2009 at 06:17
Link on last map’s in the list (about stock markets) is wrong, click takes to a wrong map.
Good collection

Reply Close comment form

#26
Edu
October 22nd, 2009 at 10:53
Hi people !
Check this site of mapping:
http://www.cercalia.com
We have our own API…

Reply Close comment form

#27
James
October 22nd, 2009 at 11:28
Making a map interesting is something I know I always struggle with. This collection definitely gives some brilliant ideas, and even the tube map posted in the comments is a great example.
I’ll be sure to check back here next time I need to be fancy with my map display!

Reply Close comment form

#28
Alex Mathers
October 22nd, 2009 at 18:52
These are all very inspiring. I’m thinking, as an illustrator, to get into working on more infographic type stuff.

Reply Close comment form

#29
NBA
October 22nd, 2009 at 21:16
Making a map interesting is something I know I always struggle with. This collection definitely gives some brilliant ideas, and even the tube map posted in the comments is a great example.

Reply Close comment form

#30
SashaKa
October 23rd, 2009 at 11:30
Having a detailed interactive map on your website is realy good marketing tool. This list is wonderful and full of fresh ideas)) only I can add is this map http://www.hiltonhead360.com/Hilton-Head-Map.html done by this guys http://www.sibers.com

Reply Close comment form

#31
oxidizzy
October 23rd, 2009 at 12:10
Amazing !!! Give me an idea to make some thing like these (map) for my mini shop.

Reply Close comment form

#32
accessoire
October 23rd, 2009 at 16:57
If you think that’s great then check out the website of the german agency “Kircher Burkhardt” http://www.kircher-burkhardt.com/
Go to “Kunden” -> “Infografik”

Reply Close comment form

#33
CSS
October 23rd, 2009 at 18:58
Very nice collection.

Reply Close comment form

#34
Grafiker
October 26th, 2009 at 20:15
Great Inspiration. Thank you.

Reply Close comment form

#35
Alvaro Hernandorena
October 26th, 2009 at 21:57
great!, i work with maps most times, i work as a designer in a real estate in Punta del este – Uruguay, so i do a lot of work with maps and animation.
here is a link http://www.alejandroperazzo.com/edificiosnuevos/ that one is nice but the map doesen’t move and it has a BAD moving water effect =D
here is another http://www.alejandroperazzo.com/clubdellago/ moving but with less animation.
regards

Reply Close comment form

#36
ec
October 27th, 2009 at 17:03
Sin maps:
http://www.wired.com/culture/education/magazine/17-09/st_sinmaps

Reply Close comment form

#37
Deja
November 3rd, 2009 at 03:16
I’m fascinated with Infographics and this is a great source of new inspiration. Much appreciated!

Reply Close comment form

#38
claudia
December 28th, 2009 at 03:44
check this one. she is an architect but she also drwas maps sometimes.
http://s-t-a-r.nl/html/projects/Project-frameset-SM.html
scroll down.
i love the separatist countries map

Reply Close comment form

#39
Lee Chizum
February 19th, 2010 at 18:30
Wow. What’s the most comprehensive software, or software combo, to create great infographics?

Reply Close comment form

#40
Emlak
March 3rd, 2010 at 15:48
Wow, what a great way to display info, I remember doing demographics using a 3d uk map, took forever but looked great… site no live anymore though which is a masisve shame

Reply Close comment form

#41
Jen
March 30th, 2010 at 11:19
The 10 hours of havok one is amazing.

Reply Close comment form

#42
LiderPaylasim
May 10th, 2010 at 04:19
It’s amazing! Thanks for that.

Reply Close comment form

Name (required)

E-mail (required - never shown publicly)

Web-site

Your Comment (smaller size | larger size)
2+5=? (required)
Notify me of followup comments via e-mail

TOP OF PAGE

Web Designer Depot

Home| Advertising| About| Contact

© 2010 All Rights Reserved