Chart.js

HTML

<script src="https://cdn.jsdelivr.net/npm/[email protected]"></script>
<canvas id="myChart"></canvas>

JavaScript

var records = [
	{humidity: '252', temps: 'Mar ,2019'}, 
  {humidity: '1024', temps: 'Mar ,2019'},
	{humidity: '1024', temps: 'Mar ,2019'},
	{humidity: '1024', temps: 'Mar ,2019'},
	{humidity: '1024', temps: 'Mar ,2019'},
];
var humidities = [];
var temps = [];
records.forEach(item => {
	humidities.push(item.humidity);
	temps.push(item.temps);
});
var ctx = document.getElementById('myChart').getContext('2d');
new Chart(ctx, {
	type: 'line',
  data: {
  	labels: temps,
    datasets: [{
    	label: 'TeamA score',
      backgroundColor: 'blue',
      borderColor: 'lightblue',
      fill: false,
      lineTension: 0,
      pointRadius: 5,
      data: humidities
		}]
	},
  options: {
  	title: {
    	display: true,
      position: "top",
      text: "Line Graph",
      fontSize: 18,
      fontColor: "#111"
		},
    legend: {display: true, position: "bottom"}
	}
});