Published
Edited
Apr 3, 2020
1 fork
Insert cell
Insert cell
{
const svg = d3
.create('svg')
.attr('width', width)
.attr('height', width / 10);

const wc = wordCloud();

svg.datum(words).call(wc);

return svg.node();
}
Insert cell
wordCloud = () => {
let r = d3
.scaleSqrt()
.range([0, 30])
.nice();

let x = d3.scaleLog().range([0, width]);

function me(selection) {
r.domain([0, d3.max(selection.datum(), d => d.met)]);
x.domain([0.00001, d3.max(selection.datum(), d => d.met)]);
console.log(x.domain());

const bubbles = selection
.selectAll('g.bubble')
.data(selection.datum())
.join("g")
.attr('class', 'bubble')
.attr(
'transform',
d => `translate(${x(d.met)},${(Math.random() * width) / 10})`
);

bubbles
.append('circle')
.attr('r', d => r(d.met))
.attr('fill-opacity', 0.3)
.attr('fill', 'red')
.attr('stroke', 'red')
.attr('stroke-width', 1);
}

return me;
}
Insert cell
_r = d3
.scaleSqrt()
.domain([0, d3.max(words, d => d.met)])
.range([0, 30])
.nice()
Insert cell
histogram = d3
.histogram()
.domain(_r.domain())
.thresholds(data => ss.ckmeans(data.map(d => d.met), 3).map(l => d3.min(l)))
.value(d => d.met)
Insert cell
bins = histogram(words)
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
ss = require("simple-statistics@7")
Insert cell

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.
Learn more