Horizontal floating bar chart with Typescript and chart.js v3.1.1

[davidbroglie]

I'm trying to make an horizontal bar chart with chart.js v3.1.1 and Typescript.

I'm facing an issue with the data in dataset and the type of data. I tried to do the provided example in the documentation... But the type of the data I get from that example is not working. And I can't find a type that works...

Here is what I tried :

First try with

   const labels = ['Jan', 'Fev', 'Mar', 'Avr']
   const conf: ChartConfiguration = {
     type: 'bar',
     data: {
       datasets: [
         {
           data: [[3,5], [1,3], [2,3], [4,6]],
           label: 'Test',
           backgroundColor: '#FF0000',
         },
       ],
       labels: labels,
     },
     options: {
       indexAxis: 'y',
       responsive: true,
       maintainAspectRatio: false,
       plugins: {
         legend: {
           position: 'top',
         },
         title: {
           display: true,
           text: 'Chart.js Floating Bar Chart',
         },
       },
     },
   } 

I expected to have 4 bars in the chart but I have a type error with the data : Type '[number, number]' is not assignable to type 'number | ScatterDataPoint | BubbleDataPoint | null'.

So then I tried to reproduce the example in the documentation :

data: labels.map(() => {
        return [Utils.rand(-100, 100), Utils.rand(-100, 100)];
      }),

And I do have this error : Type 'number[][]' is not assignable to type '(number | ScatterDataPoint | BubbleDataPoint | null)[]'.

I can't find a type that works properly... Does anybody can help me with that problem ?