map = Plot.plot({
margin: 0,
width: plotWidth,
height: plotWidth / 790 * 540,
x: {
label: null,
ticks: null
},
y: {
label: null,
ticks: null
},
color: {
type: 'threshold',
range: ['#d9d9d9', '#fdd0a2', '#fdae6b', '#fd8d3c', '#e6550d', '#d94801'],
domain: [0, 0.15, 0.3, 0.45, 0.6],
},
marks: [
Plot.cell(plotData, {
x: stateX,
y: stateY,
fill: 'share',
rx: 10
}),
Plot.text(plotData, {
x: stateX,
y: stateY,
fontWeight: 'bold',
text: d => `${d.state}\n${valueFormat(d[outcome])}`
})
]
})
plotWidth = Math.min(width, 790)
viewof threshold = Inputs.range(thresholdExtent, {
label: 'Paid less than ($/hr)',
step: 1,
value: 17
})
file = FileAttachment("low_wage_data_states@6.csv")
fileUrl = file.url()
ohqUser = 'economic-policy-institute-ws'
viewof outcome = Inputs.radio(new Map([
['Share of workers', 'share'],
['Number of workers', 'count']
]), {
label: 'Display',
value: 'share',
})
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.
