用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