Closed deepanshk closed 2 years ago
Hi @deepanshk,
Thank you for contacting us!
The scrollbar feature is a Highcharts Stock only, so import highstock
to use it:
import Highcharts from "highcharts/highstock";
Example: https://codesandbox.io/s/highcharts-react-demo-rxk0nb?file=/demo.jsx
For basic Highcharts you can use scrollablePlotArea
.
Example: https://codesandbox.io/s/highcharts-react-demo-fork-6socue?file=/demo.jsx API Reference: https://api.highcharts.com/highcharts/chart.scrollablePlotArea
Best regards!
Working for me 👍 Thanks for the information @ppotaczek
import Highcharts from "highcharts"; import HighchartsReact from "highcharts-react-official";
const config = { chart: { type: "column", marginLeft: 150, }, title: { text: "Most popular ideas by April 2016", }, subtitle: { text: 'Source: UserVoice', }, xAxis: { type: "category", title: { text: null, }, min: 0, max: 4, scrollbar: { enabled: true, }, tickLength: 0, }, yAxis: { min: 0, max: 1200, title: { text: "Votes", align: "high", }, }, plotOptions: { bar: { dataLabels: { enabled: true, }, }, }, legend: { enabled: false, }, credits: { enabled: false, }, series: [ { name: "Votes", data: [ ["Gantt chart", 1000], ["Autocalculation and plotting of trend lines", 575], ["Allow navigator to have multiple data series", 523], ["Implement dynamic font size", 427], ["Multiple axis alignment control", 399], ["Stacked area (spline etc) in irregular datetime series", 309], ["Adapt chart height to legend height", 278], ["Export charts in excel sheet", 239], ["Toggle legend box", 235], ["Venn Diagram", 203], ["Add ability to change Rangeselector position", 182], ["Draggable legend box", 157], ["Sankey Diagram", 149], ["Add Navigation bar for Y-Axis in Highcharts Stock", 144], ["Grouped x-axis", 143], ["ReactJS plugin", 137], ["3D surface charts", 134], ["Draw lines over a stock chart, for analysis purpose", 118], ["Data module for database tables", 118], ["Draggable points", 117], ], }, ], };
`const DoubleBarGraph = () => { return ( <div style={{ width: "500px" }}>
}; export default DoubleBarGraph;`