Cartographer Library

The improvement of Ajax and JavaScript based applications is not just based on the creation of various online applications to improve user interaction. The demand for Ajax has also pushed software companies and developers to create frameworks, libraries and APIs to ease the development of online applications. While developers will still be required to code some parts of the application, the tools created has shortened the number of work hours just to create an interesting application.

Developers can also push the functionalities of frameworks, APIs and libraries to create something interesting. A good example in pushing the capabilities of libraries is a small library called Cartographer.

Cartographer.js is a very small library with a specific function. This was created to aid developers build a map-based data presentation. Harnessing the power of Google Maps API, developers will be able to create presentations wherein data is presented in Google Maps. Map-based data such as population, users per location and other forms of data can be easily created with this library. It's a small library that effectively uses another API in order to create client side presentations without requiring too much from the users.

Mash-ups of Data and Interface

The best thing about Cartographer.js is its ability to piece together information from various sources. It has already created a connection with Google Maps but it can be pushed further for additional information.

A good example found in their official website is the connection of Google Maps and Google Docs. Developers push the information from Google Docs (in Excel format) and tied it with Google Maps. The result is the impressive location based charts.

Google Docs is not used as an API in this library but simply another data source. Of course, using a server as the source of data is also a possibility. This simply shows that developers can harness anything online to create something interesting.

Including Raphaël Library

Although Google Maps already comes with a separate API so that it can be implemented at will. It can be challenging to simplify the API and immediately tie them with another source for the needed presentation.

The developers of Cartographer.js opted to add another library to help ease the loading of maps. Raphaël library is implemented along with the library so that maps will be loaded in the client side as SVG.

Adding Raphaël to Cartographer.js improves customization in the client side. Developers can configure the size, colors and presentation types added in the map. Developers can even provide a zoom option for users. By default, the function is already enabled in the library. Additional features in the library are the addition of the variety of colors for each tags and thickness of colors measured from 0 to 1.0.

Last but not the least customization based on the mode of interface can be done through methods. Specifically developers can use choropleth, cluster, pies and scatter methods.

See the code and try out the examples in the libraries official site: http://cartographer.visualmotive.com/. Take note of the various types of maps and how they can be implemented in the client side.