1

正在使用来自link的 react-chartjs 。演示中给出了很好的示例，但是任何地方都没有提到需要传递的dataand 。options正在使用 flotjs 饼图并发送与下面相同的数据和选项，但它似乎不起作用？是否css/less需要添加任何内容以使图形正常，或者输入数据有任何问题？

var chartData=[   {label: "Series 0",data: 1},
                  {label: "Series 1",data: 3},
                  {label: "Series 2",data: 9},
                  {label: "Series 3",data: 20}
              ];

var chartOptions={ series: { pie: { show: true } }, 
                   grid  : { hoverable: true }, 
                  tooltip: true,
              tooltipOpts: { content: "%p.0%, %s", shifts: {x: 20,y: 0},                   
                             defaultTheme: false }};

<PieChart data={chartData} options={chartOptions} width="600" height="250"/>

此外，在现有组件中导入 chart.js 和 React。谁能告诉我是否chartData正确chartOptions？

4

2 回答 2

0

假设您使用的是react-chartjs的 master 分支，它们的文档链接到 Chart.js V2。

但是，该库使用 Chart.js V 1.1.1。可以在此处找到该文档Chart.js 文档 V 1.1.1。

于 2016-10-31T21:19:56.733 回答
0

经过一些幕后调试后，我发现我们应该使用chartData而不是数据属性，而是值：

var chartData=[{label: "Series 0",value: 1},
               {label: "Series 1",value: 3},
               {label: "Series 2",value: 9},
               {label: "Series 3",value: 20}];
于 2017-11-12T20:46:46.110 回答