zoomable timeseries gauges (aa92f776) · Commits · github_fork / Clip

V1.0-ROADMAP

+3 −2

Original line number	Diff line number	Diff line
		@@ -39,17 +39,18 @@ ROADMAP


		> Timeseries Gauge
		- timeseries-gauge/widget: set resolution via "tick buttons"
		X timeseries-gauge/widget: set resolution via "tick buttons"
		- timeseries-gauge: realtime tab w/ moving average
		- timeseries-widget: tooltip -> show key noun
		- timeseries-gauge: calculate option (sum, average, progressive_sum)
		- timeseries-gauge: incr_counter / incr_divisor for avg
		X timeseries-gauge: incr_counter / incr_divisor for avg
		- timeseries-gauge: overview realtime gauge
		- timeseries-gauge: overview series weights
		- timeseries-gauge: overview all numbers
		- timeseries-gauge: punchcards
		- timeseries-gauge: cmp. w/yesterday option
		- display trends
		- restrict to max resolution


		> Distribution Gauge

lib/fnordmetric/defaults.rb

+1 −0

Original line number	Diff line number	Diff line
		FnordMetric::COLORS = ["#4572a7", "#aa4643", "#89a54e", "#80699b", "#3d96ae", "#db843d"].reverse
		FnordMetric::TICKS = [60, 300, 1200, 3600, 86400]

		FnordMetric::DEFAULT_PROC = lambda{ \|arg\|

lib/fnordmetric/gauges/timeseries_gauge.rb

+2 −4

Original line number	Diff line number	Diff line
		@@ -18,6 +18,7 @@ class FnordMetric::TimeseriesGauge < FnordMetric::Gauge
		colors = FnordMetric::COLORS.dup

		@series = Hash.new
		@zooms = [tick, FnordMetric::TICKS.select{ \|t\| t > tick }].flatten.uniq

		@opts[:series].each do \|series\|
		ts = FnordMetric::Timeseries.new
		@@ -28,14 +29,11 @@ class FnordMetric::TimeseriesGauge < FnordMetric::Gauge

		@series[series] = {
		:color => colors.unshift(colors.pop).first,
		:data => [ ts.timeseries(interval, 3600), ts.timeseries(interval, tick) ],
		:data => Hash[@zooms.map{ \|int\| [int, ts.timeseries(interval, int) ] }],
		:data_block => lambda{ \|c,d\| c }
		}
		end

		@series_render = []
		@series_numbers = []

		render_page(:timeseries_gauge)
		end

web/haml/timeseries_gauge.haml

+7 −4

Original line number	Diff line number	Diff line
		.report_view

		%h1= @opts[:title]
		%h1= @opts[:title] \|\| @opts[:key]
		%h3 Timeseries Gauge

		%ul.ui_tabs.tabs
		@@ -24,7 +24,7 @@

		.resizable(data-width="40" style="border-right:1px solid #ddd;")
		.headbar.small Series Values
		- @series_numbers.each do \|series, nums\|
		- [].each do \|series, nums\|
		.clearfix.numbers_container(style="width:auto; float:none; margin-right:20px;")
		.title.with_swatch
		.swatch(style="background:#{@series_colors[series]};")
		@@ -39,17 +39,20 @@
		.headbar.small Series Weights



		:gaugejs

		FnordMetric.ui.resizable('.report_view');
		FnordMetric.util.updateNumbers('.report_view', 4);

		FnordMetric.widgets.timeseriesWidget().render({
		title: "Fnord!!!!",
		title: "#{key_nouns.last}",
		elem: $('.widget_timeseries'),
		height: 420,
		default_style: 'stack',
		series_resolutions: #{@zooms.to_json},
		series: [#{@series.map{ \|k,s\|
		"{ name: #{k.to_json}, color: '#{s[:color]}', data: #{s[:data][0].to_json(&s[:data_block])} }"
		dat = s[:data].map{ \|k,d\| "data#{k}: #{d.to_json(&s[:data_block])}" }
		"{ name: #{k.to_json}, color: '#{s[:color]}', #{dat * ","} }"
		} * ","}]
		});

web/js/fnordmetric.timeseries_widget.js

+29 −1

Original line number	Diff line number	Diff line
		@@ -10,7 +10,7 @@ FnordMetric.widgets.timeseriesWidget = function(){
		*/

		var widget_uid = "fnord-" + parseInt(Math.random()*99990000);
		var width, height, opts, graph, gconfig, legend, hoverDetail, shelving, highlighter;
		var width, height, opts, graph, gconfig, legend, hoverDetail, shelving, highlighter, resolution;

		var cardinal = true;
		var xticks = 30;
		@@ -88,6 +88,14 @@ FnordMetric.widgets.timeseriesWidget = function(){
		}
		}

		function apply_resolution(){
		if(!resolution){ resolution = opts.series_resolutions[0]; }

		for(ind in gconfig.series){
		gconfig.series[ind].data = gconfig.series[ind]["data"+resolution];
		}
		}

		function draw_layout(){
		$(opts.elem)
		.append(
		@@ -176,6 +184,22 @@ FnordMetric.widgets.timeseriesWidget = function(){
		);
		}

		if(opts.series_resolutions){
		$('.headbar', opts.elem).append('<div class="tick_btns btn_group"></div>');
		for(ind in opts.series_resolutions){
		var _tick = opts.series_resolutions[ind];
		$('.tick_btns', opts.elem).append(
		$('<div></div>').attr('class', 'button tick').append($('<span></span>')
		.html(FnordMetric.util.formatTimeRange(_tick)))
		.attr('data-tick', _tick)
		.click(function(){
		resolution = $(this).attr('data-tick');
		renderChart();
		})
		);
		}
		}

		if((opts.autoupdate) && (opts.async_chart)){
		var secs = parseInt(opts.autoupdate);
		if(secs > 0){
		@@ -200,6 +224,10 @@ FnordMetric.widgets.timeseriesWidget = function(){
		$(gconfig.element).html("");
		$(".rickshaw_legend", opts.elem).html("");

		if(opts.series_resolutions){
		apply_resolution();
		}

		graph = new Rickshaw.Graph(gconfig);

		legend = new Rickshaw.Graph.Legend({

Admin message