/**
* collection4 - collection.js
- * Copyright (C) 2010 Florian octo Forster
+ * Copyright (C) 2010-2013 Florian octo Forster
*
* This program is free software; you can redistribute it and/or
* modify it under the terms of the GNU Lesser General Public
* Boston, MA 02110-1301 USA
*
* Authors:
- * Florian octo Forster <ff at octo.it>
+ * Florian octo Forster <octo at collectd.org>
**/
var c4 =
{
- instances: []
+ instances: new Array (),
+ config:
+ {
+ width: 324,
+ height: 200
+ }
};
-function instance_get_params (graph) /* {{{ */
+function value_to_string (value) /* {{{ */
+{
+ var abs_value;
+ var v2s = function (value)
+ {
+ var tmp = Math.round (100.0 * value) / 100.0;
+ return ("" + tmp);
+ }
+
+ if (value == null)
+ return ('NaN');
+ else if (value == 0)
+ return ('0');
+
+ abs_value = Math.abs (value);
+
+ if ((abs_value < 10000) && (abs_value >= 0.1))
+ return (v2s (value));
+ else if (abs_value > 1)
+ {
+ if (abs_value < 10000000)
+ return (v2s (value / 1000) + "k");
+ else if (abs_value < 10000000000)
+ return (v2s (value / 1000000) + "M");
+ else if (abs_value < 10000000000000)
+ return (v2s (value / 1000000000) + "G");
+ else
+ return (v2s (value / 1000000000000) + "T");
+ }
+ else
+ {
+ if (abs_value >= 0.001)
+ return (v2s (value * 1000) + "m");
+ else if (abs_value >= 0.000001)
+ return (v2s (value * 1000000) + "u");
+ else
+ return (v2s (value * 1000000000) + "n");
+ }
+} /* }}} function value_to_string */
+
+function instance_get_params (inst) /* {{{ */
{
- var graph_selector = graph.graph_selector;
- var inst_selector = graph.instance_selector;
+ var graph_selector = inst.graph_selector;
+ var inst_selector = inst.instance_selector;
var selector = {};
if (graph_selector.host == inst_selector.host)
return (ret);
} /* }}} ident_clone */
-function graph_get_defs (graph)
+function inst_get_defs (inst) /* {{{ */
{
- if (!graph.def)
+ if (!inst.def)
{
- var params = ident_clone (graph.graph_selector);
+ var params = instance_get_params (inst);
params.action = "graph_def_json";
$.ajax({
if (!data)
return;
- graph.def = data;
+ inst.def = data;
}});
}
- if (graph.def)
- return (graph.def);
+ if (inst.def)
+ return (inst.def);
return;
-} /* graph_get_defs */
+} /* }}} inst_get_defs */
-function instance_draw (inst, def, data)
+function ident_matches (selector, ident) /* {{{ */
+{
+ var part_matches = function (s,p)
+ {
+ if (s == null)
+ return (false);
+
+ if ((s == "/any/") || (s == "/all/"))
+ return (true);
+
+ if (p == null)
+ return (false);
+
+ if (s == p)
+ return (true);
+
+ return (false);
+ };
+
+ if (!part_matches (selector.host, ident.host))
+ return (false);
+
+ if (!part_matches (selector.plugin, ident.plugin))
+ return (false);
+
+ if (!part_matches (selector.plugin_instance, ident.plugin_instance))
+ return (false);
+
+ if (!part_matches (selector.type, ident.type))
+ return (false);
+
+ if (!part_matches (selector.type_instance, ident.type_instance))
+ return (false);
+
+ return (true);
+} /* }}} function ident_matches */
+
+function ident_describe (ident, selector) /* {{{ */
+{
+ var ret = "";
+ var check_field = function (field)
+ {
+ if (ident[field].toLowerCase () != selector[field].toLowerCase ())
+ {
+ if (ret != "")
+ ret += "/";
+ ret += ident[field];
+ }
+ };
+
+ check_field ("host");
+ check_field ("plugin");
+ check_field ("plugin_instance");
+ check_field ("type");
+ check_field ("type_instance");
+
+ if (ret == "")
+ return (null);
+ return (ret);
+} /* }}} function ident_describe */
+
+/*
+ * Given one metric definition, returns the appropriate metric data from the
+ * graph data (data list). */
+function metric_def_get_data (metric_def, graph_data)
{
- var x_data = [];
- var y_data = [];
var i;
- if (!inst || !def || !data)
- return;
+ for (i = 0; i < graph_data.length; i++)
+ {
+ if ((metric_def.ds_name) && (metric_def.ds_name != graph_data[i].data_source))
+ continue;
+ if (!ident_matches (metric_def.select, graph_data[i].file))
+ continue;
+
+ return (graph_data[i]);
+ }
+ return;
+}
+
+function metric_def_to_rickshaw_series (metric_def, metric_data)
+{
+ var series = {
+ data: []
+ };
+ var i;
+
+ if (metric_def.legend)
+ series.name = metric_def.legend;
+
+ if (metric_def.color)
+ series.color = metric_def.color;
- for (i = 0; i < data.length; i++)
+ for (i = 0; i < metric_data.data.length; i++)
{
- var ds = data[i];
+ var x = metric_data.first_value_time + (i * metric_data.interval);
+ var y = metric_data.data[i];
- var j;
- var x = [];
- var y = [];
+ series.data.push ({'x': x, 'y': y});
+ }
- for (j = 0; j < ds.data.length; j++)
- {
- var dp = ds.data[j];
- var t = dp[0];
- var v = dp[1];
+ return (series);
+}
- x.push (t);
- y.push (v);
- }
+function graph_def_to_rickshaw_config (root_element, graph_def, data_list)
+{
+ var graph_config = {
+ element: root_element,
+ renderer: 'line',
+ series: []
+ };
+ var graph;
+ var i;
+
+ for (i = 0; i < graph_def.defs.length; i++)
+ {
+ var metric_def = graph_def.defs[i];
+ var metric_data = metric_def_get_data (metric_def, data_list);
+ var series;
+
+ if (!metric_data)
+ continue;
- x_data.push (x);
- y_data.push (y);
+ series = metric_def_to_rickshaw_series (metric_def, metric_data);
+ if (series)
+ graph_config.series.push (series);
}
- inst.raphael.clear ();
- if (def.title)
- inst.raphael.g.text (250, 15, def.title);
- if (def.vertical_label)
- inst.raphael.g.text (5, 100, def.vertical_label).rotate (270);
- inst.raphael.g.linechart(50, 25, 500, 150, x_data, y_data, {axis: "0 0 1 1"});
+ return (graph_config);
}
-function json_graph_update (index)
+function graph_def_to_rickshaw_graph (root_element, graph_def, graph_data)
{
- var inst;
- var def;
- var params;
+ var graph_config = graph_def_to_rickshaw_config (root_element, graph_def, graph_data);
- inst = c4.instances[index];
- if (!inst)
- return;
+ var graph = new Rickshaw.Graph (graph_config);
+ graph.render ();
- def = graph_get_defs (inst);
- if (!def)
- return;
+ var x_axis = new Rickshaw.Graph.Axis.Time({
+ graph: graph
+ });
+ x_axis.render ();
- if (!inst.raphael)
- inst.raphael = Raphael ("c4-graph" + index);
+ var y_axis = new Rickshaw.Graph.Axis.Y({
+ graph: graph
+ });
+ y_axis.render ();
+}
+
+function inst_draw_rickshaw (inst, graph_def, graph_data)
+{
+ var root_element = document.getElementById (inst.container);
+
+ inst.chart = graph_def_to_rickshaw_graph (root_element, graph_def, graph_data);
+}
+
+function inst_draw (inst, graph_def, graph_data)
+{
+ inst_draw_rickshaw (inst, graph_def, graph_data);
+}
+
+function inst_redraw (inst, graph_def, graph_data) /* {{{ */
+{
+ var series_array;
+ var i;
+
+ if (!inst.chart)
+ return (inst_draw (inst, graph_def, graph_data));
+ else
+ return; /* TODO: Insert new data into the graph */
+} /* }}} function inst_redraw */
+
+function inst_fetch_data (inst, begin, end) /* {{{ */
+{
+ var graph_def;
+ var params;
+
+ graph_def = inst_get_defs (inst);
+ if (!graph_def)
+ return;
params = instance_get_params (inst);
- params.action = "graph_data_json";
- params.begin = inst.begin;
- params.end = inst.end;
+ params.action = "instance_data_json";
+ params.begin = begin || inst.begin;
+ params.end = end || inst.end;
+ params.resolution = (params.end - params.begin) / c4.config.width;
$.getJSON ("collection.fcgi", params,
function (data)
{
- instance_draw (inst, def, data);
+ inst_redraw (inst, graph_def, data);
}); /* getJSON */
-} /* json_graph_update */
+} /* }}} inst_fetch_data */
+
+function json_graph_update (index) /* {{{ */
+{
+ var inst;
+
+ inst = c4.instances[index];
+ if (!inst)
+ return;
+
+ if (!inst.container)
+ inst.container = "c4-graph" + index;
+
+ inst_fetch_data (inst);
+} /* }}} json_graph_update */
function format_instance(inst)
{
return (zoom_relative (graph_id, (-1.0 / 3.0), (1.0 / 3.0)));
} /* }}} function zoom_earlier */
+function graph_recalc_width () /* {{{ */
+{
+ var tmp;
+
+ tmp = $("#layout-middle-center").width ();
+ if (!tmp)
+ return;
+
+ if (tmp < 324)
+ tmp = 324;
+
+ c4.config.width = tmp;
+ c4.config.height = Math.round (tmp / 1.61803398874989484820);
+ $(".graph-json").each (function ()
+ {
+ $(this).width (c4.config.width);
+ $(this).height (c4.config.height);
+ });
+} /* }}} function graph_recalc_width */
+
$(document).ready(function() {
/* $("#layout-middle-right").html ("<ul id=\"search-suggest\" class=\"graph_list\"></ul>"); */
$("#search-form").append ("<ul id=\"search-suggest\" class=\"graph_list\"></ul>");
+ "<div class=\"graph-button\" onClick=\"zoom_reference ('"+id+"');\">!</div>"
+ "</div>"
+ "<div class=\"graph-buttons navigation\">"
- + "<div class=\"graph-button\" onClick=\"zoom_earlier ('"+id+"');\">←</div>"
- + "<div class=\"graph-button\" onClick=\"zoom_out ('"+id+"');\">−</div>"
+ + "<div class=\"graph-button\" onClick=\"zoom_earlier ('"+id+"');\">\u2190</div>"
+ + "<div class=\"graph-button\" onClick=\"zoom_out ('"+id+"');\">\u2212</div>"
+ "<div class=\"graph-button\" onClick=\"zoom_in ('"+id+"');\">+</div>"
- + "<div class=\"graph-button\" onClick=\"zoom_later ('"+id+"');\">→</div>"
+ + "<div class=\"graph-button\" onClick=\"zoom_later ('"+id+"');\">\u2192</div>"
+ "</div>"
);
});
+ graph_recalc_width ();
+
var i;
for (i = 0; i < c4.instances.length; i++)
{
projects / collection4.git / blobdiff