Line Chart Modification


Topic: Line Chart Modification

Nitin.Chanana pro premium asked 5 days ago

I want to change the increment behavior of Line Chart's Axis bar, Currently its increasing by 0.5, Please help me out...


Hi,

You should pass an object with needed properties to options prop to Line chart component. Options may look the next way :

let options = {
      scales: {
          yAxes: [{
              ticks: {
                  max: 100,
                  min: 0,
                  stepSize: 5
              }
          }],
      }

In the code above I set the increment to change by 5, the minimum set to 0, the maximum set to 100.

Now you should pass this object to the options property of <Line> component:

<Line data={this.state.dataLine} options={options} />

Hope this info was helpful.

Best regards.


Please insert min. 20 characters.
Status

Answered

Specification of the issue
  • User: Pro
  • Premium support: Yes
  • Technology: React
  • MDB Version: 4.13.0
  • Device: Desktop
  • Browser: Chrome
  • OS: Windows 10
  • Provided sample code: No
  • Provided link: No