javascript - jqplot 每小时事件数
问题描述
我有一个从中获取的数组
<div style='hidden' id=dataHours data-hours='{"08":3,"10":3,"11":1,"12":1,"14":2,"16":2,"18":1}'>
它被转换为 json 数组。
我想使用 jqplot 创建一个矩阵,其中 x 轴为小时,y 轴为事件数。
我目前尝试这段代码:
var json_data = $('#dataHours').data('hours');
var dateHoursArray = $.map(json_data, function(value, index) {
return [[index,value]];
});
console.log(dateHoursArray);
$.jqplot('maindiv', dateHoursArray, {
legend: {
show:true,
location : 'ne'
},
title: 'Tickets created per hour',
animate: true,
animateReplot: true,
axes: {
xaxis: {
label:'Hours',
autoscale: true,
min:0,
max:23,
rendererOptions: {
tickRenderer:$.jqplot.CanvasAxisTickRenderer
},
tickOptions: {
formatString:'%.0f'
}
},
yaxis: {
label:'Tickets',
autoscale: true
}
},
highlighter: {
sizeAdjust: 7.5
},
cursor: {
show: false
},
grid: {
gridLineColor: '#cccccc',
background: '#fff',
borderColor: '#000',
borderWidth: 2.0,
shadow: false,
}
});
但它并没有像我期望的那样工作。
任何人?
解决方案
逻辑。
创建了一个 24 小时的数组并遍历数组以增加匹配时间的计数器:
/*
Calculate max tickets per hour on 24 hours using tickets within specific period
*/
$date_sums = [0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0]; // 24 hours of 0
if(!empty($ticket_array)) {
foreach ($ticket_array AS $ticket) {
$hour = date("G", strtotime($ticket["ticket_created_date"]));
if (!empty($ticket["ticket_created_date"])) {
$date_sums[$hour] += 1;
} // end if
} // end foreach
foreach ($date_sums AS $sum => $value) {
$dates_sum[] = $value;
}
} // end if
然后对 base64_encoded json_encoded $dates_sum 数组进行 Javascript 处理:
var json_data = $('#dataHours').data('hours');
var json_data = JSON.parse(atob(json_data)); //base64 decode and make into javascript object
var dateHoursArray = [Array.from(json_data)];
在 Array.from 的最后一行花了我一些试验和错误;)
推荐阅读
- java - 数组还是数组列表?
- android - 使用 Fragment 内的方法更改 TextView 值 (NullPointerException)
- python - How to capture Ctrl+D when you have already typed soemthing in raw_input but have not pressed enter yet?
- asp.net - ASP.NET MVC app gives 404 on all routes after deleting and re-adding it in IIS
- automation - Cypress CI integration with GitHub
- python - 从 Python3.7 导入 pytest 而不是 2.7
- javascript - How do I route my application back to the home page from a form using React?
- vba - VBA Word - 根据第一个字母格式化单词的颜色
- excel - 根据名称在文件夹中查找下一个文件
- ruby-on-rails - 在谷歌云上托管一个 ruby 网络