fixed js render

This commit is contained in:
Daniel Barbero 2022-12-16 10:38:37 +01:00
parent 5f91d2b077
commit 62aea35d7b
24 changed files with 998 additions and 1039 deletions

View File

@ -4238,20 +4238,32 @@ function generator_chart_to_pdf(
];
}
$browserFactory = new BrowserFactory('chromium-browser');
// Starts headless chrome.
$browser = $browserFactory->createBrowser(['noSandbox' => true]);
try {
// Creates a new page and navigate to an URL.
$browserFactory = new BrowserFactory('chromium-browser');
// Starts headless chrome.
$browser = $browserFactory->createBrowser(['noSandbox' => true]);
// Creates a new page.
$page = $browser->createPage();
$page->navigate($url.'?data='.urlencode(json_encode($data)))->waitForNavigation(Page::DOM_CONTENT_LOADED);
// Navigate to an URL.
$navigation = $page->navigate($url.'?data='.urlencode(json_encode($data)));
$navigation->waitForNavigation(Page::DOM_CONTENT_LOADED);
// Dynamic.
$dynamic_height = $page->evaluate('document.getElementById("container-chart-generator-item").clientHeight')->getReturnValue();
if (empty($dynamic_height) === true) {
$dynamic_height = 200;
}
if (isset($params['options']['viewport']) === true
&& isset($params['options']['viewport']['height']) === true
) {
$dynamic_height = $params['options']['viewport']['height'];
}
// Width page A4.
$width = 794;
if (isset($params['options']['viewport']) === true
&& isset($params['options']['viewport']['width']) === true
@ -4260,26 +4272,22 @@ function generator_chart_to_pdf(
}
$clip = new Clip(0, 0, $width, $dynamic_height);
$b64 = $page->screenshot(['clip' => $clip])->getBase64();
if ($params['return_img_base_64']) {
$b64 = $page->screenshot(['clip' => $clip])->getBase64();
// To be used in alerts.
return $b64;
} else {
// To be used in PDF files.
$b64 = $page->screenshot(['clip' => $clip])->saveToFile($img_path);
$config['temp_images'][] = $img_path;
return '<img src="'.$img_url.'" />';
}
} catch (\Throwable $th) {
hd($th, true);
} finally {
$browser->close();
}
// TODO: XXX chartjs.
/*
if ($params['return_img_base_64']) {
// To be used in alerts.
return $img_content;
} else {
// To be used in PDF files.
$config['temp_images'][] = $img_path;
return '<img src="'.$img_url.'" />';
}
*/
return $b64;
}

View File

