How would I develop something like this? Is it a VictoryBar?

FormidableLabs / victory

A collection of composable React components for building interactive data visualizations

http://commerce.nearform.com/open-source/victory/

Other

10.97k stars 526 forks source link

How would I develop something like this? Is it a VictoryBar? #2798

Closed airowe closed 7 months ago

airowe commented 7 months ago

Is there an existing issue for this?

[X] I have searched the existing issues

Code of Conduct

[X] I agree to follow this project's Code of Conduct

Question

I'm looking to develop something similar to this. I know this is accomplished using Victory Charts, but I don't know which component this is. Any direction would be appreciated!

carbonrobot commented 7 months ago

Here is an example of creating a horizontal stacked bar chart. The flyout component in your example above would need to be developed using a custom react svg component which is a little complex to cover here.

https://codesandbox.io/p/sandbox/victory-starter-forked-6cdckl

airowe commented 7 months ago

Thanks @carbonrobot! If I wanted to calculate the offset of the flyout component based on where its value sat in the axis, is there a way to do that intrinsically from the component itself?