由于某种原因,average_on变量仅在resize事件上切换错误。
window.addEventListener('resize', resizeEmptyCanvas, true);
$("#update_graph").click(function(){
var cpu_on = document.getElementById('cpu_trending').checked ? "yes" : "no";
var ram_on = document.getElementById('ram_trending').checked ? "yes" : "no";$
var net_up_on = document.getElementById('net_up_trending').checked ? "yes" : "no";
var net_down_on = document.getElementById('net_down_trending').checked ? "yes" : "no";
var average_on = document.getElementById('average_trending').checked ? true : false;
var time_num = $('#select_time_num').val();
var time_unit = $('#select_time_unit').val();
var time_period = time_num + time_unit;
if (cpu_on=='yes'){
var canvas = document.getElementById('trending_graph_canvas');
canvas.width = window.innerWidth-80;
canvas.height = window.innerHeight/2-20;
var ctx = canvas.getContext('2d');
GetTrendCPU(time_period, function(data, server_time){
window.removeEventListener('resize', resizeEmptyCanvas, false);
window.removeEventListener('resize', resizeEmptyCanvas, true);
resizeCanvas(canvas, data, server_time, time_period, average_on);
window.addEventListener('resize', function(){
resizeCanvas(canvas, data, server_time, time_period, average_on);
}, true);
});
}
});
function GetTrendCPU(time_period, CallBack){
$.post("plugins/analytics/analytics_responder.php",
{get_time: true},
function(data){
var now_time = data;
$.post("plugins/analytics/analytics_responder.php",
{cpu_use_trending: true, time_period: time_period},
function(data){
if (data=='ERROR'){
CallBack('ERROR');
}else{
var cpu_trends = JSON.parse(data);
CallBack(cpu_trends, now_time);
}
}
);
}
);
}
function resizeCanvas(canvas, data, now, time_period, average) {
var ctx = canvas.getContext('2d');
canvas.width = window.innerWidth-80;
canvas.height = window.innerHeight/2-20;
DrawTrending(ctx, canvas.width, canvas.height, data, now, time_period, average);
}
错误是当调整大小画布运行时,average_on变量100%正确,但是当它在事件侦听器中运行时,80%不正确。问题是这个,这就是我需要的:
我认为问题与我有关,不想两次获取相同的数据(可能很多),但Ajax的异步行为可能需要它。抓两次数据太多了。
我怀疑如果我可以从函数GetTrendCPU返回sql结果它是可行的,但这似乎不可能与post。在这一点上,我已经尝试了100多种代码变体......似乎没有任何东西可以达到目的。
答案 0 :(得分:0)
这完美无瑕,但我不完全理解为什么我无法解释这一切。为了便于阅读,我将绘图功能与调整大小功能分开。我定义了日期(a),仔细注意不同范围的名称变量,以及(b)BIG假设事件将有效地自动覆盖旧事件(旧代码的无效假设......但是惊喜!它现在有效!)。有谁知道为什么?我现在有一个大问题......每当我按下update_graph时,它会使服务器陷入50-100%的CPU使用...每次按下都会越来越多,erg。
//Initialize Graph
var canvas_init = document.getElementById('trending_graph_canvas');
var ctx_init = canvas_init.getContext('2d');
canvas_init.width = window.innerWidth-80;
canvas_init.height = window.innerHeight/2-20;
var time_num_init = $('#select_time_num').val();
var time_unit_init = $('#select_time_unit').val();
var time_period_init = time_num_init + time_unit_init;
var show_points_init = document.getElementById('show_points').checked ? true : false;
var average_on_init = document.getElementById('average_trending').checked ? true : false;
GetTrendCPU(time_period_init, function(data, server_time){
resizeCanvas(canvas_init);
DrawTrending(ctx_init, canvas_init.width, canvas_init.height, data, server_time, time_period_init, average_on_init, show_points_init);
});
GetTrendCPU(time_period_init, function(data, server_time){
window.addEventListener('resize', function(){
resizeCanvas(canvas_init);
DrawTrending(ctx_init, canvas_init.width, canvas_init.height, data, server_time, time_period_init, average_on_init, show_points_init);
}, true);
});
//window.addEventListener('resize', resizeEmptyCanvas, true);
$("#update_graph").click(function(){
var cpu_on = document.getElementById('cpu_trending').checked ? "yes" : "no";
var ram_on = document.getElementById('ram_trending').checked ? "yes" : "no";$
var net_up_on = document.getElementById('net_up_trending').checked ? "yes" : "no";
var net_down_on = document.getElementById('net_down_trending').checked ? "yes" : "no";
var show_points = document.getElementById('show_points').checked ? true : false;
var average_on = document.getElementById('average_trending').checked ? true : false;
var time_num = $('#select_time_num').val();
var time_unit = $('#select_time_unit').val();
var time_period = time_num + time_unit;
var canvas = document.getElementById('trending_graph_canvas');
canvas.width = window.innerWidth-80;
canvas.height = window.innerHeight/2-20;
var ctx = canvas.getContext('2d');
if (cpu_on=='yes'){
GetTrendCPU(time_period, function(data, server_time){
resizeCanvas(canvas);
DrawTrending(ctx, canvas.width, canvas.height, data, server_time, time_period, average_on, show_points);
});
GetTrendCPU(time_period, function(data, server_time){
window.addEventListener('resize', function(){
resizeCanvas(canvas);
DrawTrending(ctx, canvas.width, canvas.height, data, server_time, time_period, average_on, show_points);
}, true);
});
}
if (ram_on=='yes'){
}
});