{"size": 1410, "ext": "js", "max_stars_repo_path": "src/Components/Chart/data/HmdtData.js", "max_stars_repo_name": "pedro742k2/bee-project", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "src/Components/Chart/data/HmdtData.js", "max_issues_repo_name": "pedro742k2/bee-project", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "src/Components/Chart/data/HmdtData.js", "max_forks_repo_name": "pedro742k2/bee-project", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": null, "max_issues_count": null, "max_forks_count": null, "avg_line_length": 23.1147540984, "max_line_length": 66, "alphanum_fraction": 0.5382978723}
// import Hours from "../Hours";
import { Line } from "react-chartjs-2";

const HmdtData = ({ ApHv, hmdt, readingsDate, chartOptions }) => {
  const data = {
    labels: readingsDate,
    datasets: [
      {
        label: `Hive #${ApHv} Humidity`,
        data: hmdt,

        backgroundColor: "rgba(27, 176, 255, 0.2)",
        borderColor: "#1BB0FF",
        fill: true,
        lineTension: 0.2,
        borderCapStyle: "butt",
        borderDash: [],
        borderDashOffset: 0.0,
        borderJoinStyle: "miter",
        pointBorderColor: "#fff",
        pointBackgroundColor: "#004AA6",
        pointBorderWidth: 1,
        pointHoverRadius: 5,
        pointHoverBackgroundColor: "#004AA6",
        pointHoverBorderColor: "#fff",
        pointHoverBorderWidth: 2,
        pointRadius: 1,
        pointHitRadius: 10,
      },
    ],
  };

  return (
    <Line
      data={data}
      options={{
        maintainAspectRatio: chartOptions.maintainAspectRatio,

        scales: chartOptions.scaleOptions,

        title: {
          display: chartOptions.displayTitle,
          text: "Humidity (%)",
          fontSize: 34,
          fontColor: "#fff",
        },

        legend: {
          display: chartOptions.displayLegend,
          position: chartOptions.legendPosition,
          labels: {
            fontColor: "#fff",
          },
        },
      }}
    />
  );
};

export default HmdtData;
