如何将chartjs-chart-financial与chart js集成

Question

我想使用

chartjs-chart-financial

来绘制“烛台”图表。但是，

chartjs-chart-financial

尚未发布到 npm。我在包含来自

https://github.com/chartjs/chartjs-chart-financial

的克隆存储库的目录中运行

npm install

，然后运行 gulp build。构建后，我在

dist

文件夹中看到 Chartjs-chart-financial.js。但是，我不知道如何将其与基础

chart.js

库集成，以便我可以在图表上指定

type: candlestick

。我还没有找到任何可以证明这一点的例子..

自从我在 React 工作以来，我目前正在使用

react-chartjs-2

作为

chart.js

的包装：

import React, { Component } from 'react';
import Chart from '../node_modules/chart.js/dist/chart';

class Financial extends Component {
    constructor() {
        super();
        this.myRef = React.createRef();
    }

    componentDidMount() {
        const ctx = this.myRef.current;
        this.myChart = new Chart(ctx, {
            type: 'bar',
            data: {
                labels: ["A", "B", "C"],
                datasets: [{
                    label: 'Test',
                    data: [12, 20, 15],
                    backgroundColor: 'gray'
                }]
            }
        });
    }
    
    render() {
        return (
            <canvas ref={this.myRef}/>
        );
    }
}

export default Financial;

如您所见，我现在正在渲染类型为

bar

的示例图表。我希望能够使用“candlestick”类型及其关联的数据集。

我将不胜感激任何帮助！！

Answer 1

我在 vueJs 项目上也有同样的问题。错误是：“candlestick”不是注册控制器。 我花了几天时间来解决这个错误，但没有任何效果，有人可以帮助我吗？