Holiday Notice: Support will be provided on a limited scale from December 24th, 2024, to January 2nd, 2025. Happy holidays and a wonderful New Year!


Topic: Line Chart Modification

Nitin.Chanana free asked 5 years ago


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


Aliaksandr Andrasiuk staff answered 5 years ago


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.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue

  • ForumUser: Free
  • Premium support: No
  • Technology: MDB React
  • MDB Version: 4.13.0
  • Device: Desktop
  • Browser: Chrome
  • OS: Windows 10
  • Provided sample code: No
  • Provided link: No