Skip to content

Instantly share code, notes, and snippets.

@gallirohik
Created January 30, 2019 13:11
Show Gist options
  • Save gallirohik/9909736f7fc029b217831a9fd448ff87 to your computer and use it in GitHub Desktop.
Save gallirohik/9909736f7fc029b217831a9fd448ff87 to your computer and use it in GitHub Desktop.
Dashboard project
import React from "react";
import {
XYPlot,
XAxis,
YAxis,
VerticalGridLines,
HorizontalGridLines,
LineSeries
} from "react-vis";
function LineChart(props) {
const dataAttr = props.chartData.map(d => {
return { x: d.year + "/" + d.quarter, y: parseFloat(d.count / 1000) };
});
return (
<React.Fragment>
<h1>LineChart</h1>
<XYPlot xType="ordinal" height={500} width={800}>
<XAxis />
<YAxis />
<VerticalGridLines />
<HorizontalGridLines />
<LineSeries
data={dataAttr}
style={{ stroke: "yellow", strokeWidth: 3 }}
/>
</XYPlot>
</React.Fragment>
);
}
export default LineChart;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment