(view source)Clustering Map Symbols

These maps demonstrate the map symbol clustering features built into Kartograph.js. They all show the same dataset of UK cities sized by the number of people that have visited this website in 2012.

no clustering — The first map shows the +500 symbols without clustering. London (2k visits) is completely covered by hundreds of cities with only a few visitors. Local maxima such as Leeds and Manchester are hidden, too.

k-means — Symbols are combined using k-Means clustering. While the algorithm ensures a fixed number of symbols, it doesn't care about overlappings. Inspired by and uses implementation released along with this Polymaps example.

noverlap — Here symbols are combined only if they overlap, as described here. This has the advantage of retaining details in regions with less symbols. The name is inspired by a Gephi plugin.

How to do it

To activate the symbol clustering you need to add two things to the symbol config: the name of clustering technique (either k-means or noverlap) and a function that aggregates data objects of the grouped symbols.

function sumVisits(cities) {
    var total = 0;
    $.each(cities, function(i, city) {
        total += city.visits;
    });
    return { visits: total };
}

map.addSymbols({
    type: Kartograph.Bubble,
    data: cities,
    location: function(city) { return [city.lon, city.lat]; },
    radius: function(d) { return Math.sqrt(city.nb_visits); },
    // name of clustering technique
    clustering: 'noverlap',
    // aggregation function
    aggregate: sumVisits
});

For more details on fine-tuning the symbol clustering, please look up the documentation.