Search code examples
d3.jsjsfiddle

Convert a D3 v3 Grouped bar chart to v4 Y Axis labels


I'm trying convert https://bl.ocks.org/mbostock/3887051 which is v3 to v4

I have it working apart from the y axis

https://jsfiddle.net/andytela/xqkrdzq4/1/

The ticks aren't appearing. The values appear to be coming back from the y.domain but are not appearing

Can any one help?


Solution

  • You were scaling the y-axis using the wrong equation, also you're missing the styling for the text to show up.

    var yAxis = d3.axisLeft(y)
       .ticks(10)
    
    
    text {
      fill: black;
    }
    

    I've corrected the jsfiddle here: https://jsfiddle.net/xqkrdzq4/3/

    Hope this helps.