fixed treshold graph

This commit is contained in:
daniel 2018-05-10 08:43:09 +02:00
parent b11e256c8b
commit f758124531
8 changed files with 1201 additions and 1049 deletions

View File

@ -2912,7 +2912,7 @@ function chooseType() {
case 'simple_graph':
$("#row_time_compare_overlapped").show();
$("#row_only_avg").show();
// $("#row_only_avg").show();
$("#row_fullscale").show();
if ($("#checkbox-percentil").prop("checked"))
$("#row_percentil").show();
@ -2923,7 +2923,6 @@ function chooseType() {
$("#row_agent").show();
$("#row_module").show();
$("#row_period").show();
$("#row_show_in_two_columns").show();
$("#row_show_in_landscape").show();
$("#row_time_compare_overlapped").show();
$("#row_historical_db_check").hide();

View File

@ -465,6 +465,23 @@ function grafico_modulo_sparse_data(
}
}
//XXXX que hacer con baseline
/*
// Get baseline data
$baseline_data = array();
if ($baseline) {
$baseline_data = array ();
if ($baseline == 1) {
$baseline_data = enterprise_hook(
'reporting_enterprise_get_baseline',
array ($agent_module_id, $period, $width, $height , $title, $unit_name, $date));
if ($baseline_data === ENTERPRISE_NOT_HOOK) {
$baseline_data = array ();
}
}
}
*/
if ($show_elements_graph['show_events'] ||
$show_elements_graph['show_alerts'] ) {
@ -504,17 +521,35 @@ function grafico_modulo_sparse_data(
}
else{
if($show_elements_graph['flag_overlapped']){
if( ( strstr($v['event_type'], 'going_up') ) ||
( strstr($v['event_type'], 'going_down') ) ){
$events_array['data'][$count_events] = array(
(($v['utimestamp'] + 1 + $date_array['period']) * 1000),
$max * 1.15
);
}
else{
$events_array['data'][$count_events] = array(
($v['utimestamp'] + $date_array['period'] *1000),
$max * 1.15
);
}
}
else{
if( ( strstr($v['event_type'], 'going_up') ) ||
( strstr($v['event_type'], 'going_down') ) ){
$events_array['data'][$count_events] = array(
(($v['utimestamp'] + 1) *1000),
$max * 1.15
);
}
else{
$events_array['data'][$count_events] = array(
($v['utimestamp']*1000),
$max * 1.15
);
}
}
$count_events++;
}
}
@ -574,6 +609,7 @@ function grafico_modulo_sparse_data(
);
$array_events_alerts[$series_suffix] = $events;
}
function grafico_modulo_sparse ($agent_module_id, $period, $show_events,
@ -770,11 +806,6 @@ function grafico_modulo_sparse ($agent_module_id, $period, $show_events,
$data_module_graph['series_suffix'] = $series_suffix;
html_debug_print($color);
// Check available data
if ($show_elements_graph['compare'] === 'separated') {
if (!empty($array_data)) {
@ -1127,11 +1158,9 @@ html_debug_print($from_interface);
$show_elements_graph['stacked'] = $stacked;
$format_graph = array();
$format_graph['width'] = $width;
$format_graph['width'] = $width . "px";
$format_graph['height'] = $height;
//XXXX
$format_graph['type_graph'] = $type_graph; //dont use
$format_graph['type_graph'] = ''; //dont use
$format_graph['unit_name'] = $unit_name;
$format_graph['unit'] = ''; //dont use
$format_graph['title'] = $title;
@ -1615,7 +1644,7 @@ html_debug_print($from_interface);
$module_name_list[$i] .= " (x". format_numeric ($weight_list[$i], 1).")";
}
*/
$temp = array();
// $temp = array();
@ -1853,6 +1882,8 @@ html_debug_print($from_interface);
}
}
$graph_values = $temp;
switch ($stacked) {
default:
case CUSTOM_GRAPH_STACKED_LINE:
@ -4062,7 +4093,8 @@ function graphic_module_events ($id_module, $width, $height, $period = 0, $homeu
global $graphic_type;
$data = array ();
$width = 90;
$height = 100;
$resolution = $config['graph_res'] * ($period * 2 / $width); // Number of "slices" we want in graph
$interval = (int) ($period / $resolution);
@ -4120,7 +4152,6 @@ function graphic_module_events ($id_module, $width, $height, $period = 0, $homeu
if (empty($event['utimestamp'])) {
continue;
}
switch($event['event_type']) {
case 'going_down_normal':
case 'going_up_normal':
@ -4188,7 +4219,7 @@ function graphic_module_events ($id_module, $width, $height, $period = 0, $homeu
// Draw slicebar graph
if ($config['flash_charts']) {
echo flot_slicesbar_graph($data, $period, $width, 15, $legend, $colors, $config['fontpath'], $config['round_corner'], $homeurl, '', $adapt_key, $stat_win);
echo flot_slicesbar_graph($data, $period, $width, 50, $legend, $colors, $config['fontpath'], $config['round_corner'], $homeurl, '', $adapt_key, $stat_win);
}
else {
echo slicesbar_graph($data, $period, $width, 15, $colors, $config['fontpath'], $config['round_corner'], $homeurl);

View File

@ -1200,10 +1200,6 @@ function reporting_event_top_n($report, $content, $type = 'dinamic',
' - ' .
ui_print_truncate_text($module_name[$i], $truncate_size, false, true, false, "...");
//Dirty hack, maybe I am going to apply a job in Apple
//https://www.imperialviolet.org/2014/02/22/applebug.html
$item_name_key_pie = $item_name;
$exist_key = true;
while ($exist_key) {
@ -1256,10 +1252,6 @@ function reporting_event_top_n($report, $content, $type = 'dinamic',
ui_print_truncate_text($module_name[$i],
$truncate_size, false, true, false, "...");
//Dirty hack, maybe I am going to apply a job in Apple
//https://www.imperialviolet.org/2014/02/22/applebug.html
$item_name_key_pie = $item_name;
$exist_key = true;
while ($exist_key) {
@ -3603,7 +3595,6 @@ function reporting_prediction_date($report, $content) {
function reporting_projection_graph($report, $content,
$type = 'dinamic', $force_width_chart = null,
$force_height_chart = null) {
html_debug_print('esta en esta');
global $config;
@ -6395,7 +6386,7 @@ function reporting_general($report, $content) {
function reporting_custom_graph($report, $content, $type = 'dinamic',
$force_width_chart = null, $force_height_chart = null, $type_report = "custom_graph") {
html_debug_print('esta en esta 2');
global $config;
require_once ($config["homedir"] . '/include/functions_graph.php');
@ -6544,16 +6535,13 @@ function reporting_simple_graph($report, $content, $type = 'dinamic',
global $config;
if ($config['metaconsole']) {
$id_meta = metaconsole_get_id_server($content["server_name"]);
$server = metaconsole_get_connection_by_id ($id_meta);
metaconsole_connect($server);
}
$return = array();
$return['type'] = 'simple_graph';
@ -6561,16 +6549,11 @@ function reporting_simple_graph($report, $content, $type = 'dinamic',
$content['name'] = __('Simple graph');
}
$module_name = io_safe_output(
modules_get_agentmodule_name($content['id_agent_module']));
$agent_name = io_safe_output(
modules_get_agentmodule_agent_alias ($content['id_agent_module']));
$return['title'] = $content['name'];
$return['subtitle'] = $agent_name . " - " . $module_name;
$return['agent_name'] = $agent_name;
@ -6600,9 +6583,9 @@ function reporting_simple_graph($report, $content, $type = 'dinamic',
$content['id_agent_module']));
$return['chart'] = '';
// Get chart
reporting_set_conf_charts($width, $height, $only_image, $type,
$content, $ttl);
reporting_set_conf_charts($width, $height, $only_image, $type, $content, $ttl);
if (!empty($force_width_chart)) {
$width = $force_width_chart;
@ -6616,9 +6599,7 @@ function reporting_simple_graph($report, $content, $type = 'dinamic',
case 'dinamic':
case 'static':
if (preg_match ("/string/", $moduletype_name)) {
$urlImage = ui_get_full_url(false, false, false, false);
$return['chart'] = grafico_modulo_string(
$content['id_agent_module'],
$content['period'],
@ -6648,8 +6629,8 @@ function reporting_simple_graph($report, $content, $type = 'dinamic',
$content['id_agent_module'],
$content['period'],
false,
$width,
$height,
'90%',
400,
$label,
'',
false,

View File

@ -1,45 +1,35 @@
/* Flot plugin for thresholding data.
Copyright (c) 2007-2014 IOLA and Ole Laursen.
Licensed under the MIT license.
The plugin supports these options:
series: {
threshold: {
below: number
below: number,
above: mumber,
color: colorspec
}
}
It can also be applied to a single series, like this:
$.plot( $("#placeholder"), [{
data: [ ... ],
threshold: { ... }
}])
An array can be passed for multiple thresholding, like this:
threshold: [{
below: number1
below: number1,
color: color1
},{
below: number2
above: number2,
color: color2
}]
These multiple threshold objects can be passed in any order since they are
sorted by the processing function.
The data points below "below" are drawn with the specified color. This makes
it easy to mark points below 0, e.g. for budget data.
Internally, the plugin works by splitting the data into two series, above and
below the threshold. The extra series below the threshold will have its label
cleared and the special "originSeries" attribute set to the original series.
You may need to check for this in hover events.
*/
(function($) {
@ -48,9 +38,15 @@ You may need to check for this in hover events.
};
function init(plot) {
function thresholdData(plot, s, datapoints, below, color) {
var ps = datapoints.pointsize, i, x, y, p, prevp,
thresholded = $.extend({}, s); // note: shallow copy
function thresholdData(plot, s, datapoints, below, above, color) {
var origpoints = datapoints.points,
ps = datapoints.pointsize,
addCrossingPoints = s.lines.show,
thresholded = $.extend({}, s), // note: shallow copy
threspoints = [],
newpoints = [],
prevp, i, x, y, p, m;
thresholded.datapoints = { points: [], pointsize: ps, format: datapoints.format };
thresholded.label = null;
@ -59,46 +55,43 @@ You may need to check for this in hover events.
thresholded.originSeries = s;
thresholded.data = [];
var origpoints = datapoints.points,
addCrossingPoints = s.lines.show;
var threspoints = [];
var newpoints = [];
var m;
for (i = 0; i < origpoints.length; i += ps) {
x = origpoints[i];
y = origpoints[i + 1];
prevp = p;
if (y < below)
if (y < below || y > above) {
p = threspoints;
else
} else {
p = newpoints;
}
if (addCrossingPoints && prevp != p && x != null
&& i > 0 && origpoints[i - ps] != null) {
if (addCrossingPoints && prevp !== p && x != null && i > 0 && origpoints[i - ps] != null) {
var interx = x + (below - y) * (x - origpoints[i - ps]) / (y - origpoints[i - ps + 1]);
prevp.push(interx);
prevp.push(below);
for (m = 2; m < ps; ++m)
for (m = 2; m < ps; ++m) {
prevp.push(origpoints[i + m]);
}
p.push(null); // start new segment
p.push(null);
for (m = 2; m < ps; ++m)
for (m = 2; m < ps; ++m) {
p.push(origpoints[i + m]);
}
p.push(interx);
p.push(below);
for (m = 2; m < ps; ++m)
for (m = 2; m < ps; ++m) {
p.push(origpoints[i + m]);
}
}
p.push(x);
p.push(y);
for (m = 2; m < ps; ++m)
for (m = 2; m < ps; ++m) {
p.push(origpoints[i + m]);
}
}
datapoints.points = newpoints;
thresholded.datapoints.points = threspoints;
@ -113,8 +106,9 @@ You may need to check for this in hover events.
}
function processThresholds(plot, s, datapoints) {
if (!s.threshold)
if (!s.threshold) {
return;
}
if (s.threshold instanceof Array) {
s.threshold.sort(function(a, b) {
@ -122,21 +116,39 @@ You may need to check for this in hover events.
});
$(s.threshold).each(function(i, th) {
thresholdData(plot, s, datapoints, th.below, th.color);
thresholdData(plot, s, datapoints, th.below, th.above, th.color);
});
}
else {
thresholdData(plot, s, datapoints, s.threshold.below, s.threshold.color);
} else {
thresholdData(plot, s, datapoints, s.threshold.below, s.threshold.above, s.threshold.color);
}
}
plot.hooks.processDatapoints.push(processThresholds);
function processThresholdsLegend(ctx, canvas, s) {
if (!s.threshold) {
return;
}
var color = s.threshold.color ? s.threshold.color : "black";
$(".legendLabel").each(function() {
if ($(this).text() === s.label)
{
var legend = $(this).prev().find("div > div");
legend.css("border-right-color", color);
legend.css("border-bottom-color", color);
}
});
}
plot.hooks.drawSeries.push(processThresholdsLegend);
}
$.plot.plugins.push({
init: init,
options: options,
name: 'threshold',
version: '1.2'
name: "threshold",
version: "1.3"
});
})(jQuery);

View File

@ -0,0 +1,189 @@
/*
Flot plugin for specifying range of thresolds on data.
Controlled through the option "constraints" in a specific series
usage -
$.plot($("#placeholder"), [{ data: [ ... ], constraints: [constraint1, constraint2]},{data:[...],constraints:[...]}])
where constraint1 = {
threshold: 2,
color: "rgb(0,0,0)",
evaluate : function(y,threshold){ return y < threshold; }
}
threshold -> y-limit on the plot.
evaluate -> the function which defines the limit.This function defines wheteher y < threshold or y > threshold.
color -> the color with which to plot portion of the graph which satisfies the limit condition.
Internally, the plugin works by splitting the data into different series, one for each constraint.
*/
(function($){
function init(plot){
function plotWithMultipleThresholds(plot,s,datapoints){
if(s.data && s.data.length > 0 && s.constraints && s.constraints.length>0){
var series = new Graph(s.data,s.constraints).getPlotData();
for(var i=0;i<series.length;i++){
var ss = $.extend({},s);
ss.constraints = [];
ss.data = series[i].data;
ss.color = series[i].color;
plot.getData().push(ss);
}
}
}
function Graph(dataset, constraints) {
this._constraints = _getSortedConstraints(dataset,constraints);
this._dataset = dataset;
this._plotData = [];
this.getPlotData = function() {
if(this._constraints.length == 0)return [];
for ( var i = this._constraints.length - 1; i >= 0 ; i--) {
var constraint = this._constraints[i];
if(null != constraint.threshold){
var set = new Resolve(this._dataset).using(constraint.threshold, constraint.evaluate);
this._plotData.push( {
data : set,
color : constraint.color
});
}
}
return this._plotData;
};
function Resolve(originalPonits) {
this._originalPoints = originalPonits;
this._data = [];
this._getPointOnThreshold = _getPointOnThreshold;
this.using = using ;
function using(threshold, evaluate) {
var count = 0;
for ( var i = 0; i < this._originalPoints.length; i++) {
var currentPoint = this._originalPoints[i];
if (evaluate(currentPoint[1],threshold)) {
if (i > 0
&& (this._data.length == 0 || this._data[count - 1] == null)) {
this._data[count++] = this._getPointOnThreshold(threshold,this._originalPoints[i - 1], currentPoint);
}
this._data[count++] = currentPoint;
} else {
if (this._data.length > 0 && this._data[count - 1] != null) {
this._data[count++] = this._getPointOnThreshold(threshold,this._originalPoints[i - 1], currentPoint);
this._data[count++] = null;
this._data[count++] = null;
}
}
}
return this._data;
}
function _getPointOnThreshold(threshold, prevP, currP) {
var currentX = currP[0];
var currentY = currP[1];
var prevX = prevP[0];
var prevY = prevP[1];
var slope = (threshold - currentY)
/ (prevY - currentY);
var xOnConstraintLine = slope * (prevX - currentX) + currentX;
return [ xOnConstraintLine, threshold ];
}
}
function _getSortedConstraints(originalpoints,constraints){
var dataRange = _findMaxAndMin(originalpoints);
if(undefined == dataRange)return [];
var max = dataRange.max;
var min = dataRange.min;
var thresholdRanges = [];
var sortedConstraints = [];
for(var i = 0; i < constraints.length ; i++){
var constraint = constraints[i];
var range = 0;
if(constraint.evaluate(min,constraint.threshold)){
range = Math.abs(constraint.threshold - min);
}else{
range = Math.abs(max - constraint.threshold);
}
thresholdRanges.push({constraint:constraint,range:range});
}
QuickSort(thresholdRanges,function(obj1,obj2){ return obj1.range < obj2.range;});
for(var i=thresholdRanges.length-1;i>=0;i--){
sortedConstraints[i] = thresholdRanges[i].constraint;
}
return sortedConstraints;
}
function _findMaxAndMin(dataset){
if(undefined == dataset)return undefined;
var arr = [];
for( var i=0;i<dataset.length;i++){
arr[i] = dataset[i][1];
}
QuickSort(arr,function(p1,p2){return p1 < p2;});
return { min:arr[0],max:arr[arr.length-1]};
}
}
function QuickSort(dataset,comparator){
sort(dataset, 0, dataset.length-1, comparator);
function sort(array, left, right,comparator){
if(right > left){
var pivotIndex = Math.floor(( left + right )/2);
var pivotNewIndex = partition(array,left,right,pivotIndex,comparator);
sort(array, left, pivotNewIndex - 1,comparator);
sort(array, pivotNewIndex + 1, right,comparator);
}
}
function partition(array,left,right,pivotIndex,comparator){
var pivot = array[pivotIndex];
swap(array,pivotIndex,right);
var storeIndex = left;
for( var i= left ; i < right ; i++){
if(comparator(array[i] , pivot)){
swap(array,i,storeIndex);
storeIndex = storeIndex + 1;
}
}
swap(array,storeIndex,right);
return storeIndex;
}
function swap(array,index1,index2){
var temp = array[index1];
array[index1] = array[index2];
array[index2] = temp;
}
}
plot.hooks.processRawData.push(plotWithMultipleThresholds);
}
$.plot.plugins.push({
init: init,
name: 'multiple.threshold',
version: '1.0'
});
})(jQuery);

File diff suppressed because it is too large Load Diff

View File

@ -52,6 +52,8 @@ function include_javascript_dependencies_flot_graph($return = false) {
ui_get_full_url($metaconsole_hack . '/include/graphs/flot/jquery.flot.resize.min.js') .'"></script>
<script language="javascript" type="text/javascript" src="'.
ui_get_full_url($metaconsole_hack . '/include/graphs/flot/jquery.flot.threshold.js') .'"></script>
<script language="javascript" type="text/javascript" src="'.
ui_get_full_url($metaconsole_hack . '/include/graphs/flot/jquery.flot.threshold.multiple.js') .'"></script>
<script language="javascript" type="text/javascript" src="'.
ui_get_full_url($metaconsole_hack . '/include/graphs/flot/jquery.flot.symbol.min.js') .'"></script>
<script language="javascript" type="text/javascript" src="'.
@ -128,7 +130,7 @@ function flot_area_graph (
///XXXXXXX los px caca
// Parent layer
$return = "<div class='parent_graph' style='width: " . ($format_graph['width']) . "px; " . $background_style . "'>";
$return = "<div class='parent_graph' style='width: " . ($format_graph['width']) . "; " . $background_style . "'>";
// Set some containers to legend, graph, timestamp tooltip, etc.
$return .= "<p id='legend_$graph_id' class='legend_graph' style='font-size:" . $format_graph['font_size'] ."pt !important;'></p>";
@ -297,7 +299,7 @@ function menu_graph(
$return .= "<div id='geneal_menu_$graph_id' class='menu_graph' style='
width: 30px;
height: 250px;
left:" . $width . "px;
left:100%;
position: absolute;
top: 0px;
background-color: white;'>";
@ -677,10 +679,10 @@ function flot_slicesbar_graph ($graph_data, $period, $width, $height, $legend, $
// Set some containers to legend, graph, timestamp tooltip, etc.
if ($stat_win) {
$return = "<div id='$graph_id' class='noresizevc graph $adapt_key' style='width: ".$width."px; height: ".$height."px; display: inline-block;'></div>";
$return = "<div id='$graph_id' class='noresizevc graph $adapt_key' style='width: ".$width."%; height: ".$height."px; display: inline-block;'></div>";
}
else {
$return = "<div id='$graph_id' class='noresizevc graph $adapt_key' style='width: ".$width."px; height: ".$height."px;'></div>";
$return = "<div id='$graph_id' class='noresizevc graph $adapt_key' style='width: ".$width."%; height: ".$height."px;'></div>";
}
$return .= "<div id='value_$graph_id' style='display:none; position:absolute; background:#fff; border: solid 1px #aaa; padding: 2px'></div>";

View File

@ -244,10 +244,12 @@ $alias = db_get_value ("alias","tagente","id_agente",$id_agent);
(($show_percentil)? $config['percentil'] : null),
false, false, $config['type_module_charts'], $fullscale);
echo '<br>';
if ($show_events_graph)
if ($show_events_graph){
$width = '500';
echo graphic_module_events($id, $width, $height,
$period, $config['homeurl'], $zoom,
'adapted_' . $graph_type, $date, true);
}
break;
case 'string':
html_debug_print('entra x stats win hay que rehacer esta funcion');