如何使用 Chart.js 3.0.0 在 React 上下文中访问 Chart.helpers.color？

Question

我已经设法弄清楚如何在React应用程序中导入和注册新chart.js 3.0.0的模型，但我不知道如何使用Chart.helpers.color。这是我的导入和注册：

import React from 'react';
import { Chart, Tooltip, CategoryScale, LinearScale, Title } from 'chart.js';
import { Matrix, MatrixController } from 'chartjs-chart-matrix';

Chart.register(Tooltip, CategoryScale, LinearScale, Title, Matrix, MatrixController);

然而，当我调用 Chart.helpers.color 时，如下所示：

        datasets: [{
            label: 'My Matrix',
            data: chartData,
            backgroundColor(context) {
                const value = context.dataset.data[context.dataIndex].v;
                const alpha = Math.log10(value) / 4;
                    return Chart.helpers.color('green').alpha(alpha).rgbString();
            },
            ...

应用程序抛出 TypeError：chart_js__WEBPACK_IMPORTED_MODULE_1__.Chart.helpers 未定义

有人知道如何让这个 React 应用程序到达 Chart.helpers 吗？谢谢！（或者，当然，欢迎使用替代方案！这是为了使用 alpha 来表示值来绘制热图。）

Answer 1

我弄清楚了这一点，我将发布答案，因为这花了我几天的时间才弄清楚。我在 Chart.js 存储库上找到了关于它的简介：

https://github.com/chartjs/Chart.js/blob/master/docs/docs/developers/publishing.md

所以在我的例子中，我在顶部：

import React from 'react';
import { Chart, Tooltip, CategoryScale, LinearScale, Title } from 'chart.js';
import { color } from 'chart.js/helpers';
import { Matrix, MatrixController } from 'chartjs-chart-matrix';
Chart.register(Tooltip, CategoryScale, LinearScale, Title, Matrix, MatrixController);

然后我以这种方式访问​​ Chart.helpers.color ：

return color('green').alpha(alpha).rgbString();