用 reactjs 和 chart.js 绘制饼图答案

【问题标题】：plotting pie chart with reactjs and chart.js用 reactjs 和 chart.js 绘制饼图
【发布时间】：2018-02-09 07:11:41
【问题描述】：

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

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;

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

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

我错过了什么？

【问题讨论】：

标签： reactjs chartjs-2.6.0

【解决方案1】：

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

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

【讨论】：