lucid-ui
Version:
A UI component library from AppNexus.
32 lines (31 loc) • 1.65 kB
JavaScript
import React from 'react';
import createClass from 'create-react-class';
import { LineChart } from '../../../index';
const data = [
{ x: new Date('2015-01-01T00:00:00-08:00'), apples: 184, pears: 117 },
{ x: new Date('2015-01-02T00:00:00-08:00'), apples: 191, pears: 118 },
{ x: new Date('2015-01-03T00:00:00-08:00'), apples: 114, pears: 103 },
{ x: new Date('2015-01-04T00:00:00-08:00'), apples: 24, pears: 85 },
{ x: new Date('2015-01-05T00:00:00-08:00'), apples: 4, pears: 81 },
{ x: new Date('2015-01-06T00:00:00-08:00'), apples: 72, pears: 94 },
{ x: new Date('2015-01-07T00:00:00-08:00'), apples: 166, pears: 113 },
{ x: new Date('2015-01-08T00:00:00-08:00'), apples: 199, pears: 120 },
{ x: new Date('2015-01-09T00:00:00-08:00'), apples: 141, pears: 108 },
{ x: new Date('2015-01-10T00:00:00-08:00'), apples: 46, pears: 89 },
{ x: new Date('2015-01-11T00:00:00-08:00'), apples: 0, pears: 80 },
{ x: new Date('2015-01-12T00:00:00-08:00'), apples: 46, pears: 89 },
{ x: new Date('2015-01-13T00:00:00-08:00'), apples: 142, pears: 108 },
{ x: new Date('2015-01-14T00:00:00-08:00'), apples: 199, pears: 120 },
{ x: new Date('2015-01-15T00:00:00-08:00'), apples: 165, pears: 113 },
];
const style = {
paddingTop: '5rem',
};
export default createClass({
render() {
return (React.createElement("div", { style: style },
React.createElement(LineChart, { data: data, margin: {
right: 80,
}, width: 800, hasLegend: true, yAxisFields: ['apples'], yAxisColorOffset: 3, y2AxisFields: ['pears'], y2AxisColorOffset: 4 })));
},
});