React Base Fiddle (JSX)

Starting point for creating JSFiddles with React. This uses React with Addons.

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.24/browser.js"></script>
<script src="https://npmcdn.com/react/dist/react-with-addons.min.js"></script>
<script src=" https://npmcdn.com/react-dom/dist/react-dom.min.js"></script>
<script src=" https://npmcdn.com/react-dom/dist/react-dom-server.min.js"></script>
<script src=" https://npmcdn.com/recharts/umd/Recharts.min.js"></script>
<script src="https://facebook.github.io/react/js/jsfiddle-integration-babel.js"></script>

<div id="container">
  <!-- This element's contents will be replaced with your component. -->
</div>

CSS

body {
  margin: 0;
}

#container {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  padding: 10px;
  width: 800px;
  height: 800px;
  background-color: #fff;
}

JavaScript 1.7

const { ScatterChart, Scatter, ResponsiveContainer, CartesianGrid, XAxis, YAxis, ReferenceLine } = Recharts;

const data = [
{ "time":0.05817155032154009, "vector":0.06563621627258454 },
{ "time":0.14315886348050588, "vector":0.062210285741210125 },
{ "time":0.5967064634166004, "vector":0.01605826475495209 },
{ "time":0.6249457357246515, "vector":0.7245687450939806 },
{ "time":0.8945037075260627, "vector":0.6265964837819882 },
];

function shape() {
    return null;
}

const NowLine = React.createClass({
    render() {

        const { now } = this.props;
        return (
            <ReferenceLine x={now} stroke="blue" strokeDasharray="3 3" label="Current" />
        )
    }
})

const Chart  = React.createClass({

    render() {
        const { now } = this.props;
        return (
            <ResponsiveContainer width="100%" height={400}>
                <ScatterChart >
                    <CartesianGrid strokeDasharray="3 3" />
                    <Scatter name="vector" data={data} fill='#8884d8'
                        line
                        shape={shape} />
                    <XAxis dataKey="time" name="time" unit="seconds" label="seconds" domain={[0, 1]} />
                    <YAxis dataKey="vector" unit="g" name="acceleration" />
                    <ReferenceLine x={0.5} stroke="red" strokeDasharray="3 3" label="Crash" />
                    <NowLine now={now} />
                </ScatterChart>
            </ResponsiveContainer>
        )
    }
});

ReactDOM.render(
  <Chart />,
  document.getElementById('container')
);