Social development practitioner. Trying to understand our world.
Published
Edited
Jul 10, 2018
2 stars
{
var map = new Datamap({
element: document.getElementById('container'),
projection: 'mercator',
fills: {
defaultFill: "#ABDDA4",
authorHasTraveledTo: "#fa0fa0"
},
data: {
USA: { fillKey: "authorHasTraveledTo" },
JPN: { fillKey: "authorHasTraveledTo" },
ITA: { fillKey: "authorHasTraveledTo" },
CRI: { fillKey: "authorHasTraveledTo" },
KOR: { fillKey: "authorHasTraveledTo" },
DEU: { fillKey: "authorHasTraveledTo" },
}
});
var colors = d3.scale.category10();
window.setInterval(function() {
map.updateChoropleth({
USA: colors(Math.random() * 10),
RUS: colors(Math.random() * 100),
AUS: { fillKey: 'authorHasTraveledTo' },
BRA: colors(Math.random() * 50),
CAN: colors(Math.random() * 50),
ZAF: colors(Math.random() * 50),
IND: colors(Math.random() * 50),
});
}, 2000);
}
Datamap = require('https://bundle.run/datamaps@0.5.9')
topojson = require("//cdnjs.cloudflare.com/ajax/libs/topojson/1.6.9/topojson.min.js")
d3 = require("//cdnjs.cloudflare.com/ajax/libs/d3/3.5.3/d3.min.js")
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
