react-d3 / react-d3-shape

react-d3 shapes, such as line, scatter, bar, bar stack ... and more.
24 stars 40 forks source link

Interpolation support #4

Open Guibod opened 8 years ago

Guibod commented 8 years ago

Line have an interpolate property but never use it. This is a must for line charts.

Guibod commented 8 years ago

For the record, I achieve Monotone implementation this way:

import { Line } from 'react-d3-shape';
import { line, curveMonotoneX } from 'd3-shape';

export default class MyLine extends Line {
  _setAxes(data) {
    const {
      xScaleSet,
      yScaleSet
    } = this.props;

    const x = line()
      .x((d) => { return xScaleSet(d.x) })
      .y((d) => { return yScaleSet(d.y) })
      .curve(curveMonotoneX);

    return x.call(this, data);
  }
}