The avatar for @ssiegmund
Sascha Siegmund
Published
playgrounds
Edited
Oct 18, 2020
2 stars
playgrounds
chord diagram playgroundarc diagram playgroundstreamgraph playgroundstacked area playgroundcircle packing playgrounddendogram / tree playgroundpie chart playgrounddonut chart playgroundtreemap playgroundradial barchart playgroundparallel coordinates playgroundradar chart playgroundbar chart playgroundbubble chart playgroundcorrelogram playgroundheatmap playgroundridgeline playgroundoverlapping density playgroundbox plot playgroundsankey diagram playgroundviolin plot playgroundline chart playgroundbeeswarm playground
hexbin playground
contour playgroundhistogram playgroundscatter plot playground
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
hexbinData.centers()
Insert cell
hexbinData.mesh()
Insert cell
hexbinData.hexagon()
Insert cell
hexbinData(data)
Insert cell
hexbinData = {
// config
const radius = 14
// ---
const x = d3.scaleLinear()
.domain(d3.extent(data, d => d.x))
.range([margin.left, width - margin.right])
const y = d3.scaleLinear()
.domain(d3.extent(data, d => d.y))
.range([height - margin.bottom, margin.top])
const hexbin = d3.hexbin()
.x(d => x(d.x))
.y(d => y(d.x))
.radius(radius * width / height)
.extent([[margin.left, margin.top],[width - margin.right, height - margin.bottom]])
return hexbin
}
Insert cell
data[0]
Insert cell
data = d3.csv(await "https://raw.githubusercontent.com/holtzy/D3-graph-gallery/master/DATA/data_for_density2d.csv", ({x, y, group}) => ({x: +x, y: +y, group: group}) )
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
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