如何在Reactjs的饼图中动态显示json数据?

时间:2017-04-27 10:48:53

标签: reactjs

如何在Reactjs的饼图中动态显示json数据?

我的PieChart课程如下:

import React, { Component } from 'react';
import {Pie} from 'react-chartjs-2';

const data = {
   labels: [
    'Red',
    'Green',
    'Yellow'
   ],
   datasets: [{
      data: [300, 50, 100],
      backgroundColor: [
        '#FF6384',
        '#36A2EB',
        '#FFCE56'
   ],
   hoverBackgroundColor: [
     '#FF6384',
     '#36A2EB',
     '#FFCE56'
   ]
 }]
};

export default class PieChart extends Component {

  render() {
     return (
       <div>
         <h2>PieChart</h2>
         <Pie height="100px" data={data} />
       </div>
     );
  }

}

0 个答案:

没有答案