Home › Forums › Chart Support › What kind of chart I need for this type of json? › Reply To: What kind of chart I need for this type of json?
Nevermind. I got it.
I filtered it this way
jQuery(document).ready(function ($) {
// get calculate yesterday as a date
var start = new Date();
start.setHours(0,0,0,0);
if (jQuery('#chartContainer-hourly').length == 1) {
var chart = new CanvasJS.Chart("chartContainer-hourly",{
title:{
text:"Ajax action logs - 24 hours"
},
axisX: {
valueFormatString: "HH:mm",
// interval: 1,
intervalType: "hour",
minimum: start.setHours(0,0,0,0),
},
toolTip: {
shared: true
},
data: []
});
$.getJSON("/wp-content/uploads/ajax-log.json", function(data) {
chart.options.data = [];
var occurrences = data.reduce( (acc, obj) => {
// date = (obj.timestamp - (obj.timestamp % (24 * 60 * 60)))*1000; // to group by date
date = (obj.timestamp - (obj.timestamp % (24 * 60 * 60))); // to group by date
// date = obj.timestamp;
// console.log(obj.timestamp);
acc[obj.ajax_action] = acc[obj.ajax_action] ? acc[obj.ajax_action] : {};
acc[obj.ajax_action][date] = (acc[obj.ajax_action][date] || 0)+1
return acc;
}, {} )
for(var actions in occurrences) {
var dataPoints = [];
for(var key in occurrences[actions]) {
// check if timestamp is today
var inputDate = new Date(parseInt(key));
var todaysDate = new Date();
if (inputDate.setHours(0,0,0,0) == todaysDate.setHours(0,0,0,0)) {
console.log("TODAY IS TODAY");
dataPoints.push({ x: parseInt(key), y: occurrences[actions][key]});
}
}
chart.options.data.push({
type: "line",
showInLegend: true,
name: actions,
xValueType: "dateTime",
xValueFormatString: "HH mm",
dataPoints: dataPoints
});
}
chart.render();
});
}
});
Screenshot: https://www.screencast.com/t/XftpmDAkZJX
Thank you again for all of your help! YOu are the best!