kartograph-js

JavaScript library for SVG mapping

npm install kartograph-js
28 downloads in the last week
52 downloads in the last month

Kartograph.js

Kartograph.js is a JavaScript library that renders SVG maps in web browsers. It is built on top of jQuery and RaphaelJS. Please have a look at the API docs for more details.

Initializing a new map

map = $K.map('#map', 600, 400);
map.loadMap('world.svg', function() {
    map.addLayer('countries', {
        styles: {
            fill: '#ee9900'
        },
        title: function(d) {
            return d.countryName;
        }
    });
});

Choropleth maps (aka coloring map polygons based on data):

pop_density = { 'USA': 123455, 'CAN': 232323, ... };

colorscale = new chroma.ColorScale({
    colors: chroma.brewer.YlOrRd,
    limits: chroma.limits(chroma.analyze(pop_density), 'k-means', 9)
});

map.getLayer('countries').style('fill', function(data) {
    return colorscale.get(pop_density[data.iso]);
});

Adding symbols is easy, too:

cities = [{ lat: 43, lon: -75, label: 'New York', population: 19465197 }];

map.addSymbols({
    data: cities,
    location: function(d) {
        return [d.lon, d.lat];
    },
    type: Kartograph.Bubble,
    radius: function(d) {
        return Math.sqrt(d.population) * 0.001;
    }
})

Author

Kartograph was created by Gregor Aisch. It is supported by Piwik Web Analytics and the Open Knowledge Foundation.

License

Kartograph.js is licensed under LGPL

npm loves you