我正在使用Meteor和ReactJS创建一个应用程序 . 我有一个我订阅的集合和客户端,我想基于集合中的数据呈现 ChartJS Polar Area 图表 .

问题是每当我更新集合时,新数据和旧数据都会出现在图表上(当我悬停时,我会得到两个不同的段,旧数据和新数据) .

这是我的代码:

ChartComponent = React.createClass({

    mixins: [ReactMeteorData],

    getMeteordata() {
      let data = Meteor.subscribe("sentiment");
      return {
        chartData: [
          {
            value: MyCollection.find({"item": "test1"}).count(),
            color: "green",
            label: "Test1"
          },
          {
            value: MyCollection.find({"item": "test2"}).count(),
            color: "yellow",
            label: "Test2"
          },
          {
            value: MyCollection.find({"item": "test3"}).count(),
            color: "red",
            label: "Test3"
          } 
        ]
      }
    },

    _drawGraph() {
      let ctx = document.getElementById("my-canvas").getContext("2d");
      let polarChart = new Chart(ctx).Polararea(this.data.chartData, {
         animateScale: true,
      });

      return polarChart;
    },


    componentDidMount() {
      this._drawGraph();
    },


    componentDidUpdate() {
      this._drawGraph().update();
    },


    render() {
      return <canvas id="my-canvas"></canvas>
    }
});

帮助将不胜感激 . 非常感谢你!

Note:

我正在使用反应版本0.14 . 由于一些api更改,官方的react-chartjs组件不起作用 .