如何使用react-chartjs创建动态宽度的LineChart？

Question

我正在尝试创建一个动态宽度的LineChart，但是只得到了第一个值。

<LineChart data = {this.state.dataLine} options = {{}} width={this.state.widthChart} height = "250" />

Answer 1

我不确定如何在react-chartjs中实现这一点，但在react-vis中很容易做到这一点，这一点也很相似。

import React from 'react';

import {
  XAxis,
  YAxis,
  FlexibleWidthXYPlot,
  HorizontalGridLines,
  LineSeries
} from 'react-vis';

export default class Example extends React.Component {
  render() {
    return (
      <FlexibleWidthXYPlot
        height={300}>
        <HorizontalGridLines />
        <YAxis />
        <XAxis />
        <LineSeries data={myData}/>
      </FlexibleWidthXYPlot>
    );
  }
}

有关更多信息，请查看此处http://uber.github.io/react-vis/#/documentation/api-reference/flexible-plots