Dashboard project

lineChart.jsx

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;