Display another chart on click of a bar in React
I have designed a bar chart. When I click on a particular bar I need another chart to be displayed on the same page.
Check out these three links for a better understanding.
a) https://codesandbox.io/s/highcharts-react-demo-ovx90
b) https://www.highcharts.com/demo/column-drilldown
c) https://js.devexpress.com/Demos/WidgetsGallery/Demo/Charts/ChartsDrillDown/React/Light/
Check the below example .
- constants.js — Here I have initialized all the graph configurations like graph height, font size, legends, etc.
2) chart.js — Here I am converting backend data into the drilldown chart format and passing it to drilldown chart component.
3) drilldownChart.js — Plotting chart after receiving data
Output