search

plouc / nivo

nivo provides a rich set of dataviz components, built on top of the awesome d3 and React libraries
https://nivo.rocks
MIT License
13.19k stars 1.03k forks source link

Add support for biaxial charts #172

Closed dragosdydy closed 1 year ago

dragosdydy commented 6 years ago

Hello,

I have looked around, i have checked the docs, I can't still figure out how to do a biaxial line chart. I have added the axisRight, but it is possible to use different key for that axis ? I am looking for something that Left Axis is the line chart for 1 value and the Right Axis is a line for other type of value.

It is achievable with Nivo? I could show some examples if needed. Thank you.

emedranoh19a commented 1 year ago

Hey guys I found this one here! The only problem is the crosshair. https://codesandbox.io/s/github/juanalb/nivo-biaxial-chart-with-toolitp/tree/master/?file=/src/App.js

ginchauspe commented 1 year ago

Hello, sorry for not responding before 🤦 here is the code of the component I created for this case, basically is just a layer that we add to the bar chart: https://github.com/devgateway/seeds-dashboard/blob/develop/ui/src/embeddable/chart/BarAndLineChart/index.jsx In this layer we use D3 directly to draw the line and we can add tooltips too. Look for "LineLayer"

stale[bot] commented 1 year ago

This issue has been automatically marked as stale. If this issue is still affecting you, please leave any comment (for example, "bump"), and we'll keep it open. We are sorry that we haven't been able to prioritize it yet. If you have any new additional information, please include it with your comment!

stale[bot] commented 1 year ago

Closing this issue after a prolonged period of inactivity. If this issue is still present in the latest release, please create a new issue with up-to-date information. Thank you!

madze commented 1 year ago

Just want to add a bump for this if it's not too late. Thanks!

anotheri commented 1 year ago

bump

antoniobrandao commented 11 months ago

Bump

kongsynft commented 9 months ago

would love to see this implemented. for now i'll try to stack multiple charts and see how it goes

LeopoldArkham commented 6 months ago

Also manifesting interest for this

JennieCrowel commented 4 months ago

bump

an8ar commented 1 month ago

@plouc I'm working on adding a custom layer (a curve with its own axes) to a bar chart. To ensure proper alignment, I account for the left and right margins of the bar chart so the curve and its axes fit within the layout.

Is this approach the right way to handle it, or would it be better to overlay multiple graphs (drawing the bar chart and the curve on top of each other)? Would love feedback on which method is more efficient or robust for this use case.

dep commented 3 days ago

Lets keep the new thread going 😁

https://github.com/plouc/nivo/issues/2666