summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorRichard Wall <richard@aziz>2010-04-18 23:01:08 +0100
committerRichard Wall <richard@aziz>2010-04-18 23:01:08 +0100
commit4d4fa4722b83a726471c39f8313dd157ed3a230b (patch)
treef664a72c4cfcc76e2dda6f551c280e00117ea2d0
parent391e8c019e581ac781b189515be41791d147dc31 (diff)
A create charts from recipe dicts
-rw-r--r--index.html132
-rw-r--r--jrrd.js20
2 files changed, 79 insertions, 73 deletions
diff --git a/index.html b/index.html
index 5a56fd8..b935840 100644
--- a/index.html
+++ b/index.html
@@ -74,9 +74,8 @@
<script type="text/javascript">
var baseOptions = {
-
grid: {
- clickable: true,
+ clickable: false,
borderWidth: 1,
borderColor: "#000",
color: "#000",
@@ -101,92 +100,79 @@
}
};
- var fillOptions = jQuery.extend(true, {
+ var stacked = {
series: {
stack: true,
lines: {
fill: 0.5
}
}
- }, baseOptions);
-
- function cpuChartFactory(title, template) {
- template.find('.title').text(title);
- var c = new jrrd.Chart(template.find('.chart'), fillOptions);
- data = 'cpu-user.rrd cpu-system.rrd cpu-wait.rrd'.split(' ').reverse();
-
- jQuery.each(data, function(i, el) {
- var label = el.split('.')[0].split('-')[1];
- c.addData('cpu0-' + label, new jrrd.RrdQueryRemote('data/cpu-0/' + el));
- c.addData('cpu1-' + label, new jrrd.RrdQueryRemote('data/cpu-1/' + el));
- });
- return c;
- }
-
- function memoryChartFactory(title, template) {
- template.find('.title').text(title);
- var c = new jrrd.Chart(template.find('.chart'), fillOptions);
- data = 'memory-free.rrd memory-cached.rrd memory-used.rrd memory-buffered.rrd'.split(' ').reverse();
+ };
- jQuery.each(data, function(i, el) {
- var url = 'data/memory/' + el;
- var label = el.split('.')[0].split('-')[1];
- c.addData(label, new jrrd.RrdQueryRemote(url));
- });
- return c;
- }
+ var recipes = [
+ {
+ title: 'CPU Usage',
+ data: [
+ ['data/cpu-0/cpu-wait.rrd', 0, 'CPU-0 Wait', 'Jiffies'],
+ ['data/cpu-1/cpu-wait.rrd', 0, 'CPU-1 Wait', 'Jiffies'],
+ ['data/cpu-0/cpu-system.rrd', 0, 'CPU-0 System', 'Jiffies'],
+ ['data/cpu-1/cpu-system.rrd', 0, 'CPU-1 System', 'Jiffies'],
+ ['data/cpu-0/cpu-user.rrd', 0, 'CPU-0 User', 'Jiffies'],
+ ['data/cpu-1/cpu-user.rrd', 0, 'CPU-1 User', 'Jiffies']
+ ],
+ options: jQuery.extend(true, {}, baseOptions, stacked)
+ },
- function dnsChartFactory(title, template) {
- template.find('.title').text(title);
- var c = new jrrd.Chart(template.find('.chart'), baseOptions);
- data = 'dns_opcode-Query.rrd dns_qtype-A.rrd dns_qtype-PTR.rrd dns_rcode-NOERROR.rrd'.split(' ').reverse();
+ {
+ title: 'Memory',
+ data: [
+ ['data/memory/memory-buffered.rrd', 0, 'Buffered', 'Byte'],
+ ['data/memory/memory-used.rrd', 0, 'Used', 'Byte'],
+ ['data/memory/memory-cached.rrd', 0, 'Cached', 'Byte'],
+ ['data/memory/memory-free.rrd', 0, 'Free', 'Byte']
+ ],
+ options: jQuery.extend(true, {}, baseOptions, stacked)
+ },
- jQuery.each(data, function(i, el) {
- var url = 'data/dns/' + el;
- var label = el.split('.')[0].split('_')[1];
- c.addData(label, new jrrd.RrdQueryRemote(url));
- });
- return c;
- }
+ {
+ title: 'DNS Queries',
+ data: [
+ ['data/dns/dns_opcode-Query.rrd', 0, 'Opcode Query', 'Q/sec'],
+ ['data/dns/dns_qtype-A.rrd', 0, 'A Queries', 'Q/sec'],
+ ['data/dns/dns_qtype-PTR.rrd', 0, 'PTR Queries', 'Q/sec'],
+ ['data/dns/dns_rcode-NOERROR.rrd', 0, 'NOERROR', 'Q/sec']
+ ],
+ options: jQuery.extend(true, {}, baseOptions)
+ },
- function loadChartFactory(title, template) {
- template.find('.title').text(title);
- var c = new jrrd.Chart(template.find('.chart'), baseOptions);
- var data = new jrrd.RrdQueryRemote('data/load/load.rrd');
- var rrdDSs = ['shortterm', 'midterm', 'longterm'];
- jQuery.each(rrdDSs, function(i, rrdDS) {
- c.addData(rrdDS, new jrrd.RrdQueryDsProxy(data, rrdDS));
- });
- return c;
- }
+ {
+ title: 'Load Average',
+ data: [
+ ['data/load/load.rrd', 'shortterm', 'Short Term', ''],
+ ['data/load/load.rrd', 'midterm', 'Medium Term', ''],
+ ['data/load/load.rrd', 'longterm', 'Long Term', '']
+ ],
+ options: jQuery.extend(true, {}, baseOptions)
+ },
- function nicChartFactory(title, template, nicname) {
- template.find('.title').text(title);
- var c = new jrrd.Chart(template.find('.chart'), baseOptions);
- var data = new jrrd.RrdQueryRemote('data/interface/if_octets-' + nicname + '.rrd');
- var rrdDSs = ['tx', 'rx'];
- jQuery.each(rrdDSs, function(i, rrdDS) {
- c.addData(rrdDS, new jrrd.RrdQueryDsProxy(data, rrdDS));
- });
- return c;
- }
+ {
+ title: 'Wlan0 Throughput (B/sec)',
+ data: [
+ ['data/interface/if_octets-wlan0.rrd', 'tx', 'Transmit', 'B'],
+ ['data/interface/if_octets-wlan0.rrd', 'rx', 'Receive', 'B']
+ ],
+ options: jQuery.extend(true, {}, baseOptions)
+ },
+ ];
$(function() {
- var cc = new jrrd.ChartCoordinator($('.chartRangeControl'));
var chartTemplate = $('.chart-container').remove();
- cc.charts = [
- loadChartFactory('Load Average',
- chartTemplate.clone().appendTo('.charts')),
-
- nicChartFactory('Wlan0 Throughput',
- chartTemplate.clone().appendTo('.charts'), 'wlan0'),
- cpuChartFactory('CPU',
- chartTemplate.clone().appendTo('.charts')),
-
- memoryChartFactory('Memory',
- chartTemplate.clone().appendTo('.charts'))
- ];
+ var cc = new jrrd.ChartCoordinator($('.chartRangeControl'));
+ cc.charts = jQuery.map(recipes, function(recipe, i) {
+ return jrrd.Chart.fromRecipe(
+ chartTemplate.clone().appendTo('.charts'), recipe);
+ });
$('.charts').bind("plotselected", function(event, ranges) {
cc.setTimeRange(new Date(ranges.xaxis.from),
diff --git a/jrrd.js b/jrrd.js
index d49212a..5e723d3 100644
--- a/jrrd.js
+++ b/jrrd.js
@@ -326,6 +326,26 @@ jrrd.Chart.prototype.draw = function() {
}, this);
};
+
+jrrd.Chart.fromRecipe = function(template, recipe) {
+ template.find('.title').text(recipe['title']);
+ var c = new jrrd.Chart(template.find('.chart'), recipe['options']);
+ var dataDict = {};
+ var ds, label, rrd, unit;
+ for(var i=0; i<recipe['data'].length; i++) {
+ rrd = recipe['data'][i][0];
+ ds = recipe['data'][i][1];
+ label = recipe['data'][i][2];
+ unit = recipe['data'][i][3];
+ if(typeof dataDict[rrd] == 'undefined') {
+ dataDict[rrd] = new jrrd.RrdQueryRemote(rrd);
+ }
+ c.addData(label, new jrrd.RrdQueryDsProxy(dataDict[rrd], ds));
+ }
+ return c;
+}
+
+
jrrd.ChartCoordinator = function(ui) {
this.ui = ui;
this.charts = [];