- Expert Data Visualization
- Jos Dirksen
- 106字
- 2025-04-04 19:31:10
Adding a y-axis with absolute income
For this axis, we don't do anything special:
function addAxis(yIncomeScale, yIndexedScale, xScale, xRangeAdjusted) {
...
var rightAxis = d3.axisRight().scale(yIncomeScale).ticks(20);
var rightAxisSVG = chart.append("g")
.attr('transform', 'translate( ' + (width + 4) + ')')
.call(rightAxis);
...
}
We just create d3.axisRight based on the yIncomeScale, and ask for twenty ticks. When we add this axis, we position the axis using the transform attribute and position it a little bit farther to the right to leave some room for the labels of the x-axis.
The axis on the left side will take some more work, since we're going to customize that a bit.