[Chartjs]-How to use Chart.js with Typescript without getting assignable errors?

by

2👍

Had the same issue but I have found a solution for this

You will need to import the LinearTickOptions from ‘chart.js’ as well

import { Chart, LinearTickOptions } from 'chart.js';

You will then need to create a variable that holds this information

xAxisTickOptions: LinearTickOptions = {
  min: 0,
  stepSize: 0.02,
};

You will need to separate variables if the use X and Y with different step values (obviously)

from there we can go and just reference the variable in the options object

xAxes: [
       {
         type: 'linear', //optional
         ticks: this.xAxisTickOptions,
         ...
        }
      ]

Everything should resolve itself from there. My best guess at this reason is because the Axes implement TickOptions | LinearTickOptions | ... . So it will just grab hold of the first option unless you want to implement the whole LinearTickOptions interface in the tick object

Hope this helps 🙂

Leave a comment