sparklines(rawData)
sparklines = (dataset) => {
var data = dataParser(dataset);
const svg = d3.create("svg")
.attr("viewBox", [0, 0, 14, 1])
.attr("width", 75)
.attr("height", 25);
const bar = svg.append("g")
.attr("fill", "steelblue")
.selectAll("rect")
.data(data)
.join("rect")
.attr('class', 'bar')
.attr("x", (d, i) => x(i))
.attr("y", d => y(d.value))
.attr("height", d => y(0) - y(d.value))
.attr("width", BAR_WIDTH);
return svg.node();
}
x = d3.scaleLinear().domain([0, DATA_COUNT]).range([0, 14]);
y = d3.scaleLinear().domain([0, DATA_MAX]).range([height, 0]);
DATA_COUNT = dataParser(rawData).length
DATA_MAX = {
var max = 0;
for(var i = 0; i < rawData.data.length; i++){
if(max < rawData.data[i].news_count) {
max = rawData.data[i].news_count;
}
}
return max;
}
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.
