Chartjs-Could not find a declaration file for module chartjs-plugin-stacked100

0👍

I managed to make it work:

  • Create a global.d.ts and declare the module
  • Use the Bar component

Content of global.d.ts:

declare module 'chartjs-plugin-stacked100';

declare module 'chartjs-plugin-stacked100'{
    export function ChartjsPluginStacked100(): function
}

Use of Bar:

import { Chart, Bar } from 'react-chartjs-2';
import ChartjsPluginStacked100 from 'chartjs-plugin-stacked100';

Chart.register(ChartjsPluginStacked100);

const ChartData = (props: any) => {
    return <>
    {
      <div>
        <Bar
          data={{
            labels: ["Foo", "Bar"],
            datasets: [
              { label: "bad", data: [5, 25], backgroundColor: "rgba(244, 143, 177, 0.6)" },
              { label: "better", data: [15, 10], backgroundColor: "rgba(255, 235, 59, 0.6)" },
              { label: "good", data: [10, 8], backgroundColor: "rgba(100, 181, 246, 0.6)" }]
          }}
          options={{
            indexAxis: "y",
            plugins: {
              stacked100: { enable: true }
            }
          }} />
      </div>
    }
</>
};
export default ChartData

I updated the documentation and requested a pull at: https://github.com/y-takey/chartjs-plugin-stacked100/pull/48 , where I wrote a small sample React app that uses the plugin.

Leave a comment