convertData = (data) => {
const sources = R.pluck("source")(data);
const targets = R.pluck("target")(data);
const uniqs = R.uniq(R.concat(sources, targets));
const nodes = R.map(R.objOf("name"), uniqs);
const nameToIndexEvolver = (el) => ({
source: R.indexOf(el.source, uniqs),
target: R.indexOf(el.target, uniqs),
value: el.value
});
const links = R.map(nameToIndexEvolver, data);
const graph = { nodes, links };
return graph;
}
convertData(exampleData)
viewof f = html`<input type=file accept="text/*">`
csvData = d3.csvParse(await Files.text(f))
dataPastedParsed = d3.tsvParse(pastedData)
format = {
const f = d3.format(",.0f");
return d => `${f(d)}`;
}
color = {
const color = d3.scaleOrdinal(d3.schemeCategory10);
return name => color(name.replace(/ .*/, ""));
}
width = 1200
height = 600
d3 = require("d3@5", "d3-sankey@0.12")
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.
