TypeError of datalabels in case stacked100 is enabled

[arunfancraze]

@simonbrunel @y-takey I am facing 1 problem, while writing it in typescript. I am getting a typeError Property 'calculatedData' does not exist on type 'ChartData<keyof ChartTypeRegistry, (number | ScatterDataPoint | BubbleDataPoint | null)[], unknown>' You can see the screenshot attached below.

Originally posted by @arunfancraze in https://github.com/chartjs/chartjs-plugin-datalabels/issues/89#issuecomment-1645405415

[y-takey]

@arunfancraze Although I haven't tested it, I think you can achieve a simple solution using the following approach:

import type { ExtendedChartData } from 'chartjs-plugin-stacked100';

formatter: (value, context) {
  const data = context.dataset.data[context.dataIndex] as ExtendedChartData;
}

[Arun-chaitanya]

Hi @y-takey, This solution works. You can mark this as closed. Thanks.

[y-takey]

Hi @Arun-chaitanya, Thank you for trying it out! I'm glad it worked and the issue was resolved. :) but, it seems that I am unable to close it due to insufficient permissions.

[simonbrunel]

I would say it's an issue with the chartjs-plugin-stacked100 package which should probably augment the ChartData core type. @y-takey Maybe you could try something like that in your types.ts:

import {ChartData} from 'chart.js';

declare module 'chart.js' {
  interface ChartData< 
    TType extends ChartType = ChartType,
    TData = DefaultDataPoint<TType>,
    TLabel = unknown
  > {
    calculatedData?: number[][];
    originalData?: PluginDataPoint[];
  }
}

// Backward compatibility
export type ExtendedChartData = ChartData; 

[y-takey]

@simonbrunel Thank you for the advice. I would like to try it when I have some time! :)