@ -2213,10 +2213,6 @@ function graphic_combined_module(
);
$temp_data = db_get_value_sql($query_last_value);
$agent_name = io_safe_output(
modules_get_agentmodule_agent_name($module)
);
if (empty($params_combined['labels']) === false
&& isset($params_combined['labels'][$module]) === true
) {
@ -2230,7 +2226,11 @@ function graphic_combined_module(
);
if ($params['vconsole'] === true) {
if ($width < 250 || $height < 250) {
$label = \ui_print_truncate_text($module_data['nombre'], 3, false);
$label = substr(
io_safe_output($module_data['nombre']),
0,
5
);
} else {
$label = $module_data['nombre'];
}
@ -2239,14 +2239,7 @@ function graphic_combined_module(
}
}
if ($params_combined['stacked'] == CUSTOM_GRAPH_VBARS) {
$temp[] = [
'tick' => $label,
'data' => (int) round($temp_data, 4),
];
} else {
$temp[$label]['g'] = round($temp_data, 4);
}
$temp[io_safe_output($label)] = round($temp_data, 4);
if (is_metaconsole() === true) {
metaconsole_restore_db();
@ -2255,71 +2248,45 @@ function graphic_combined_module(
$i++;
}
$color = color_graph_array();
$graph_values = $temp;
// TODO: XXX chartjs.
$color = color_graph_array();
$width = null;
$height = null;
if ($params['vconsole'] === true) {
$water_mark = '';
}
$options = [
'width' => $width,
'height' => $height,
'waterMark' => $water_mark,
'ttl' => $ttl,
'background' => $background_color,
'pdf' => $params['pdf'],
'legend' => ['display' => false],
'scales' => [
'x' => [
'bounds' => 'data',
'grid' => ['display' => false],
],
'y' => [
'grid' => ['display' => false],
],
],
];
if ($params_combined['stacked'] == CUSTOM_GRAPH_HBARS) {
if ($params['vconsole'] === false) {
$width = 1024;
$height = 500;
} else {
$water_mark = false;
}
$output = hbar_graph(
$graph_values,
$width,
$height,
$color,
$module_name_list,
$long_index,
ui_get_full_url(
'images/image_problem_area_small.png',
false,
false,
false
),
'',
'',
$water_mark,
$config['fontpath'],
$fixed_font_size,
'',
$ttl,
$homeurl,
$background_color,
'#c1c1c1',
null,
null,
false,
$params['pdf']
);
$options['axis'] = 'y';
}
if ($params_combined['stacked'] == CUSTOM_GRAPH_VBARS) {
$options = [];
$sizeLabelTickWidth = 85;
if ($params['vconsole'] === true) {
$water_mark = false;
if (isset($width) === true) {
$sizeLabelTickWidth = 30;
}
} else {
$options['grid']['hoverable'] = true;
}
$options['generals']['rotate'] = true;
$options['generals']['forceTicks'] = true;
$options['x']['labelWidth'] = ($params['pdf'] === true) ? 30 : $sizeLabelTickWidth;
$options['generals']['arrayColors'] = $color;
$options['grid']['backgroundColor'] = $background_color;
$options['y']['color'] = $background_color;
$options['x']['color'] = $background_color;
$options['pdf'] = $params['pdf'];
$output = vbar_graph($graph_values, $options, $ttl);
}
$output = '<div style="display: flex; flex-direction:row; justify-content: center; align-items: center; align-content: center; width:100%; height:100%;">';
$output .= '<div style="flex: 0 0 auto; width:99%; height:100%;">';
$output .= vbar_graph($graph_values, $options);
$output .= '</div>';
$output .= '</div>';
break;
case CUSTOM_GRAPH_PIE:
@ -2387,7 +2354,6 @@ function graphic_combined_module(
}
}
// $temp['total_modules'] = ['value' => $total_modules];
$graph_values = $temp;
if ($params['vconsole'] === false) {
@ -2568,14 +2534,12 @@ function graphic_agentaccess(
// Array data.
$data_array = [];
$colors = [];
if (isset($data) === true && is_array($data) === true) {
foreach ($data as $key => $value) {
foreach ($data as $value) {
$time = (date('H:m', $value['utimestamp']));
$data_array[] = [
'tick' => $time,
'data' => (int) $value['data'],
'color' => '#82b92f',
];
$data_array[$time] = (int) $value['data'];
$colors[] = '#82b92f';
}
}
@ -2586,17 +2550,28 @@ function graphic_agentaccess(
$options['agent_view'] = true;
}
if ($return === true) {
return vbar_graph($data_array, $options, 1);
} else {
$options['generals']['pdf']['width'] = 350;
$options['generals']['pdf']['height'] = 125;
$imgbase64 = '<img src="data:image/png;base64,';
$imgbase64 .= vbar_graph($data_array, $options, 2);
$imgbase64 .= '" />';
$options = [
'width' => 350,
'height' => 125,
'colors' => $colors,
'legend' => ['display' => false],
'scales' => [
'x' => [
'grid' => ['display' => false],
'ticks' => [
'fonts' => ['size' => 8],
],
],
'y' => [
'grid' => ['display' => false],
'ticks' => [
'fonts' => ['size' => 8],
],
],
],
];
return $imgbase64;
}
return vbar_graph($data_array, $options);
}
@ -2779,97 +2754,6 @@ function graph_agent_status(
}
/**
* Print a pie graph with events data of agent
*
* @param integer width pie graph width
* @param integer height pie graph height
* @param integer id_agent Agent ID
*/
function graph_event_module($width=300, $height=200, $id_agent=null)
{
global $config;
global $graphic_type;
// Fix: tag filters implemented! for tag functionality groups have to be all user_groups (propagate ACL funct!)
$groups = users_get_groups($config['id_user']);
$tags_condition = tags_get_acl_tags($config['id_user'], array_keys($groups), 'ER', 'event_condition', 'AND');
$data = [];
$max_items = 6;
switch ($config['dbtype']) {
case 'mysql':
case 'postgresql':
$sql = sprintf(
'SELECT COUNT(id_evento) AS count_number,
id_agentmodule
FROM tevento
WHERE tevento.id_agente = %d %s
GROUP BY id_agentmodule ORDER BY count_number DESC LIMIT %d',
$id_agent,
$tags_condition,
$max_items
);
break;
case 'oracle':
$sql = sprintf(
'SELECT COUNT(id_evento) AS count_number,
id_agentmodule
FROM tevento
WHERE tevento.id_agente = %d AND rownum <= %d
GROUP BY id_agentmodule ORDER BY count_number DESC',
$id_agent,
$max_items
);
break;
}
$events = db_get_all_rows_sql($sql);
if ($events === false) {
if (! $graphic_type) {
return fs_error_image();
}
graphic_error();
return;
}
foreach ($events as $event) {
if ($event['id_agentmodule'] == 0) {
$key = __('System').' ('.$event['count_number'].')';
} else {
$key = modules_get_agentmodule_name($event['id_agentmodule']).' ('.$event['count_number'].')';
}
$data[$key] = $event['count_number'];
}
if ($config['fixed_graph'] == false) {
$water_mark = [
'file' => $config['homedir'].'/images/logo_vertical_water.png',
'url' => ui_get_full_url('images/logo_vertical_water.png', false, false, false),
];
}
hd('aaaaaaaaaaa');
return pie_graph(
$data,
$width,
$height,
__('other'),
'',
$water_mark,
$config['fontpath'],
$config['font_size'],
1,
'bottom'
);
}
function progress_bar($progress, $width, $height, $title='', $mode=1, $value_text=false, $color=false, $options=false)
{
global $config;
@ -3032,16 +2916,25 @@ function grafico_incidente_prioridad()
];
}
return pie_graph(
$options = [
'width' => 320,
'height' => 200,
'waterMark' => $water_mark,
'legend' => [
'display' => true,
'position' => 'right',
'align' => 'center',
],
];
$output = '<div style="width:inherit;margin: 0 auto;">';
$output .= pie_graph(
$data,
320,
200,
__('Other'),
'',
'',
$config['fontpath'],
$config['font_size']
$options
);
$output .= '</div>';
return $output;
}
@ -3077,16 +2970,25 @@ function graph_incidents_status()
];
}
return pie_graph(
$options = [
'width' => 320,
'height' => 200,
'waterMark' => $water_mark,
'legend' => [
'display' => true,
'position' => 'right',
'align' => 'center',
],
];
$output = '<div style="width:inherit;margin: 0 auto;">';
$output .= pie_graph(
$data,
320,
200,
__('Other'),
'',
'',
$config['fontpath'],
$config['font_size']
$options
);
$output .= '</div>';
return $output;
}
@ -3118,16 +3020,25 @@ function graphic_incident_group()
];
}
return pie_graph(
$options = [
'width' => 320,
'height' => 200,
'waterMark' => $water_mark,
'legend' => [
'display' => true,
'position' => 'right',
'align' => 'center',
],
];
$output = '<div style="width:inherit;margin: 0 auto;">';
$output .= pie_graph(
$data,
320,
200,
__('Other'),
'',
'',
$config['fontpath'],
$config['font_size']
$options
);
$output .= '</div>';
return $output;
}
@ -3160,93 +3071,25 @@ function graphic_incident_user()
];
}
return pie_graph(
$options = [
'width' => 320,
'height' => 200,
'waterMark' => $water_mark,
'legend' => [
'display' => true,
'position' => 'right',
'align' => 'center',
],
];
$output = '<div style="width:inherit;margin: 0 auto;">';
$output .= pie_graph(
$data,
320,
200,
__('Other'),
'',
'',
$config['fontpath'],
$config['font_size']
$options
);
}
$output .= '</div>';
/**
* Print a pie graph with access data of incidents source
*
* @param integer width pie graph width
* @param integer height pie graph height
*/
function graphic_incident_source($width=320, $height=200)
{
global $config;
global $graphic_type;
$data = [];
$max_items = 5;
switch ($config['dbtype']) {
case 'mysql':
$sql = sprintf(
'SELECT COUNT(id_incidencia) n_incident, origen
FROM tincidencia
GROUP BY `origen`
ORDER BY 1 DESC LIMIT %d',
$max_items
);
break;
case 'postgresql':
$sql = sprintf(
'SELECT COUNT(id_incidencia) n_incident, origen
FROM tincidencia
GROUP BY "origen"
ORDER BY 1 DESC LIMIT %d',
$max_items
);
break;
case 'oracle':
$sql = sprintf(
'SELECT COUNT(id_incidencia) n_incident, origen
FROM tincidencia
WHERE rownum <= %d
GROUP BY origen
ORDER BY 1 DESC',
$max_items
);
break;
}
$origins = db_get_all_rows_sql($sql);
if ($origins == false) {
$origins = [];
}
foreach ($origins as $origin) {
$data[$origin['origen']] = $origin['n_incident'];
}
if ($config['fixed_graph'] == false) {
$water_mark = [
'file' => $config['homedir'].'/images/logo_vertical_water.png',
'url' => ui_get_full_url('images/logo_vertical_water.png', false, false, false),
];
}
return pie_graph(
$data,
$width,
$height,
__('Other'),
'',
'',
$config['fontpath'],
$config['font_size']
);
return $output;
}
@ -3382,10 +3225,10 @@ function grafico_eventos_grupo($width=300, $height=200, $url='', $noWaterMark=tr
}
$options = [
'width' => $width,
'height' => $height,
'water_mark' => $water_mark,
'legend' => [
'width' => $width,
'height' => $height,
'waterMark' => $water_mark,
'legend' => [
'display' => true,
'position' => 'right',
'align' => 'center',
@ -3439,7 +3282,7 @@ function grafico_eventos_total($filter='', $width=320, $height=200, $noWaterMark
);
$criticities = db_get_all_rows_sql($sql, false, false);
if (empty($criticities)) {
if (empty($criticities) === true) {
$criticities = [];
$colors = [];
}
@ -3447,57 +3290,60 @@ function grafico_eventos_total($filter='', $width=320, $height=200, $noWaterMark
foreach ($criticities as $cr) {
switch ($cr['criticity']) {
case EVENT_CRIT_MAINTENANCE:
$data[__('Maintenance')] = $cr['events'];
$data[__('Maintenance').' ('.$cr['events'].')'] = $cr['events'];
$colors[__('Maintenance')] = COL_MAINTENANCE;
break;
case EVENT_CRIT_INFORMATIONAL:
$data[__('Informational')] = $cr['events'];
$data[__('Informational').' ('.$cr['events'].')'] = $cr['events'];
$colors[__('Informational')] = COL_INFORMATIONAL;
break;
case EVENT_CRIT_NORMAL:
$data[__('Normal')] = $cr['events'];
$data[__('Normal').' ('.$cr['events'].')'] = $cr['events'];
$colors[__('Normal')] = COL_NORMAL;
break;
case EVENT_CRIT_MINOR:
$data[__('Minor')] = $cr['events'];
$data[__('Minor').' ('.$cr['events'].')'] = $cr['events'];
$colors[__('Minor')] = COL_MINOR;
break;
case EVENT_CRIT_WARNING:
$data[__('Warning')] = $cr['events'];
$data[__('Warning').' ('.$cr['events'].')'] = $cr['events'];
$colors[__('Warning')] = COL_WARNING;
break;
case EVENT_CRIT_MAJOR:
$data[__('Major')] = $cr['events'];
$data[__('Major').' ('.$cr['events'].')'] = $cr['events'];
$colors[__('Major')] = COL_MAJOR;
break;
case EVENT_CRIT_CRITICAL:
$data[__('Critical')] = $cr['events'];
$data[__('Critical').' ('.$cr['events'].')'] = $cr['events'];
$colors[__('Critical')] = COL_CRITICAL;
break;
default:
// Not possible.
break;
}
}
if ($noWaterMark) {
$water_mark = [];
if ($noWaterMark === true) {
$water_mark = [
'file' => $config['homedir'].'/images/logo_vertical_water.png',
'url' => ui_get_full_url('/images/logo_vertical_water.png', false, false, false),
];
} else {
$water_mark = [];
}
$options = [
'width' => $width,
'height' => $height,
'water_mark' => $water_mark,
'colors' => array_values($colors),
'legend' => [
'width' => $width,
'height' => $height,
'waterMark' => $water_mark,
'colors' => array_values($colors),
'legend' => [
'display' => true,
'position' => 'right',
'align' => 'center',
@ -3611,9 +3457,7 @@ function graph_custom_sql_graph(
}
$data = [];
$count = 0;
$flagOther = false;
foreach ($data_result as $data_item) {
$count++;
$value = 0;
@ -3632,69 +3476,16 @@ function graph_custom_sql_graph(
0,
floor($SQL_GRAPH_MAX_LABEL_SIZE / 2)
);
$label .= '...<br>';
$label .= substr(
$first_label,
floor(-$SQL_GRAPH_MAX_LABEL_SIZE / 2)
);
}
}
switch ($type) {
case 'sql_graph_vbar':
default:
// Vertical bar.
$data[] = [
'tick' => $label.'_'.$count,
'data' => $value,
];
break;
case 'sql_graph_hbar':
// Horizontal bar.
$data[$label.'_'.$count]['g'] = $value;
break;
case 'sql_graph_pie':
// Pie.
$data[$label.'_'.$count] = $value;
break;
}
$data[$label.'_'.$count] = $value;
} else {
switch ($type) {
case 'sql_graph_vbar':
default:
// Vertical bar.
if ($flagOther === false) {
$data[] = [
'tick' => __('Other'),
'data' => $value,
];
$flagOther = true;
}
$data[(count($data) - 1)]['data'] += $value;
break;
case 'sql_graph_hbar':
// Horizontal bar.
if (isset($data[__('Other')]['g']) === false) {
$data[__('Other')]['g'] = 0;
}
$data[__('Other')]['g'] += $value;
break;
case 'sql_graph_pie':
// Pie.
if (isset($data[__('Other')]) === false) {
$data[__('Other')] = 0;
}
$data[__('Other')] += $value;
break;
if (isset($data[__('Other')]) === false) {
$data[__('Other')] = 0;
}
$data[__('Other')] += $value;
}
}
@ -3711,57 +3502,38 @@ function graph_custom_sql_graph(
}
$output = '';
if ((int) $ttl === 2) {
$output .= '<img src="data:image/png;base64,';
} else {
$output .= '<div style="margin: 0 auto;">';
}
switch ($type) {
case 'sql_graph_vbar':
default:
// Vertical bar.
$color = color_graph_array();
$options = [];
$options['generals']['rotate'] = true;
$options['generals']['forceTicks'] = true;
$options['generals']['arrayColors'] = $color;
$options['x']['labelWidth'] = 75;
$options['pdf'] = $only_image;
if ($ttl === 2) {
$options['x']['labelWidth'] = 35;
$options['backgroundColor'] = 'transparent';
$options['grid']['backgroundColor'] = 'transparent';
$options['y']['color'] = 'transparent';
$options['x']['color'] = 'transparent';
$options['generals']['pdf']['width'] = $width;
$options['generals']['pdf']['height'] = $height;
$output .= '<img src="data:image/png;base64,';
$output .= vbar_graph($data, $options, $ttl);
$output .= '" />';
} else {
$options['grid']['hoverable'] = true;
$output = '<div style="width:100%; height:'.$height.'px">';
$output .= vbar_graph($data, $options, $ttl);
$output .= '</div>';
}
break;
case 'sql_graph_hbar':
// Horizontal bar.
$output .= hbar_graph(
default:
$options = [
'height' => $height,
'waterMark' => $water_mark,
'ttl' => $ttl,
'legend' => ['display' => false],
'scales' => [
'x' => [
'grid' => ['display' => false],
],
'y' => [
'grid' => ['display' => false],
],
],
];
if ($type === 'sql_graph_hbar') {
$options['axis'] = 'y';
}
$output .= vbar_graph(
$data,
$width,
$height,
[],
[],
'',
'',
'',
'',
$water_mark,
$config['fontpath'],
$config['font_size'],
false,
$ttl,
$homeurl,
'white',
'#c1c1c1'
$options
);
break;
@ -3771,28 +3543,27 @@ function graph_custom_sql_graph(
'height' => $height,
'waterMark' => $water_mark,
'ttl' => $ttl,
'legend' => [
'display' => true,
'position' => 'right',
'align' => 'center',
],
];
if ((int) $ttl === 2) {
$output .= '<img src="data:image/png;base64,';
} else {
$output .= '<div style="margin: 0 auto; width:'.$options_charts['width'].'px;">';
}
// Pie.
$output .= pie_graph(
$data,
$options
);
if ((int) $ttl === 2) {
$output .= '" />';
} else {
$output .= '</div>';
}
break;
}
if ((int) $ttl === 2) {
$output .= '" />';
} else {
$output .= '</div>';
}
return $output;
}
@ -4698,21 +4469,37 @@ function graph_netflow_aggregate_pie($data, $aggregate, $ttl=1, $only_image=fals
];
}
return pie_graph(
$options = [
'height' => 230,
'waterMark' => $water_mark,
'ttl' => $ttl,
'legend' => [
'display' => true,
'position' => 'right',
'align' => 'center',
],
];
$output = '';
if ((int) $ttl === 2) {
$output .= '<img src="data:image/png;base64,';
} else {
$output .= '<div style="margin: 0 auto; width:500px;">';
}
// Pie.
$output .= pie_graph(
$values,
370,
200,
__('Other'),
$config['homeurl'],
$water_mark,
$config['fontpath'],
$config['font_size'],
$ttl,
false,
'',
false,
6
$options
);
if ((int) $ttl === 2) {
$output .= '" />';
} else {
$output .= '</div>';
}
return $output;
}

View File

@ -1893,7 +1893,7 @@ function reporting_event_top_n(
}
$data_pie_graph[$item_name] = $data_top[$key_an];
$data_hbar[$item_name]['g'] = $data_top[$key_an];
$data_hbar[io_safe_output($item_name)] = $data_top[$key_an];
$divisor = get_data_multiplier($units[$key_an]);
@ -1924,39 +1924,68 @@ function reporting_event_top_n(
$return['charts']['pie'] = null;
if ($show_graph != REPORT_TOP_N_ONLY_TABLE) {
$options_charts = [
'viewport' => [
'width' => 500,
'height' => 0,
],
'legend' => [
'display' => true,
'position' => 'right',
'align' => 'center',
],
'ttl' => $ttl,
];
if ((int) $ttl === 2) {
$return['charts']['pie'] = '<img src="data:image/png;base64,';
} else {
$return['charts']['pie'] = '<div style="margin: 0 auto; width:'.$width.'px;">';
}
arsort($data_pie_graph);
$return['charts']['pie'] = pie_graph(
$return['charts']['pie'] .= pie_graph(
$data_pie_graph,
$width,
$height,
__('other'),
ui_get_full_url(false, true, false, false).'/',
ui_get_full_url(false, false, false, false).'/images/logo_vertical_water.png',
$config['fontpath'],
$config['font_size'],
$ttl
$options_charts
);
// Display bars graph.
$return['charts']['bars'] = hbar_graph(
if ((int) $ttl === 2) {
$return['charts']['pie'] .= '" />';
} else {
$return['charts']['pie'] .= '</div>';
}
if ((int) $ttl === 2) {
$return['charts']['bars'] = '<img src="data:image/png;base64,';
} else {
$return['charts']['bars'] = '<div style="margin: 0 auto; width:'.$width.'px;">';
}
$options = [
'height' => (count($data_hbar) * 30),
'ttl' => $ttl,
'axis' => 'y',
'legend' => ['display' => false],
'scales' => [
'x' => [
'grid' => ['display' => false],
],
'y' => [
'grid' => ['display' => false],
],
],
];
$return['charts']['bars'] .= vbar_graph(
$data_hbar,
$width,
(count($data_hbar) * 50),
[],
[],
'',
'',
false,
false,
$config['homedir'].'/images/logo_vertical_water.png',
$config['fontpath'],
$config['font_size'],
true,
$ttl,
$config['homeurl'],
'white',
'#DFDFDF'
$options
);
if ((int) $ttl === 2) {
$return['charts']['bars'] .= '" />';
} else {
$return['charts']['bars'] .= '</div>';
}
}
$return['resume'] = null;
@ -3811,8 +3840,8 @@ function reporting_exception(
$data_hbar = [];
foreach ($items as $key => $item) {
if ($show_graph == 1 || $show_graph == 2) {
// TODO: Find a better way to show the graphs
$data_hbar[$item['agent'].' - '.$item['operation']]['g'] = $item['value'];
// TODO: Find a better way to show the graphs.
$data_hbar[io_safe_output($item['agent'].' - '.$item['operation'])] = $item['value'];
$data_pie_graph[$item['agent'].' - '.$item['operation']] = $item['value'];
}
@ -3845,40 +3874,68 @@ function reporting_exception(
$height = $force_height_chart;
}
$return['chart']['pie'] = pie_graph(
$options_charts = [
'viewport' => [
'width' => 500,
'height' => 0,
],
'legend' => [
'display' => true,
'position' => 'right',
'align' => 'center',
],
'ttl' => $ttl,
];
if ((int) $ttl === 2) {
$return['chart']['pie'] = '<img src="data:image/png;base64,';
} else {
$return['chart']['pie'] = '<div style="margin: 0 auto; width:600px;">';
}
arsort($data_pie_graph);
$return['chart']['pie'] .= pie_graph(
$data_pie_graph,
600,
150,
__('other'),
ui_get_full_url(false, false, false, false),
ui_get_full_url(false, false, false, false).'/images/logo_vertical_water.png',
$config['fontpath'],
$config['font_size'],
$ttl
$options_charts
);
$params = [
'chart_data' => $data_hbar,
'width' => 600,
'height' => (25 * count($data_hbar)),
'color' => [],
'legend' => [],
'long_index' => [],
'no_data_image' => ui_get_full_url('images/image_problem_area_small.png', false, false, false),
'xaxisname' => '',
'yaxisname' => '',
'water_mark' => ui_get_full_url(false, false, false, false).'/images/logo_vertical_water.png',
'font' => '',
'font_size' => '',
'unit' => '',
'ttl' => $ttl,
'homeurl' => ui_get_full_url(false, false, false, false),
'backgroundColor' => 'white',
if ((int) $ttl === 2) {
$return['chart']['pie'] .= '" />';
} else {
$return['chart']['pie'] .= '</div>';
}
if ((int) $ttl === 2) {
$return['chart']['hbar'] = '<img src="data:image/png;base64,';
} else {
$return['chart']['hbar'] = '<div style="margin: 0 auto; width:'.$width.'px;">';
}
$options = [
'height' => (count($data_hbar) * 30),
'ttl' => $ttl,
'axis' => 'y',
'legend' => ['display' => false],
'scales' => [
'x' => [
'grid' => ['display' => false],
],
'y' => [
'grid' => ['display' => false],
],
],
];
$return['chart']['hbar'] = call_user_func_array(
'hbar_graph',
array_values(($params ?? []))
$return['chart']['hbar'] .= vbar_graph(
$data_hbar,
$options
);
if ((int) $ttl === 2) {
$return['chart']['hbar'] .= '" />';
} else {
$return['chart']['hbar'] .= '</div>';
}
}
if ($content['show_resume'] && $i > 0) {
@ -4211,19 +4268,40 @@ function reporting_event_report_agent(
$return['chart']['by_criticity'] = null;
$return['chart']['validated_vs_unvalidated'] = null;
$options_charts = [
'width' => 500,
'height' => 150,
'radius' => null,
'viewport' => [
'width' => 500,
'height' => 0,
],
'legend' => [
'display' => true,
'position' => 'right',
'align' => 'center',
],
'ttl' => $ttl,
];
if ($event_graph_by_user_validator) {
$data_graph_by_user = events_get_count_events_validated_by_user($return['data']);
$return['chart']['by_user_validator'] = pie_graph(
if ((int) $ttl === 2) {
$return['chart']['by_user_validator'] = '<img src="data:image/png;base64,';
} else {
$return['chart']['by_user_validator'] = '<div style="margin: 0 auto; width:'.$options_charts['width'].'px;">';
}
$return['chart']['by_user_validator'] .= pie_graph(
$data_graph_by_user,
500,
150,
__('other'),
ui_get_full_url(false, false, false, false),
ui_get_full_url(false, false, false, false).'/images/logo_vertical_water.png',
$config['fontpath'],
$config['font_size'],
$ttl
$options_charts
);
if ((int) $ttl === 2) {
$return['chart']['by_user_validator'] .= '" />';
} else {
$return['chart']['by_user_validator'] .= '</div>';
}
}
if ($event_graph_by_criticity) {
@ -4240,20 +4318,26 @@ function reporting_event_report_agent(
}
$colors = get_criticity_pie_colors($data_graph_by_criticity);
$options_charts['colors'] = array_values($colors);
$return['chart']['by_criticity'] = pie_graph(
if ((int) $ttl === 2) {
$return['chart']['by_criticity'] = '<img src="data:image/png;base64,';
} else {
$return['chart']['by_criticity'] = '<div style="margin: 0 auto; width:'.$options_charts['width'].'px;">';
}
$return['chart']['by_criticity'] .= pie_graph(
$data_graph_by_criticity,
500,
150,
__('other'),
ui_get_full_url(false, false, false, false),
ui_get_full_url(false, false, false, false).'/images/logo_vertical_water.png',
$config['fontpath'],
$config['font_size'],
$ttl,
false,
$colors
$options_charts
);
if ((int) $ttl === 2) {
$return['chart']['by_criticity'] .= '" />';
} else {
$return['chart']['by_criticity'] .= '</div>';
}
unset($options_charts['colors']);
}
if ($event_graph_validated_vs_unvalidated) {
@ -4273,17 +4357,22 @@ function reporting_event_report_agent(
}
}
$return['chart']['validated_vs_unvalidated'] = pie_graph(
if ((int) $ttl === 2) {
$return['chart']['validated_vs_unvalidated'] = '<img src="data:image/png;base64,';
} else {
$return['chart']['validated_vs_unvalidated'] = '<div style="margin: 0 auto; width:'.$options_charts['width'].'px;">';
}
$return['chart']['validated_vs_unvalidated'] .= pie_graph(
$data_graph_by_status,
500,
150,
__('other'),
ui_get_full_url(false, false, false, false),
ui_get_full_url(false, false, false, false).'/images/logo_vertical_water.png',
$config['fontpath'],
$config['font_size'],
$ttl
$options_charts
);
if ((int) $ttl === 2) {
$return['chart']['validated_vs_unvalidated'] .= '" />';
} else {
$return['chart']['validated_vs_unvalidated'] .= '</div>';
}
}
// Total events.
@ -5155,111 +5244,32 @@ function reporting_custom_render($report, $content, $type='dinamic', $pdf=0)
$height = $data_macro['height'];
}
// TODO: Allow to paint horizontal and vertical bar graphs for the moment only pie graphs.
$type = 'sql_graph_pie';
$options = [
'width' => $width,
'height' => $height,
'ttl' => ($pdf === true) ? 2 : 1,
'legend' => [
'display' => true,
'position' => 'right',
'align' => 'center',
],
];
$SQL_GRAPH_MAX_LABEL_SIZE = 5;
$count = 0;
$flagOther = false;
foreach ($data_query as $data_item) {
$count++;
$value = 0;
if (empty($data_item['value']) === false) {
$value = $data_item['value'];
}
if ($count <= 5) {
$label = __('Data');
if (empty($data_item['label']) === false) {
$label = io_safe_output($data_item['label']);
if (strlen($label) > $SQL_GRAPH_MAX_LABEL_SIZE) {
$first_label = $label;
$label = substr(
$first_label,
0,
floor($SQL_GRAPH_MAX_LABEL_SIZE / 2)
);
$label .= '...<br>';
$label .= substr(
$first_label,
floor(-$SQL_GRAPH_MAX_LABEL_SIZE / 2)
);
}
}
switch ($type) {
case 'sql_graph_vbar':
default:
// Vertical bar.
$data[] = [
'tick' => $label.'_'.$count,
'data' => $value,
];
break;
case 'sql_graph_hbar':
// Horizontal bar.
$data[$label.'_'.$count]['g'] = $value;
break;
case 'sql_graph_pie':
// Pie.
$data[$label.'_'.$count] = $value;
break;
}
} else {
switch ($type) {
case 'sql_graph_vbar':
default:
// Vertical bar.
if ($flagOther === false) {
$data[] = [
'tick' => __('Other'),
'data' => $value,
];
$flagOther = true;
}
$data[(count($data) - 1)]['data'] += $value;
break;
case 'sql_graph_hbar':
// Horizontal bar.
if (isset($data[__('Other')]['g']) === false) {
$data[__('Other')]['g'] = 0;
}
$data[__('Other')]['g'] += $value;
break;
case 'sql_graph_pie':
// Pie.
if (isset($data[__('Other')]) === false) {
$data[__('Other')] = 0;
}
$data[__('Other')] += $value;
break;
}
}
}
$value_query = pie_graph(
$data,
$width,
$height,
__('other'),
ui_get_full_url(false, false, false, false),
'',
$config['fontpath'],
$config['font_size'],
($pdf === true) ? 2 : 1,
'hidden',
'',
true
$data = array_reduce(
$data_query,
function ($carry, $item) {
$carry[$item['label']] = $item['value'];
return $carry;
},
[]
);
$value_query = '<div style="width:'.$width.'px;">';
$value_query .= pie_graph(
$data,
$options
);
$value_query .= '</div>';
}
}
@ -10877,19 +10887,40 @@ function reporting_get_module_detailed_event(
$height = $force_height_chart;
}
$options_charts = [
'width' => 500,
'height' => 150,
'radius' => null,
'viewport' => [
'width' => 500,
'height' => 0,
],
'legend' => [
'display' => true,
'position' => 'right',
'align' => 'center',
],
'ttl' => $ttl,
];
if ($event_graph_by_user_validator) {
$data_graph_by_user = events_get_count_events_validated_by_user($event['data']);
$event['chart']['by_user_validator'] = pie_graph(
if ((int) $ttl === 2) {
$event['chart']['by_user_validator'] = '<img src="data:image/png;base64,';
} else {
$event['chart']['by_user_validator'] = '<div style="margin: 0 auto; width:'.$options_charts['width'].'px;">';
}
$event['chart']['by_user_validator'] .= pie_graph(
$data_graph_by_user,
500,
150,
__('other'),
ui_get_full_url(false, false, false, false),
ui_get_full_url(false, false, false, false).'/images/logo_vertical_water.png',
$config['fontpath'],
$config['font_size'],
$ttl
$options_charts
);
if ((int) $ttl === 2) {
$event['chart']['by_user_validator'] .= '" />';
} else {
$event['chart']['by_user_validator'] .= '</div>';
}
}
if ($event_graph_by_criticity) {
@ -10906,20 +10937,26 @@ function reporting_get_module_detailed_event(
}
$colors = get_criticity_pie_colors($data_graph_by_criticity);
$options_charts['colors'] = array_values($colors);
$event['chart']['by_criticity'] = pie_graph(
if ((int) $ttl === 2) {
$event['chart']['by_criticity'] = '<img src="data:image/png;base64,';
} else {
$event['chart']['by_criticity'] = '<div style="margin: 0 auto; width:'.$options_charts['width'].'px;">';
}
$event['chart']['by_criticity'] .= pie_graph(
$data_graph_by_criticity,
500,
150,
__('other'),
ui_get_full_url(false, false, false, false),
ui_get_full_url(false, false, false, false).'/images/logo_vertical_water.png',
$config['fontpath'],
$config['font_size'],
$ttl,
false,
$colors
$options_charts
);
if ((int) $ttl === 2) {
$event['chart']['by_criticity'] .= '" />';
} else {
$event['chart']['by_criticity'] .= '</div>';
}
unset($options_charts['colors']);
}
if ($event_graph_validated_vs_unvalidated) {
@ -10939,17 +10976,22 @@ function reporting_get_module_detailed_event(
}
}
$event['chart']['validated_vs_unvalidated'] = pie_graph(
if ((int) $ttl === 2) {
$event['chart']['validated_vs_unvalidated'] = '<img src="data:image/png;base64,';
} else {
$event['chart']['validated_vs_unvalidated'] = '<div style="margin: 0 auto; width:'.$options_charts['width'].'px;">';
}
$event['chart']['validated_vs_unvalidated'] .= pie_graph(
$data_graph_by_status,
500,
150,
__('other'),
ui_get_full_url(false, false, false, false),
ui_get_full_url(false, false, false, false).'/images/logo_vertical_water.png',
$config['fontpath'],
$config['font_size'],
$ttl
$options_charts
);
if ((int) $ttl === 2) {
$event['chart']['validated_vs_unvalidated'] .= '" />';
} else {
$event['chart']['validated_vs_unvalidated'] .= '</div>';
}
}
if (!empty($event)) {

View File

@ -2344,7 +2344,7 @@ function get_if_module_is_image($id_module)
}
function get_bars_module_data($id_module, $vBars=false)
function get_bars_module_data($id_module)
{
// This charts is only serialize graphs.
// In other string show image no data to show.
@ -2355,7 +2355,7 @@ function get_bars_module_data($id_module, $vBars=false)
);
$values = false;
// avoid showing the image type modules. WUX
// Avoid showing the image type modules. WUX.
if (strpos($mod_values, 'data:image/png;base64') !== 0) {
if (preg_match("/\r\n/", $mod_values)) {
$values = explode("\r\n", $mod_values);
@ -2373,19 +2373,9 @@ function get_bars_module_data($id_module, $vBars=false)
return false;
}
if ($vBars === false) {
foreach ($values as $val) {
$data = explode(',', $val);
$values_to_return[$data[0]] = ['g' => $data[1]];
}
} else {
foreach ($values as $val) {
$data = explode(',', $val);
$values_to_return[] = [
'tick' => $data[0],
'data' => $data[1],
];
}
foreach ($values as $val) {
$data = explode(',', $val);
$values_to_return[$data[0]] = $data[1];
}
return $values_to_return;

File diff suppressed because one or more lines are too long

View File

@ -154,19 +154,37 @@ function progressbar(
/**
* Draw vertical bars graph.
*
* @param array $data Data chart.
* @param array $params Params draw chart.
* @param integer $ttl Pdf option.
* @param array $chart_data Data chart.
* @param array $params Params draw chart.
* @param integer $ttl Pdf option.
*
* @return mixed
*/
function vbar_graph(
array $data,
array $chart_data,
array $options,
int $ttl=1
) {
global $config;
if (empty($chart_data) === true) {
return graph_nodata_image($options);
}
if (isset($options['ttl']) === true && (int) $options['ttl'] === 2) {
$params = [
'chart_data' => $chart_data,
'options' => $options,
'return_img_base_64' => true,
];
return generator_chart_to_pdf('vbar_graph', $params);
}
$chart = get_build_setup_charts('BAR', $options, $chart_data);
$output = $chart->render(true);
return $output;
// INFO IN: https://github.com/flot/flot/blob/master/API.md.
// Xaxes chart Title.
if (isset($options['x']['title']['title']) === false) {
@ -769,29 +787,55 @@ function hbar_graph(
}
/**
* Pie graph PIE.
*
* @param array $chart_data Data.
* @param array $options Options.
*
* @return string Output html charts
*/
function pie_graph(
$chart_data,
$options
) {
/*
$width,
$height,
$others_str='other',
$homedir='',
$water_mark='',
$font='',
$font_size=8,
$ttl=1,
$legend_position=false,
$colors='',
$hide_labels=false,
$max_values=9
*/
if (empty($chart_data) === true) {
return graph_nodata_image($options);
}
// Remove the html_entities.
$temp = [];
foreach ($chart_data as $key => $value) {
$temp[io_safe_output($key)] = $value;
}
$chart_data = $temp;
// Number max elements.
$max_values = (isset($options['maxValues']) === true) ? $options['maxValues'] : 9;
if (count($chart_data) > $max_values) {
$others_str = (isset($options['otherStr']) === true) ? $options['otherStr'] : __('Others');
$chart_data_trunc = [];
$n = 1;
foreach ($chart_data as $key => $value) {
if ($n < $max_values) {
$chart_data_trunc[$key] = $value;
} else {
if (isset($chart_data_trunc[$others_str]) === true) {
$chart_data_trunc[$others_str] = 0;
}
if (empty($value) === false) {
$chart_data_trunc[$others_str] += $value;
}
}
$n++;
}
$chart_data = $chart_data_trunc;
}
if ((int) $options['ttl'] === 2) {
$params = [
'chart_data' => $chart_data,
@ -805,72 +849,6 @@ function pie_graph(
$chart = get_build_setup_charts('PIE', $options, $chart_data);
$output = $chart->render(true, true);
return $output;
/*
if ($water_mark !== false) {
setup_watermark($water_mark, $water_mark_file, $water_mark_url);
}
// This library allows only 8 colors.
// $max_values = 9;
// Remove the html_entities.
$temp = [];
foreach ($chart_data as $key => $value) {
$temp[io_safe_output($key)] = $value;
}
$chart_data = $temp;
if (count($chart_data) > $max_values) {
$chart_data_trunc = [];
$n = 1;
foreach ($chart_data as $key => $value) {
if ($n < $max_values) {
$chart_data_trunc[$key] = $value;
} else {
if (!isset($chart_data_trunc[$others_str])) {
$chart_data_trunc[$others_str] = 0;
}
$chart_data_trunc[$others_str] += $value;
}
$n++;
}
$chart_data = $chart_data_trunc;
}
if ($ttl == 2) {
$params = [
'values' => array_values($chart_data),
'keys' => array_keys($chart_data),
'width' => $width,
'height' => $height,
'water_mark_url' => $water_mark_url,
'font' => $font,
'font_size' => $font_size,
'legend_position' => $legend_position,
'colors' => $colors,
'hide_labels' => $hide_labels,
];
return generator_chart_to_pdf('pie_chart', $params);
}
return flot_pie_chart(
array_values($chart_data),
array_keys($chart_data),
$width,
$height,
$water_mark_url,
$font,
$font_size,
$legend_position,
$colors,
$hide_labels
);
*/
}
@ -887,16 +865,12 @@ function ring_graph(
$options
) {
global $config;
// TODO: XXX chartjs.
// $ttl
// $hide_labels
// $background_color
// $pdf
if (empty($chart_data) === true) {
return graph_nodata_image($options);
}
if ((int) $options['ttl'] === 2) {
if (isset($options['ttl']) === true && (int) $options['ttl'] === 2) {
$params = [
'chart_data' => $chart_data,
'options' => $options,
@ -927,6 +901,10 @@ function get_build_setup_charts($type, $options, $data)
$chart = $factory->create($factory::PIE);
break;
case 'BAR':
$chart = $factory->create($factory::BAR);
break;
default:
// code...
break;
@ -941,6 +919,7 @@ function get_build_setup_charts($type, $options, $data)
'radius' => null,
'rotation' => null,
'circumference' => null,
'axis' => 'y',
'legend' => [
'display' => true,
'position' => 'top',
@ -967,6 +946,52 @@ function get_build_setup_charts($type, $options, $data)
'lineHeight' => 1.2,
],
],
'dataLabel' => [
'display' => true,
'color' => '',
'clip' => true,
'clamp' => true,
'formatter' => 'namefunction',
'fonts' => [
'family' => '',
'size' => 12,
'style' => 'normal',
'weight' => null,
'lineHeight' => 1.2,
],
],
'scales' => [
'x' => [
'grid' => [
'display' => false,
'color' => 'orange',
],
'ticks' => [
'fonts' => [
'family' => '',
'size' => 12,
'style' => 'normal',
'weight' => null,
'lineHeight' => 1.2,
],
],
],
'y' => [
'grid' => [
'display' => false,
'color' => 'orange',
],
'ticks' => [
'fonts' => [
'family' => '',
'size' => 12,
'style' => 'normal',
'weight' => null,
'lineHeight' => 1.2,
],
],
],
],
];
// Set Id.
@ -1060,6 +1085,68 @@ function get_build_setup_charts($type, $options, $data)
$chart->options()->getPlugins()->getLegend()->setAlign($legendAlign);
// Display labels.
if (isset($options['dataLabel']) === true
&& empty($options['dataLabel']) === false
&& is_array($options['dataLabel']) === true
) {
$dataLabel = $chart->options()->getPlugins()->getDataLabel();
$chart->addPlugin('ChartDataLabels');
$dataLabelDisplay = 'auto';
if (isset($options['dataLabel']['display']) === true) {
$dataLabelDisplay = $options['dataLabel']['display'];
}
$dataLabel->setDisplay($dataLabelDisplay);
$dataLabelColor = '#ffffff';
if (isset($options['dataLabel']['color']) === true) {
$dataLabelColor = $options['dataLabel']['color'];
}
$dataLabel->setColor($dataLabelColor);
$dataLabelClip = true;
if (isset($options['dataLabel']['clip']) === true) {
$dataLabelClip = $options['dataLabel']['clip'];
}
$dataLabel->setClip($dataLabelClip);
$dataLabelClamp = true;
if (isset($options['dataLabel']['clamp']) === true) {
$dataLabelClamp = $options['dataLabel']['clamp'];
}
$dataLabel->setClamp($dataLabelClamp);
$dataLabelFormatter = 'formatterDataLabelPie';
if (isset($options['dataLabel']['formatter']) === true) {
$dataLabelFormatter = $options['dataLabel']['formatter'];
}
$dataLabel->setFormatter($dataLabelFormatter);
if (isset($options['dataLabel']['fonts']) === true
&& empty($options['dataLabel']['fonts']) === false
&& is_array($options['dataLabel']['fonts']) === true
) {
if (isset($options['dataLabel']['fonts']['size']) === true) {
$dataLabel->getFonts()->setSize($options['dataLabel']['fonts']['size']);
}
if (isset($options['dataLabel']['fonts']['style']) === true) {
$dataLabel->getFonts()->setStyle($options['dataLabel']['fonts']['style']);
}
if (isset($options['dataLabel']['fonts']['family']) === true) {
$dataLabel->getFonts()->setFamily($options['dataLabel']['fonts']['family']);
}
}
}
// Title.
if (isset($options['title']) === true
&& empty($options['title']) === false
@ -1132,21 +1219,122 @@ function get_build_setup_charts($type, $options, $data)
$chart->setCircumference($options['circumference']);
}
if (isset($options['scales']) === true
&& empty($options['scales']) === false
&& is_array($options['scales']) === true
) {
$scales = $chart->options()->getScales();
if (isset($options['scales']['x']) === true
&& empty($options['scales']['x']) === false
&& is_array($options['scales']['x']) === true
) {
if (isset($options['scales']['x']['bounds']) === true) {
$scales->getX()->setBounds($options['scales']['x']['bounds']);
}
if (isset($options['scales']['x']['grid']) === true
&& empty($options['scales']['x']['grid']) === false
&& is_array($options['scales']['x']['grid']) === true
) {
if (isset($options['scales']['x']['grid']['display']) === true) {
$scales->getX()->grid()->setDrawOnChartArea($options['scales']['x']['grid']['display']);
}
if (isset($options['scales']['x']['grid']['color']) === true) {
$scales->getX()->grid()->setColor($options['scales']['x']['grid']['color']);
}
}
if (isset($options['scales']['x']['ticks']) === true
&& empty($options['scales']['x']['ticks']) === false
&& is_array($options['scales']['x']['ticks']) === true
) {
if (isset($options['scales']['x']['ticks']['fonts']) === true
&& empty($options['scales']['x']['ticks']['fonts']) === false
&& is_array($options['scales']['x']['ticks']['fonts']) === true
) {
$scaleXTicksFonts = $scales->getX()->ticks()->getFonts();
if (isset($options['scales']['x']['ticks']['fonts']['size']) === true) {
$scaleXTicksFonts->setSize($options['scales']['x']['ticks']['fonts']['size']);
}
if (isset($options['scales']['x']['ticks']['fonts']['style']) === true) {
$scaleXTicksFonts->setStyle($options['scales']['x']['ticks']['fonts']['style']);
}
if (isset($options['scales']['x']['ticks']['fonts']['family']) === true) {
$scaleXTicksFonts->setFamily($options['scales']['x']['ticks']['fonts']['family']);
}
}
}
}
if (isset($options['scales']['y']) === true
&& empty($options['scales']['y']) === false
&& is_array($options['scales']['y']) === true
) {
if (isset($options['scales']['y']['bounds']) === true) {
$scales->getY()->setBounds($options['scales']['y']['bounds']);
}
if (isset($options['scales']['y']['grid']) === true
&& empty($options['scales']['y']['grid']) === false
&& is_array($options['scales']['y']['grid']) === true
) {
if (isset($options['scales']['y']['grid']['display']) === true) {
$scales->getY()->grid()->setDrawOnChartArea($options['scales']['y']['grid']['display']);
}
if (isset($options['scales']['y']['grid']['color']) === true) {
$scales->getY()->grid()->setColor($options['scales']['y']['grid']['color']);
}
}
if (isset($options['scales']['y']['ticks']) === true
&& empty($options['scales']['y']['ticks']) === false
&& is_array($options['scales']['y']['ticks']) === true
) {
if (isset($options['scales']['y']['ticks']['fonts']) === true
&& empty($options['scales']['y']['ticks']['fonts']) === false
&& is_array($options['scales']['y']['ticks']['fonts']) === true
) {
$scaleYTicksFonts = $scales->getY()->ticks()->getFonts();
if (isset($options['scales']['y']['ticks']['fonts']['size']) === true) {
$scaleYTicksFonts->setSize($options['scales']['y']['ticks']['fonts']['size']);
}
if (isset($options['scales']['y']['ticks']['fonts']['style']) === true) {
$scaleYTicksFonts->setStyle($options['scales']['y']['ticks']['fonts']['style']);
}
if (isset($options['scales']['y']['ticks']['fonts']['family']) === true) {
$scaleYTicksFonts->setFamily($options['scales']['y']['ticks']['fonts']['family']);
}
}
}
}
}
// Color.
if (isset($options['colors']) === true
&& empty($options['colors']) === false
&& is_array($options['colors']) === true
) {
$colors = $options['colors'];
$borders = $options['colors'];
} else {
// Colors.
$defaultColor = [];
$defaultBorder = [];
$defaultColorArray = color_graph_array();
foreach ($defaultColorArray as $key => $value) {
$defaultColor[$key] = $value['color'];
list($r, $g, $b) = sscanf($value['color'], '#%02x%02x%02x');
$defaultColor[$key] = 'rgba('.$r.', '.$g.', '.$b.', 0.6)';
$defaultBorder[$key] = $value['color'];
}
$colors = array_values($defaultColor);
$borders = array_values($defaultBorder);
}
// Set labels.
@ -1154,7 +1342,34 @@ function get_build_setup_charts($type, $options, $data)
// Add Datasets.
$setData = $chart->createDataSet();
$setData->setLabel('data')->setBackgroundColor($colors)->data()->exchangeArray(array_values($data));
switch ($type) {
case 'DOUGHNUT':
case 'PIE':
$setData->setLabel('data')->setBackgroundColor($borders);
$setData->setLabel('data')->data()->exchangeArray(array_values($data));
break;
case 'BAR':
$setData->setLabel('data')->setBackgroundColor($colors);
$setData->setLabel('data')->setBorderColor($borders);
$setData->setLabel('data')->setBorderWidth(2);
$setData->setLabel('data')->data()->exchangeArray(array_values($data));
// Para las horizontales.
if (isset($options['axis']) === true
&& empty($options['axis']) === false
) {
$chart->options()->setIndexAxis($options['axis']);
$setData->setAxis($options['axis']);
}
break;
default:
// code...
break;
}
$chart->addDataSet($setData);
return $chart;

View File

@ -55,6 +55,7 @@ function include_javascript_dependencies_flot_graph($return=false, $mobile=false
// Chartjs.
$output .= '<script language="javascript" type="text/javascript" src="'.ui_get_full_url($metaconsole_hack.'/include/graphs/chartjs/chart.js').'"></script>';
$output .= '<script language="javascript" type="text/javascript" src="'.ui_get_full_url($metaconsole_hack.'/include/graphs/chartjs/chartjs-plugin-datalabels.min.js').'"></script>';
$output .= "
<script type='text/javascript'>

View File

@ -2199,3 +2199,13 @@ function loadPasswordConfig(id, value) {
}
});
}
var formatterDataLabelPie = function(value, ctx) {
let datasets = ctx.chart.data.datasets;
console.log(datasets[0].data);
if (datasets.indexOf(ctx.dataset) === datasets.length - 1) {
let sum = datasets[0].data.reduce((a, b) => parseInt(a) + parseInt(b), 0);
let percentage = ((value * 100) / sum).toFixed(1) + "%";
return percentage;
}
};

View File

@ -476,7 +476,7 @@ class TopNWidget extends Widget
foreach ($modules as $module) {
$module['aliasAgent'] = ui_print_truncate_text($module['aliasAgent'], 20, false, true, false);
$item_name = $module['aliasAgent'].' - '.$module['nameModule'];
$data_hbar[$item_name]['g'] = $module[$display];
$data_hbar[io_safe_output($item_name)] = $module[$display];
// Calculation of max-min values for show in graph.
$calc = (ceil((5 * (float) $module[$display]) / 100) + $module[$display]);
// Set of max-min values for graph.
@ -498,26 +498,23 @@ class TopNWidget extends Widget
$height = (count($data_hbar) * 25 + 35);
$output .= '<div class="container-center">';
$output .= hbar_graph(
array_reverse($data_hbar),
$size['width'],
$height,
[],
[],
'',
'',
'',
'',
$config['homedir'].'/images/logo_vertical_water.png',
$config['fontpath'],
$config['font_size'],
true,
1,
$config['homeurl'],
'white',
'#DFDFDF',
$valueMin,
$valueMax
$options = [
'height' => $height,
'axis' => 'y',
'legend' => ['display' => false],
'scales' => [
'x' => [
'grid' => ['display' => false],
],
'y' => [
'grid' => ['display' => false],
],
],
];
$output .= vbar_graph(
$data_hbar,
$options
);
$output .= '</div>';

View File

@ -474,17 +474,13 @@ class TopNEventByGroupWidget extends Widget
$output .= pie_graph(
$data_pie,
$width,
$height,
__('other'),
'',
false,
$config['fontpath'],
$config['font_size'],
1,
$this->values['legendPosition'],
'',
false
[
'legend' => [
'display' => true,
'position' => 'right',
'align' => 'center',
],
]
);
}

View File

@ -509,17 +509,13 @@ class TopNEventByModuleWidget extends Widget
$output = pie_graph(
$data_pie,
$width,
$height,
__('other'),
'',
false,
$config['fontpath'],
$config['font_size'],
1,
$this->values['legendPosition'],
'',
false
[
'legend' => [
'display' => true,
'position' => 'right',
'align' => 'center',
],
]
);
}

View File

@ -175,7 +175,7 @@ class WuxWidget extends Widget
// Must be configured before using.
$this->configurationRequired = false;
if (empty($this->options) === true) {
if (empty($this->values['agentId']) === true) {
$this->configurationRequired = true;
}

View File

@ -538,7 +538,7 @@ final class Container extends Model
'OR'
);
if ($rows === false) {
if ($row === false) {
return '';
}

View File

@ -226,85 +226,6 @@ final class BarsGraph extends Item
$moduleId = $linkedModule['moduleId'];
$metaconsoleId = $linkedModule['metaconsoleId'];
// Add colors that will use the graphics.
$color = [];
$color[0] = [
'border' => '#000000',
'color' => $config['graph_color1'],
'alpha' => CHART_DEFAULT_ALPHA,
];
$color[1] = [
'border' => '#000000',
'color' => $config['graph_color2'],
'alpha' => CHART_DEFAULT_ALPHA,
];
$color[2] = [
'border' => '#000000',
'color' => $config['graph_color3'],
'alpha' => CHART_DEFAULT_ALPHA,
];
$color[3] = [
'border' => '#000000',
'color' => $config['graph_color4'],
'alpha' => CHART_DEFAULT_ALPHA,
];
$color[4] = [
'border' => '#000000',
'color' => $config['graph_color5'],
'alpha' => CHART_DEFAULT_ALPHA,
];
$color[5] = [
'border' => '#000000',
'color' => $config['graph_color6'],
'alpha' => CHART_DEFAULT_ALPHA,
];
$color[6] = [
'border' => '#000000',
'color' => $config['graph_color7'],
'alpha' => CHART_DEFAULT_ALPHA,
];
$color[7] = [
'border' => '#000000',
'color' => $config['graph_color8'],
'alpha' => CHART_DEFAULT_ALPHA,
];
$color[8] = [
'border' => '#000000',
'color' => $config['graph_color9'],
'alpha' => CHART_DEFAULT_ALPHA,
];
$color[9] = [
'border' => '#000000',
'color' => $config['graph_color10'],
'alpha' => CHART_DEFAULT_ALPHA,
];
$color[11] = [
'border' => '#000000',
'color' => COL_GRAPH9,
'alpha' => CHART_DEFAULT_ALPHA,
];
$color[12] = [
'border' => '#000000',
'color' => COL_GRAPH10,
'alpha' => CHART_DEFAULT_ALPHA,
];
$color[13] = [
'border' => '#000000',
'color' => COL_GRAPH11,
'alpha' => CHART_DEFAULT_ALPHA,
];
$color[14] = [
'border' => '#000000',
'color' => COL_GRAPH12,
'alpha' => CHART_DEFAULT_ALPHA,
];
$color[15] = [
'border' => '#000000',
'color' => COL_GRAPH13,
'alpha' => CHART_DEFAULT_ALPHA,
];
// Maybe connect to node.
$nodeConnected = false;
if (\is_metaconsole() === true && $metaconsoleId !== null) {
@ -320,10 +241,7 @@ final class BarsGraph extends Item
}
}
$moduleData = \get_bars_module_data(
$moduleId,
($typeGraph !== 'horizontal')
);
$moduleData = \get_bars_module_data($moduleId);
if ($moduleData !== false && is_array($moduleData) === true) {
array_pop($moduleData);
}
@ -360,51 +278,44 @@ final class BarsGraph extends Item
$graph = graph_nodata_image(['height' => $height]);
}
} else {
if ($typeGraph === 'horizontal') {
$graph = \hbar_graph(
$moduleData,
$width,
$height,
$color,
[],
[],
'images/image_problem_area.png',
'',
'',
$waterMark,
$config['fontpath'],
$config['fontsize'],
'',
2,
$config['homeurl'],
$backGroundColor,
$gridColor,
null,
null,
true
);
} else {
$options = [];
$options['generals']['rotate'] = true;
$options['generals']['forceTicks'] = true;
$options['generals']['arrayColors'] = $color;
$options['grid']['backgroundColor'] = $backGroundColor;
$options['y']['color'] = $backGroundColor;
$options['x']['color'] = $backGroundColor;
if ($ratio != 0) {
$options['x']['font']['size'] = (($config['font_size'] * $ratio) + 1);
$options['x']['font']['color'] = $gridColor;
$options['y']['font']['size'] = (($config['font_size'] * $ratio) + 1);
$options['y']['font']['color'] = $gridColor;
}
$options['generals']['pdf']['width'] = $width;
$options['generals']['pdf']['width'] = $width;
$options['generals']['pdf']['height'] = $height;
$options['x']['labelWidth'] = $sizeLabelTickWidth;
$graph = vbar_graph($moduleData, $options, 2);
$size = $config['font_size'];
if ($ratio != 0) {
$size = ($config['font_size'] * $ratio);
}
$options = [
'width' => $width,
'height' => $height,
'background' => $backGroundColor,
'waterMark' => $waterMark,
'legend' => ['display' => false],
'scales' => [
'x' => [
'grid' => [
'display' => true,
'color' => $gridColor,
],
'ticks' => [
'fonts' => ['size' => $size],
],
],
'y' => [
'grid' => [
'display' => true,
'color' => $gridColor,
],
'ticks' => [
'fonts' => ['size' => $size],
],
],
],
];
if ($typeGraph === 'horizontal') {
$options['axis'] = 'y';
}
$graph = vbar_graph($moduleData, $options);
}
// Restore connection.
@ -412,10 +323,7 @@ final class BarsGraph extends Item
\metaconsole_restore_db();
}
$imgbase64 = 'data:image/png;base64,';
$imgbase64 .= $graph;
$data['html'] = $imgbase64;
$data['html'] = $graph;
return $data;
}

View File

@ -285,8 +285,6 @@ final class ModuleGraph extends Item
\enterprise_include_once('include/functions_metaconsole.php');
}
$imageOnly = false;
$backgroundType = static::extractBackgroundType($data);
$period = static::extractPeriod($data);
$showLegend = static::extractShowLegend($data);
@ -367,7 +365,7 @@ final class ModuleGraph extends Item
'title' => '',
'unit_name' => null,
'show_alerts' => false,
'only_image' => $imageOnly,
'only_image' => false,
'vconsole' => true,
'backgroundColor' => $backgroundType,
'show_legend' => $showLegend,
@ -384,11 +382,7 @@ final class ModuleGraph extends Item
'modules_series' => $customGraph['modules_series'],
];
if ($imageOnly !== false) {
$imgbase64 = 'data:image/png;base64,';
}
$imgbase64 .= \graphic_combined_module(
$chart = \graphic_combined_module(
false,
$params,
$paramsCombined
@ -417,7 +411,7 @@ final class ModuleGraph extends Item
$moduleId
),
'unit' => \modules_get_unit($moduleId),
'only_image' => $imageOnly,
'only_image' => false,
'menu' => false,
'backgroundColor' => $backgroundType,
'type_graph' => $graphType,
@ -429,14 +423,10 @@ final class ModuleGraph extends Item
'server_id' => $metaconsoleId,
];
if ($imageOnly !== false) {
$imgbase64 = 'data:image/png;base64,';
}
$imgbase64 .= \grafico_modulo_sparse($params);
$chart = \grafico_modulo_sparse($params);
}
$data['html'] = $imgbase64;
$data['html'] = $chart;
// Restore connection.
if ($nodeConnected === true) {
\metaconsole_restore_db();

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -222,7 +222,6 @@ if (check_acl($config['id_user'], 0, 'ER')) {
$event_filter .= ' AND utimestamp > (UNIX_TIMESTAMP(NOW()) - '.($config['event_view_hr'] * SECONDS_1HOUR).')';
}
hd('aaaaaaaaaaaaaaa');
$events = events_print_event_table($event_filter, 10, '100%', true, false, true);
ui_toggle(
$events,

View File

@ -26,16 +26,16 @@ if (!$config['integria_enabled']) {
}
echo '<table width="90%">
<tr><td valign="top"><h3>'.__('Incidents by status').'</h3>';
<tr><td valign="top" style="width:50%;"><h3>'.__('Incidents by status').'</h3>';
echo graph_incidents_status();
echo '<td valign="top"><h3>'.__('Incidents by priority').'</h3>';
echo '<td valign="top" style="width:50%;"><h3>'.__('Incidents by priority').'</h3>';
echo grafico_incidente_prioridad();
echo '<tr><td><h3>'.__('Incidents by group').'</h3>';
echo '<tr><td style="width:50%;"><h3>'.__('Incidents by group').'</h3>';
echo graphic_incident_group();
echo '<td><h3>'.__('Incidents by user').'</h3>';
echo '<td style="width:50%;"><h3>'.__('Incidents by user').'</h3>';
echo graphic_incident_user();
echo '</table>';

View File

@ -317,13 +317,20 @@ if (empty($data)) {
echo '<div class="flex mrgn_top_10px">';
html_print_table($table);
$options = [
'height' => 230,
'legend' => [
'display' => true,
'position' => 'right',
'align' => 'center',
],
];
// Print the graph.
echo '<div class="mrgn_top_50px w40p">';
echo pie_graph(
$chart_data,
320,
200,
__('Others')
$options
);
echo '</div>';
echo '</div>';

View File

@ -211,16 +211,19 @@ unset($table_source_data);
if (empty($table_source_graph_data)) {
$table_source_graph = graph_nodata_image([]);
} else {
$options = [
'height' => 200,
'waterMark' => $water_mark,
'legend' => [
'display' => true,
'position' => 'right',
'align' => 'center',
],
];
$table_source_graph = pie_graph(
$table_source_graph_data,
400,
550,
__('Other'),
'',
$water_mark,
$config['fontpath'],
$config['font_size'],
1
$options
);
}
@ -268,16 +271,19 @@ unset($table_oid_data);
if (empty($table_oid_graph_data)) {
$table_oid_graph = graph_nodata_image([]);
} else {
$options = [
'height' => 200,
'waterMark' => $water_mark,
'legend' => [
'display' => true,
'position' => 'right',
'align' => 'center',
],
];
$table_oid_graph = pie_graph(
$table_oid_graph_data,
400,
550,
__('Other'),
'',
$water_mark,
$config['fontpath'],
$config['font_size'],
1
$options
);
}

View File

@ -815,15 +815,15 @@ abstract class VisualConsoleItem<Props extends ItemProps> {
prevProps: Props | null = null,
prevMeta: ItemMeta | null = null
): void {
this.updateDomElement(this.childElementRef);
// Move box.
if (!prevProps || this.positionChanged(prevProps, this.props)) {
this.moveElement(this.props.x, this.props.y);
this.updateDomElement(this.childElementRef);
}
// Resize box.
if (!prevProps || this.sizeChanged(prevProps, this.props)) {
this.resizeElement(this.props.width, this.props.height);
this.updateDomElement(this.childElementRef);
}
// Change label.
const oldLabelHtml = this.labelElementRef.innerHTML;
@ -923,6 +923,8 @@ abstract class VisualConsoleItem<Props extends ItemProps> {
}
}
}
this.updateDomElement(this.childElementRef);
}
if (!prevMeta || prevMeta.isSelected !== this.meta.isSelected) {
if (this.meta.isSelected) {

View File

@ -72,11 +72,8 @@ export function barsGraphPropsDecoder(data: AnyObject): BarsGraphProps | never {
export default class BarsGraph extends Item<BarsGraphProps> {
protected createDomElement(): HTMLElement {
const element = document.createElement("div");
element.innerHTML = this.props.html;
element.className = "bars-graph";
element.style.backgroundImage = `url(${this.props.html})`;
element.style.backgroundRepeat = "no-repeat";
element.style.backgroundSize = `${this.props.width}px ${this.props.height}px`;
if (
this.props.agentDisabled === true ||
this.props.moduleDisabled === true
@ -84,13 +81,23 @@ export default class BarsGraph extends Item<BarsGraphProps> {
element.style.opacity = "0.2";
}
// Hack to execute the JS after the HTML is added to the DOM.
const scripts = element.getElementsByTagName("script");
for (let i = 0; i < scripts.length; i++) {
if (scripts[i].src.length === 0) {
setTimeout(() => {
try {
eval(scripts[i].innerHTML.trim());
} catch (ignored) {} // eslint-disable-line no-empty
}, 0);
}
}
return element;
}
protected updateDomElement(element: HTMLElement): void {
element.style.backgroundImage = `url(${this.props.html})`;
element.style.backgroundRepeat = "no-repeat";
element.style.backgroundSize = `${this.props.width}px ${this.props.height}px`;
element.innerHTML = this.props.html;
if (
this.props.agentDisabled === true ||
@ -98,5 +105,13 @@ export default class BarsGraph extends Item<BarsGraphProps> {
) {
element.style.opacity = "0.2";
}
// Hack to execute the JS after the HTML is added to the DOM.
const scripts = element.getElementsByTagName("script");
for (let i = 0; i < scripts.length; i++) {
if (scripts[i].src.length === 0) {
eval(scripts[i].innerHTML.trim());
}
}
}
}

View File

@ -98,18 +98,6 @@ export default class ModuleGraph extends Item<ModuleGraphProps> {
element.style.opacity = "0.2";
}
// Remove the overview graph.
const legendP = element.getElementsByTagName("p");
for (let i = 0; i < legendP.length; i++) {
legendP[i].style.margin = "0px";
}
// Remove the overview graph.
const overviewGraphs = element.getElementsByClassName("overview_graph");
for (let i = 0; i < overviewGraphs.length; i++) {
overviewGraphs[i].remove();
}
// Hack to execute the JS after the HTML is added to the DOM.
const scripts = element.getElementsByTagName("script");
for (let i = 0; i < scripts.length; i++) {
@ -128,16 +116,11 @@ export default class ModuleGraph extends Item<ModuleGraphProps> {
protected updateDomElement(element: HTMLElement): void {
element.innerHTML = this.props.html;
// Remove the overview graph.
const legendP = element.getElementsByTagName("p");
for (let i = 0; i < legendP.length; i++) {
legendP[i].style.margin = "0px";
}
// Remove the overview graph.
const overviewGraphs = element.getElementsByClassName("overview_graph");
for (let i = 0; i < overviewGraphs.length; i++) {
overviewGraphs[i].remove();
if (
this.props.agentDisabled === true ||
this.props.moduleDisabled === true
) {
element.style.opacity = "0.2";
}
// Hack to execute the JS after the HTML is added to the DOM.