reactjs - 用 reactjs 和 chart.js 绘制饼图

Question

我正在尝试使用一些虚拟数据绘制饼图。我的反应图表组件如下所示：-

import React, {Component} from 'react';

import {Bar,Line,Pie} from 'react-chartjs-2';

class Chart extends Component {
    constructor(props){
        super(props);
        this.state = {
            chartData :props.chartData
        }
        console.log("props data ",props.chartData)
    }

    render(){
        return(
            <Pie 
            data={this.state.chartData}
            options={{
                title:'cool pie chart',
                text:"coolest data"
            }}
            />
        );
    }
}

export default Chart;

而且我认为传递给组件的数据也绝对没问题。

但目前我只能绘制标签。像这样：-

我错过了什么？

Answer 1

使用react-chartjs而不是react-chartjs-2. 它就像一个魅力

在此处查看现场演示 - https://stackblitz.com/edit/react-p2bb24?embed=1&file=index.js