X-Git-Url: https://git.octo.it/?a=blobdiff_plain;f=share%2Fcollection.js;h=0f41089223d7aa88cef72c103039048db9447e9e;hb=HEAD;hp=05ca9baf80a52e2e4f56332c1655ca23991c6b9a;hpb=100679c57df004d9cb816438d2339a2e6c692a45;p=collection4.git diff --git a/share/collection.js b/share/collection.js index 05ca9ba..0f41089 100644 --- a/share/collection.js +++ b/share/collection.js @@ -1,6 +1,6 @@ /** * 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 @@ -18,12 +18,17 @@ * Boston, MA 02110-1301 USA * * Authors: - * Florian octo Forster + * Florian octo Forster **/ var c4 = { - instances: [] + instances: new Array (), + config: + { + width: 324, + height: 200 + } }; function value_to_string (value) /* {{{ */ @@ -225,166 +230,151 @@ function ident_describe (ident, selector) /* {{{ */ return (ret); } /* }}} function ident_describe */ -function def_draw_one (def, data, chart_opts) /* {{{ */ +/* + * 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 chart_series = new Object (); + var i; - chart_series.type = 'line'; - chart_series.pointInterval = data.interval * 1000; - chart_series.pointStart = data.first_value_time * 1000; - chart_series.data = data.data; - chart_series.lineWidth = 1; - chart_series.shadow = false; - chart_series.marker = { enabled: false }; + 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; - if (def.legend) - chart_series.name = def.legend; - else if (def.ds_name) - chart_series.name = def.ds_name; + return (graph_data[i]); + } + return; +} - if (def.area) - chart_series.type = 'area'; +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 (def.stack) - chart_series.stacking = 'normal'; + if (metric_def.color) + series.color = metric_def.color; - if ((def.color) && (def.color != 'random')) - chart_series.color = def.color; + for (i = 0; i < metric_data.data.length; i++) + { + var x = metric_data.first_value_time + (i * metric_data.interval); + var y = metric_data.data[i]; + + series.data.push ({'x': x, 'y': y}); + } - chart_opts.series.push (chart_series); -} /* }}} function def_draw_one */ + return (series); +} -function def_draw (def, data_list, chart_opts) /* {{{ */ +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 < data_list.length; i++) + for (i = 0; i < graph_def.defs.length; i++) { - if ((def.ds_name) && (def.ds_name != data_list[i].data_source)) - continue; - if (!ident_matches (def.select, data_list[i].file)) + var metric_def = graph_def.defs[i]; + var metric_data = metric_def_get_data (metric_def, data_list); + var series; + + if (!metric_data) continue; - def_draw_one (def, data_list[i], chart_opts); + series = metric_def_to_rickshaw_series (metric_def, metric_data); + if (series) + graph_config.series.push (series); } -} /* }}} function def_draw */ -function instance_draw (inst, def, data_list) /* {{{ */ -{ - var x_data = []; - var y_data = []; - var i; + return (graph_config); +} - var chart_opts = new Object (); +function graph_def_to_rickshaw_graph (root_element, graph_def, graph_data) +{ + var graph_config = graph_def_to_rickshaw_config (root_element, graph_def, graph_data); - if (!inst || !def || !data_list) - return; + var graph = new Rickshaw.Graph (graph_config); + graph.render (); - chart_opts.chart = - { - renderTo: inst.container, - zoomType: 'x' - }; - chart_opts.xAxis = - { - type: 'datetime', - maxZoom: 300, // five minutes - title: { text: null } - }; - chart_opts.yAxis = - { - labels: - { - formatter: function () { return (value_to_string (this.value)); } - }, - endOnTick: false - }; - chart_opts.legend = - { - labelFormatter: function () - { - var series = this; - var min = Number.MAX_VALUE; - var max = Number.NEGATIVE_INFINITY; - var num = 0; - var sum = 0; - var avg; - var i; + var x_axis = new Rickshaw.Graph.Axis.Time({ + graph: graph + }); + x_axis.render (); - for (i = 0; i < this.data.length; i++) - { - var v; + var y_axis = new Rickshaw.Graph.Axis.Y({ + graph: graph + }); + y_axis.render (); +} - v = this.data[i].y; - if (v == null) - continue; +function inst_draw_rickshaw (inst, graph_def, graph_data) +{ + var root_element = document.getElementById (inst.container); - if (min > v) - min = v; - if (max < v) - max = v; + inst.chart = graph_def_to_rickshaw_graph (root_element, graph_def, graph_data); +} - sum += v; - num++; - } +function inst_draw (inst, graph_def, graph_data) +{ + inst_draw_rickshaw (inst, graph_def, graph_data); +} - if (num == 0) - { - min = null; - max = null; - avg = null; - } - else - { - avg = sum / num; - } +function inst_redraw (inst, graph_def, graph_data) /* {{{ */ +{ + var series_array; + var i; - return (this.name + " (" + value_to_string (min) + " min, " - + value_to_string (avg) + " avg, " - + value_to_string (max) + " max)"); - } - }; - chart_opts.series = new Array (); + if (!inst.chart) + return (inst_draw (inst, graph_def, graph_data)); + else + return; /* TODO: Insert new data into the graph */ +} /* }}} function inst_redraw */ - if (def.title) - chart_opts.title = { text: def.title }; +function inst_fetch_data (inst, begin, end) /* {{{ */ +{ + var graph_def; + var params; - for (i = def.defs.length - 1; i >= 0; i--) - def_draw (def.defs[i], data_list, chart_opts); + graph_def = inst_get_defs (inst); + if (!graph_def) + return; -// if ((def.defs.length == 0) && (data_list.length == 1)) -// def_draw_one (null, data_list[0], chart_opts); + params = instance_get_params (inst); + params.action = "instance_data_json"; + params.begin = begin || inst.begin; + params.end = end || inst.end; + params.resolution = (params.end - params.begin) / c4.config.width; - inst.chart = new Highcharts.Chart (chart_opts); -} /* }}} function instance_draw */ + $.getJSON ("collection.fcgi", params, + function (data) + { + inst_redraw (inst, graph_def, data); + }); /* getJSON */ +} /* }}} inst_fetch_data */ function json_graph_update (index) /* {{{ */ { var inst; - var def; - var params; inst = c4.instances[index]; if (!inst) return; - def = inst_get_defs (inst); - if (!def) - return; - if (!inst.container) inst.container = "c4-graph" + index; - params = instance_get_params (inst); - params.action = "instance_data_json"; - params.begin = inst.begin; - params.end = inst.end; - - $.getJSON ("collection.fcgi", params, - function (data) - { - instance_draw (inst, def, data); - }); /* getJSON */ + inst_fetch_data (inst); } /* }}} json_graph_update */ function format_instance(inst) @@ -572,6 +562,26 @@ function zoom_out (graph_id) /* {{{ */ 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 (""); */ $("#search-form").append (""); @@ -628,14 +638,16 @@ $(document).ready(function() { + "
!
" + "" + "
" - + "
←
" - + "
−
" + + "
\u2190
" + + "
\u2212
" + "
+
" - + "
→
" + + "
\u2192
" + "
" ); }); + graph_recalc_width (); + var i; for (i = 0; i < c4.instances.length; i++) {