lucid-ui
Version:
A UI component library from AppNexus.
23 lines (22 loc) • 1.18 kB
JavaScript
import _ from 'lodash';
import React from 'react';
import createClass from 'create-react-class';
import { LineChart, Legend, chartConstants } from '../../../index';
const data = [
{ x: new Date('2015-01-01T00:00:00-08:00'), apples: 2, oranges: 3, pears: 1 },
{ x: new Date('2015-01-02T00:00:00-08:00'), apples: 2, oranges: 5, pears: 6 },
{ x: new Date('2015-01-03T00:00:00-08:00'), apples: 3, oranges: 2, pears: 4 },
{ x: new Date('2015-01-04T00:00:00-08:00'), apples: 5, oranges: 6, pears: 1 },
];
const yAxisFields = ['apples', 'oranges', 'pears'];
const palette = chartConstants.PALETTE_MONOCHROME_2_5;
const style = {
paddingTop: '8rem',
};
export default createClass({
render() {
return (React.createElement("div", { style: style },
React.createElement(LineChart, { data: data, yAxisFields: yAxisFields, yAxisTitle: 'Fruit Count', palette: palette, width: 800 }),
React.createElement(Legend, { style: { verticalAlign: 'top' } }, _.map(yAxisFields, (field, i) => (React.createElement(Legend.Item, { key: field, hasPoint: true, hasLine: true, color: palette[i % palette.length], pointKind: i }, field))))));
},
});