Archive for the ‘Map’ Category

Maps are used so widely in web design and they are usually expected to be interactive when presenting data.

It can be the branches of an international company, statistics about  countries or just destinations to visualize. Like said, lots of uses.

Simplemaps is a website that provides professional, highly-customizable and interactive maps built with JavaScript and SVG (or Flash).

SVG Maps - Simplemaps

SVG has a wide browser-support and it works very well on mobile + tablet as well.

There are maps for “world/countries, continents, USA and Canada” and the usage +customization doesn’t require advanced development knowledge. It works by simply editing a text file and a detailed, step-by-step documentation exists.

Also, Simplemaps website has an online customization tool that enables the users to edit the countries, change colors, descriptions, links and more.

Considering that the maps are in vector (SVG), tiny or huge, they work great on all sizes. And, they even come with a zoom-in functionality.


With some JavaScript, it is so easy to add new features to them like tooltips, selectable regions and much more.

To sum up, SVG maps are definitely the way to go for modern web maps and Simplemaps has a wide range of products on the field.

P.S. For Flash fans, the website also offers similar maps in Flash with their source code.

How to join the giveaway?

Simplemaps is giving away 3 licenses (for a map of your selection). Commenting to this post is enough.

Winners will be selected on 22 April 2013 (1 week later) with the query below and announced as an update to this post.:

SELECT * FROM wp_comments WHERE comment_post_id=3981 AND comment_approved=1 AND comment_type='' GROUP BY comment_author_email ORDER BY RAND() LIMIT 3

Good luck to all.

The winners

Here they are:

  • Roshin C (comment #1260748)
  • Jed (comment #1260726)
  • DR (comment #1260708)
Congratulations and thanks to everyone for joining.


Maplace.js is a jQuery plugin that simplifies integrating Google Maps into websites.

It works with the latest Google Maps API (v3) and has methods for adding markers + custom content and drawing paths, polygons or routes.


There are options for defining the zoom level or controls to be displayed (zoom, map/satellite..).

The plugin allows customizing almost everything from the icons used to texts and colors.

It has callbacks on each action and comes with a very well documentation.

It was very exciting to explore the cities when Google Maps had integrated 3D drawings of each building in some cities.

OSM Buildings is a JavaScript library that enables us to create a similar functionality using any mapping provider.

OSM Buildings

The library uses Leaflet mapping engine and HTML5 canvas (rather than WebGL) and requires the geometry data of the area to be visualized.

There are various free sources for such data and the library can be handy when creating such custom visualizations for a limited area.

  • Tags:
  • Filed under: Goodies, Map, Other License
  • DataMaps is a script to display any data interactively and beautifully inside maps.

    It comes with ready-to-use maps for world map with countries, USA with states and a combined one.

    The map data is stored as JSON and any custom maps can be created by following the structure.


    DataMaps makes use of D3, Backbone + Underscore and comes as a jQuery plugin (or a as a standalone Backbone view).

    When browsing through the maps, the hovered or clicked parts can be highlighted and be set to display custom information.

    Also, it has support for visualizing data as bubbles in different sizes to show the effect of the data over a region.

  • Tags:
  • Filed under: Goodies, Map, MIT License
  • 1 Comment
  • Nokia was providing online maps for a long time and, recently, they have renewed it with exciting features and a fresh name: HERE.

    HERE Maps is developer friendly, has a complete API and tools that makes any integration possible.

    For web developers, to simplify working with HERE even more, there is an unofficial jQuery plugin named jHERE.

    jHERE - HERE Maps

    The plugin is compatible with both jQuery or Zepto.JS and  has support for creating simple-to-complex maps.

    It is possible to define the locations, enable/disable the tools (zoom, scale bar, map type, etc.), add markers or even overlay data from a KML file.

  • Tags:
  • Filed under: Goodies, Map, MIT License