line.jsx

class Line extends React.Component {
    static contextTypes = {
        xScale: React.PropTypes.func,
        yScale: React.PropTypes.func
    };

    render() {
        let path = d3.svg.line()
                         .interpolate("basis")
                         .x(d => this.context.xScale(d.x))
                         .y(d => this.context.yScale(d.y));

        return (
            <path d={path(this.props.data)}
                  stroke={this.props.color}
                  strokeWidth={this.props.width}
                  fill="none" />
        );
    }
}