JavaScript for Geospatial applications: An Overview



JavaScript has formed a strong relationship with the Geospatial world (WebGIS, in a manner that is reminiscent of the relationship between Python and Desktop GIS. JavaScript is often regarded as more of a scripting language than a full-fledged object oriented language but I must admit it has got a much wider functionality than one might imagine and for the record, JavaScript is officially termed as Object-Scripting language (read: Mozilla’s JS page). If you are looking for an overview of  programming languages used in GIS, have a look at my previous post.

While the capabilities of Desktop GIS and their applications are undisputed, there has been a steady growth in the number of WebGIS applications and Apps. Majority of such applications utilize one JavaScript library or the other. Depending on whether you just want to use JavaScript for developing a simple map for your website (Related: Deploying your own Slippy maps) or visualize tweets in real-time, one of the many JavaScript libraries and tools might be of interest to you.

Here’s an overview of JavaScript for Geospatial applications:


Leaflet is a great tool for making mobile-friendly interactive maps and it extremely light-weight. Leaflet has a lot going for it and was one of the fundamental driving forces behind the recent redevelopment of OpenLayers 3.0.


OpenLayers has great documentation, a new version (3.0), lots of examples to get you started and the best thing of them all – Open source! Certainly my favorite JavaScript library and is one of the easiest ways to get a map on the web.

ESRI API for JavaScript

ESRI does it and does it well. Not for nothing, is ESRI considered as the GIS pioneer.  Some of the functionality that you see with ESRI’s API is not that easily achievable with the Open source solutions especially if you have limited programming skills. However ESRI is not alone in the JavaScript for Geospatial arena and it looks like this is going to be one interesting competition.


CartoDB impressed us with their living cities visualization partnering with HERE and then they “wowed” us with the real-time geo-tagged twitter maps. Guess those two examples are enough to understand why CartoDB.js is a great library for geospatial applications. Here’s a presentation (Jan 2013) about using CartoDB to develop maps for the web.


MapBox.js is another cool library for building interactive maps. FourSquare, Pinterest, National Geographic are some of the companies that utilize MapBox’s JavaScript libraries for their web maps.


Data-Driven Documents or D3 is general purpose data visualization library. D3 is certainly a hot topic of discussion and development among geospatial professionals. Considering that D3 supports a new format called TopoJSON for topology data, this is a given I guess! Our geo-geek blog partners at digital-geography do most certainly love this. Here’s a blog post regarding mapping using D3.

Node.js & Node Postgres

Great JavaScript libraries for building a web based PostGIS application. Here’s the guide that I found rather useful when getting started with Node.js.

Open Weather Map API

Get detailed weather information using this free JavaScript API.


Really cool JavaScript library for rendering interactive 3D (0r 2D) graphic visualizations without any plug-ins on the browser, requires WebGL though.


If you want to make use of the HERE’s awesome expertise with traffic information, routing and more.


The Open source alternative to ESRI’s Story map application.

And of course, Yahoo Maps API, Bing Maps API and Google Maps API. If you dont want to use the data from the big players, there is always OpenStreetMap.

Learning JavaScript

There are lots of JavaScript books, resources and tutorials available and to each one his/her own but you might want to have a look at OpenGeo’s resource for learing to use JavaScript for Geospatial applications aka programming WebGIS applications – OpenGeo’s JS page.

I am sure that I am missing a lot of really nice JavaScript libraries and APIs. It would be wonderful to have your input in this regard. After all, that’s what the comments section is for 🙂

I am one of those passionate "Geo-geeks" and "Geo-people" who is just too excited about everything Geo and Management. Location information and spatial technologies are just too big to take a back seat and watch them revolutionize the world. Always curious and looking for ways to innovate, I guess that it comes naturally by the gene pool I inherited from an engineer Mom and a researcher Dad.


  1. Hi, thanks for such a good article.. i need a piece of advice from you. I am a computer science Post Grad having very little experience with Programming, as of now i am working on WebGis Project using few Open Source Tools like pmapper. I want to equip and expertise myself in WebGis ( Geo Portal like). Please suggest,from where I should start, Which language should I use. Any Development Platform, tutorials, IDE…. thanks.

  2. I would add Google Fusion Tables is a great base layer, especially for KML layers. I pull the fusion layer into my html pages and then do everything through the Google Maps Javascript API.

    • Well it’s sort of the opposite of a “base layer”. It’s a thing for arranging and presenting your data points *on top of a base layer*. It’s clever the way fusion tables will cope with lots of data points without overloading the browser, by secretly rendering your markers onto raster tiles. These are then still clickable in the presentation, so you’d never know! There’s lots of ways of rendering data to raster outside of the google stack, but for something which does it in such a seemless zero-development-effort way, the closest thing is CartoDB.

  3. Some great software listed here, although it’s a bit of a confusing mix of higher level and lower level pieces of a puzzle. There’s quite of lot of different choices for what I would call a “web mapping library”. LeafletJS deserves to be higher on this list, if not the top. When you work with Mapbox.js you’re actually working with leaflet (extended to integrate with Mapbox API keys and other features editable in Mapbox studio) When you work with CartoDB you’re actually working with leaflet (by default, although CartoDB does lower level rendering which can be presented using various web map libraries) . For D3 you linked a tutorial which shows how to start with LeafletJS and add some D3 functionality, although you can also do some funky mapping with D3 without working with raster tiles at all e.g. rendering a spinning globe. Leaflet is a bit easier than OpenLayers to get started with I would say.

    We’ve got a list of web map display libraries on the OpenStreetMap wiki here:

    • Thanks for your input. I agree with you regarding Leaflet’s importance in the “web mapping libraries” hierarchy. Moved Leaflet JS higher up the order.

      Added your OSM post to the post as well 🙂 Your inputs are really useful, thanks again!

  4. could you introduce an article, website or blog about “comparison between mentioned libraries for geo-spatial applications” ?

  5. […] JavaScript: WebGIS is certainly the next big thing in GIS and right from big data to twitter visualizations, everything that involves Web User Interfaces is being written using JavaScript.Google Maps, OpenLayers and a whole lot of other applications run on JavaScript. Personally, it has been a great experience for me using JavaScript for WebGIS projects. It might have its own drawbacks, but its amazing to see what JavaScript can help you achieve. (JavaScript for Geospatial applications; An Overview). […]


Please enter your comment!
Please enter your name here