simple bar widget (d9ad763b) · Commits · github_fork / Clip

web/fnordmetric.css

+0 −1

Original line number	Diff line number	Diff line
		@@ -361,7 +361,6 @@ position: relative;
		.rickshaw_graph .y_grid .tick { stroke:rgba(0,0,0,.15); stroke-dasharray:0; }
		.rickshaw_graph .y_ticks text { fill:#333333; }


		.modal_backdrop {
		background-color: #000000;
		position: fixed;

web/haml/distribution_gauge.haml

+3 −1

Original line number	Diff line number	Diff line
		@@ -40,14 +40,16 @@

		:gaugejs

		FnordMetric.ui.resizable('.report_view');

		FnordMetric.widgets.barsWidget().render({
		title: "Fnord!!!!",
		color: "#{FnordMetric::COLORS.last}",
		elem: $('.widget_histogram_bars'),
		height: 320,
		values: #{@histogram.histogram(@opts[:histogram]).map{ \|r,v\| [r.first, v] }.to_json}
		});

		FnordMetric.ui.resizable('.report_view');



		No newline at end of file

web/js/fnordmetric.bars_widget.js

+5 −21

Original line number	Diff line number	Diff line
		@@ -14,6 +14,7 @@ FnordMetric.widgets.barsWidget = function(){
		draw_layout();

		width = opts.elem.width() - 50;
		console.log(width);
		height = opts.height \|\| 240;

		gconfig = {
		@@ -80,14 +81,15 @@ FnordMetric.widgets.barsWidget = function(){
		$(".rickshaw_legend", opts.elem).html("");

		gconfig.series = [{
		name: "Fnord",
		color: "#0066CC",
		name: opts.title,
		color: opts.color,
		data: []
		}];

		for(var n=0; n < values.length; n++){
		gconfig.series[0].data.push({
		x: values[n][0],
		x: n,
		label: values[n][0],
		y: values[n][1]
		});
		}
		@@ -99,24 +101,6 @@ FnordMetric.widgets.barsWidget = function(){
		element: $('.legend', opts.elem)[0]
		});

		hoverDetail = new Rickshaw.Graph.HoverDetail( {
		graph: graph
		});

		shelving = new Rickshaw.Graph.Behavior.Series.Toggle({
		graph: graph,
		legend: legend
		});

		highlighter = new Rickshaw.Graph.Behavior.Series.Highlight({
		graph: graph,
		legend: legend
		});

		new Rickshaw.Graph.Axis.Time({
		graph: graph,
		}).render();

		new Rickshaw.Graph.Axis.Y({
		graph: graph,
		}).render();

web/vendor/rickshaw.fnordmetric.js

+19 −7

Original line number	Diff line number	Diff line
		@@ -1443,6 +1443,10 @@ Rickshaw.Graph.HoverDetail = Rickshaw.Class.create({
		var element = this.element = document.createElement('div');
		element.className = 'detail';

		if(args.no_detail){
		element.className = 'detail no_detail';
		}

		this.visible = true;
		graph.element.appendChild(element);

		@@ -2078,7 +2082,7 @@ Rickshaw.Graph.Renderer.Bar = Rickshaw.Class.create( Rickshaw.Graph.Renderer, {
		defaults: function($super) {

		var defaults = Rickshaw.extend( $super(), {
		gapSize: 0.05,
		gapSize: 0.10,
		unstack: false,
		} );

		@@ -2089,6 +2093,7 @@ Rickshaw.Graph.Renderer.Bar = Rickshaw.Class.create( Rickshaw.Graph.Renderer, {
		initialize: function($super, args) {
		args = args \|\| {};
		this.gapSize = args.gapSize \|\| this.gapSize;
		this.xPadding = args.xPadding \|\| 50;
		$super(args);
		},

		@@ -2103,14 +2108,15 @@ Rickshaw.Graph.Renderer.Bar = Rickshaw.Class.create( Rickshaw.Graph.Renderer, {
		},

		barWidth: function() {

		var stackedData = this.graph.stackedData \|\| this.graph.stackData();
		var data = stackedData.slice(-1).shift();

		var frequentInterval = this._frequentInterval();
		var barWidth = this.graph.x(data[0].x + frequentInterval.magnitude * (1 - this.gapSize));

		return barWidth;
		console.log(stackedData);

		return ((this.graph.width - (this.xPadding * 2)) / data.length);
		},

		render: function() {
		@@ -2129,20 +2135,26 @@ Rickshaw.Graph.Renderer.Bar = Rickshaw.Class.create( Rickshaw.Graph.Renderer, {

		if (series.disabled) return;

		var xpad = this.xPadding;

		var seriesBarDrawWidth = parseInt(seriesBarWidth * (1 - this.gapSize));

		if(parseInt(seriesBarWidth) == seriesBarDrawWidth){
		seriesBarDrawWidth -= 1;
		}

		var nodes = graph.vis.selectAll("path")
		.data(series.stack)
		.enter().append("svg:rect")
		.attr("x", function(d) { return graph.x(d.x) + barXOffset })
		.attr("x", function(d) { return xpad + (d.x * seriesBarWidth) })
		.attr("y", function(d) { return graph.y(d.y0 + d.y) })
		.attr("width", seriesBarWidth)
		.attr("width", seriesBarDrawWidth)
		.attr("height", function(d) { return graph.y.magnitude(d.y) });

		Array.prototype.forEach.call(nodes[0], function(n) {
		n.setAttribute('fill', series.color);
		} );

		if (this.unstack) barXOffset += seriesBarWidth;

		}, this );
		},

Admin message