Basic D3 Selection in ObservablePulsesSVG Dots Drawing BoardBarsAdjustable Pie ChartSimple Bars with D3 V3 in ObservableWorld Population Growth MapsAnimated Temperature Line ChartWeather Metric HistogramAccessible Humidity Histogram with TooltipDew Point and Humidity Correlation ScatterplotDaily Temperature Line Chart for One Year
Play with d3-array
d3 = require('d3@5')
af_quantile = [0, 10, 11, 12, 13, 14, 30]
d3.quantile(af_quantile, 0.5)
d3.quantile(af_quantile, 0.25)
af_extent = [1,2,3,4,5]
d3.extent(af_extent)
d3.extent(af_extent, (d) => d * 2)
af_deviate = [2,4,6,9,10]
d3.deviation(af_deviate)
af_scan = [1,3,5,7,10,56,12]
scan_index = d3.scan(af_scan, (a,b) => b - a)
af_scan[scan_index]
af_bisect = [1, 2, 7, 4, 5]
d3.bisect(af_bisect)
d3.bisectLeft(af_bisect)
af_bisector = [
{ date: new Date(2011, 1, 1), value: 0.5 },
{ date: new Date(2011, 2, 1), value: 0.6 },
{ date: new Date(2011, 3, 1), value: 0.7 },
{ date: new Date(2011, 4, 1), value: 0.8 }
]
bisectDate = d3.bisector(function(d) {
return d.date;
}).right
d3.merge([[1, 2], [3], [5]])
af_transpose = [[1,2], [3,4]]
d3.transpose(af_transpose)
af_zip = [[1, 2], [3, 4]]
d3.zip(af_zip)
histogram = d3.histogram()
af_histo = [1, 3, 5, 7]
histogram(af_histo)
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.
