CODEWITHSUNDEEP
bar-chartc3.js
cjr
cjr

Reputation: 520

c3 getting bar length and width or x/y coordinates

I was looking into a using c3 as a rendering library. Explorer the API, I found a requirement that might not be doable with c3.

What I intend to is create custom layover of a c3 bar chart as I want to be able to add customization to the axis labels and other aspects of the chart. To do so, I need to be able to access the width and height(or the x/y coordinates) of each bar so I can align my overlay correctly. I don't see a way from the c3 API to get this information.

Is this possible to do?

Thanks!

Upvotes: 0

Views: 1477

Answers (1)

mgraham
mgraham

Reputation: 6207

  1. You can access a chart's x and y scales via its 'internal' property to calculate points from the same data that was used to generate the bar chart as per this answer -->

How do I use/retrieve the C3 scale function post generate?

  1. If you want the coordinates of the rendered bars you can select them all with d3.selectAll(".c3-bar"), - replace 'd3' with a particular svg selection if you have multiple charts - but as they are path elements rather than rects you'd have to do some parsing of the path's 'd' attribute (d for path info, not data) to get useful x/y coords out of them

Bear in mind in both cases the returned numbers will be offsets to some 'g' element container

Upvotes: 2

Related Questions