Cent get the y axis up right

Hi @angelplaiesu ,

Are you trying to display the y-axis on the right side of the bar ? Did you try using axisRight?

Yes i did , it didnt work

No on the left but is form max to min ,not from min to max
Its dysplayed the wrong way

In that case check the range of your yScale, you could just swap the values in the range.

i didit swap the range

Just checked your code link above,

const yScale = d3
		.domain([0, gpaMAx])
		.range([0, h - padding]);  <--  0 here refers to the top left most point and h-padding is the lowermost point on the y-axis

the range limits have to be reversed i.e.
.range([h - padding,0]);

Note: the top left corner of the document is considered to be the point ( 0 , 0 ), so give the range accordingly.

then this happnds

Check the parameters you are giving to the height and y co-ordinate of the rect shapes:

.attr("height", (d) => yScale(d[1]))
.attr("y", (d) => h - yScale(d[1]) - padding)

the values should be swapped i.e
height = h - yScale(d[1]) - padding ← try removing h, or , and padding to see the difference
and y = yScale(d[1])

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.