From 5f10a21baf8889294d457481a56f3bfcd31d4f60 Mon Sep 17 00:00:00 2001 From: Richard Wall Date: Tue, 20 Apr 2010 01:07:46 +0100 Subject: Add more DNS stats and experiment with a different legend position. --- index.html | 46 ++++++++++++++++++++-------------------------- jrrd.js | 8 +++++--- 2 files changed, 25 insertions(+), 29 deletions(-) diff --git a/index.html b/index.html index f8d5299..ec111cc 100644 --- a/index.html +++ b/index.html @@ -47,7 +47,7 @@ overflow:hidden; } - .legendColorBox, .legendLabel { + .legendLabel { cursor: pointer; } @@ -92,6 +92,10 @@ backgroundColor: "#fff", tickColor: "#eee" }, + legend: { + position: 'nw', + noColumns: 2 + }, selection: { mode: 'x' }, @@ -147,12 +151,22 @@ }, { - title: 'DNS Queries', + title: 'DNS Query Types', + data: [ + ['data/dns/dns_qtype-A.rrd', 0, 'A', 'Q/sec'], + ['data/dns/dns_qtype-PTR.rrd', 0, 'PTR', 'Q/sec'], + ['data/dns/dns_qtype-SOA.rrd', 0, 'SOA', 'Q/sec'], + ['data/dns/dns_qtype-SRV.rrd', 0, 'SRV', 'Q/sec'] + ], + options: jQuery.extend(true, {}, baseOptions) + }, + + { + title: 'DNS Return Codes', 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'] + ['data/dns/dns_rcode-NOERROR.rrd', 0, 'NOERROR', 'Q/sec'], + ['data/dns/dns_rcode-NXDOMAIN.rrd', 0, 'NXDOMAIN', 'Q/sec'], + ['data/dns/dns_rcode-SERVFAIL.rrd', 0, 'SERVFAIL', 'Q/sec'] ], options: jQuery.extend(true, {}, baseOptions) }, @@ -211,26 +225,6 @@

To get this demo working, you will need to serve this page from a local webserver and serve the folder that contains your RRD files.

-

This demo is designed to work with the RRD files generated by - Collectd.

-

Debian / Ubuntu Quick Start

-
-# Install and configure collectd (enable the rrd plugin)
-$ aptitude install collectd
-
-# Create a project folder and check out the code
-$ mkdir ~/Projects
-$ cd ~/Projects
-$ bzr branch lp:~richardw/+junk/rrd2flot
-$ cd rrd2flot
-
-# Link to the collectd rrd folder
-$ ln -s /var/lib/collectd/rrd/localhost data
-
-# Start a local webserver
-$ aptitude install twisted
-$ twistd -n web --port 8080 --path .
-            
diff --git a/jrrd.js b/jrrd.js index 3f9070a..62ebce6 100644 --- a/jrrd.js +++ b/jrrd.js @@ -257,8 +257,8 @@ jrrd.Chart = function(template, options) { // Listen for clicks on the legend items - onclick enable / disable the // corresponding data source. - $('.legend tr', this.template[0]).live('click', function(e) { - self.switchDataEnabled($(this).children('.legendLabel').text()); + $('.legend .legendLabel', this.template[0]).live('click', function(e) { + self.switchDataEnabled($(this).text()); self.draw(); }); @@ -402,7 +402,9 @@ jrrd.Chart.prototype.draw = function() { unit = ''; for(i=0; i