Master's student, developer, designer. :)
Published
Edited
Aug 16, 2019
chartBandScale = {
const svg = d3.select(DOM.svg(width, height))
.attr('width', width + margin.left)
.attr('height', height + margin.bottom)
svg.append('g')
.attr('transform', 'translate(0,' + height + ')')
.call(d3.axisBottom(x_scale_band))
return svg.node()
}
x_scale_band = d3.scaleBand()
.rangeRound([0, width - margin.left])
.domain(data.band)
data = ({
band: ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J']
})
chartLinearScale = {
const svg = d3.select(DOM.svg(width, height))
.attr('width', width + margin.left)
.attr('height', height + margin.bottom)
svg.append('g')
.attr('transform', 'translate(0,' + height + ')')
.call(d3.axisBottom(x_scale_linear))
return svg.node()
}
x_scale_linear = d3.scaleLinear()
.domain([0, 1000])
.range([0, width-margin.right])
margin = ({ top: 50, right: 32, bottom: 50, left: 16})
height = 32
d3 = require('d3@5')
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.
