You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
74 lines
1.9 KiB
74 lines
1.9 KiB
/**
|
|
* 绘制关键项图表
|
|
*/
|
|
|
|
|
|
|
|
/*var keyBoxTemplate = Handlebars.compile('../widget/keyBox.handlebars');*/
|
|
|
|
function _plotKeyBox(eid, data) {
|
|
var source = $("#box").html();
|
|
var keyBoxTemplate = Handlebars.compile(source);
|
|
var today = data.chartData[data.chartData.length - 1][1];
|
|
var yesterday = data.chartData[data.chartData.length - 2][1];
|
|
|
|
var chain = yesterday != 0 ? Math.floor(((today - yesterday) / yesterday) * 1000) / 10 : 0;
|
|
var isChainUp = chain > 0;
|
|
var id = '_kbox_' + eid;
|
|
var content = keyBoxTemplate({
|
|
panelColor: isChainUp ? 'panel-red' : 'panel-green',
|
|
id: id,
|
|
title: data.title,
|
|
today: today,
|
|
chain: chain + '%',
|
|
chainArrow: isChainUp ? 'fa-arrow-up' : 'fa-arrow-down'
|
|
});
|
|
$('#' + eid).html(content);
|
|
|
|
//$.plot($('#' + id), [{
|
|
$.plot($('#' + eid), [{
|
|
data: data.chartData
|
|
}], {
|
|
xaxes: [{
|
|
mode: 'time',
|
|
show: false
|
|
}],
|
|
yaxes: [{
|
|
show: false
|
|
}],
|
|
shadowSize: 0,
|
|
grid: {
|
|
borderWidth: 0
|
|
},
|
|
colors: [ isChainUp ? "#d9534f" : "#5cb85c"]
|
|
});
|
|
}
|
|
|
|
function setupKeyBox(pid, url, args) {
|
|
// 构造eid，创建div
|
|
var uris = url.split("/");
|
|
var eid = 'id_' + uris[uris.length - 1]; // 取url最后的一段
|
|
//$('#' + pid).append('<div class="row" id="'+eid+'"></div>');
|
|
|
|
$.getJSON(url, args, function(data){
|
|
if (data.ret != 0) {
|
|
console.log("ajax " + url + " fail: " + data.ret + ", " + data.msg);
|
|
return;
|
|
}
|
|
|
|
console.log(data)
|
|
for (var i = 1; i < data.columns.length; ++i) {
|
|
var chartData = [];
|
|
for (var j = 0; j < data.data.length; ++j) {
|
|
chartData.push([(new moment(data.data[j][0], "YYYY-MM-DD")).valueOf(), data.data[j][i]]);
|
|
}
|
|
var subid = eid + "_" + i;
|
|
$('#' + eid).append('<div class="col-lg-3 col-md-4" id="' + subid + '"></div>');
|
|
_plotKeyBox(subid, { title: data.columns[i], chartData: chartData });
|
|
}
|
|
});
|
|
}
|
|
|
|
function setupKeyBoxDefault(url, args) {
|
|
setupKeyBox('page-wrapper', url, args);
|
|
}
|
|
|