Victory
HTML
<script src="//fb.me/react-dom-0.14.3.js"></script>
<script src="https://npmcdn.com/victory/dist/victory.min.js"></script>
<div id="app"></div>
Babel + JSX
/*
Available components:
VictoryAnimation
VictoryArea
VictoryAxis
VictoryBar
VictoryChart
VictoryGroup
VictoryLine
VictoryLabel
VictoryPie
VictoryScatter
VictoryStack
VictoryTransition
*/
const {VictoryAxis, VictoryArea} = Victory;
const app = document.getElementById('app');
ReactDOM.render(
<svg width={400} height={400}>
<VictoryAxis
width={400}
height={400}
domain={[-10, 10]}
crossAxis={true}
offsetY={200}
standalone={false}/>
<VictoryAxis dependentAxis
width={400}
height={400}
domain={[-10, 10]}
crossAxis={true}
offsetX={200}
standalone={false}/>
<VictoryArea
style={{ data: {
fill: "none", stroke: "black"
}}}
data={[
{x: 0, y: 0},
{x: 3, y: 3},
{x: 3, y: 0},
{x: 3, y: 0},
{x: 0, y: 0},
]}
domain={[-10, 10]}
//domain={x: [-10, 10], y: [-10, 10]}
/>
</svg>
, app
);