module graph convert to image base 64

This commit is contained in:
Daniel Barbero Martin 2020-01-13 13:31:23 +01:00
parent 4f6ed7c39f
commit 60bd600392
9 changed files with 85 additions and 127 deletions

View File

@ -158,27 +158,29 @@ if (file_exists('languages/'.$user_language.'.mo') === true) {
<script language="javascript" type="text/javascript" src="graphs/flot/jquery.flot.axislabels.js"></script>
<script language="javascript" type="text/javascript" src="graphs/flot/pandora.flot.js"></script>
</head>
<body bgcolor="#ffffff" style='background:#ffffff;'>
<body style='background-color: <?php echo $params['backgroundColor']; ?>;'>
<?php
$params['only_image'] = false;
$params['width'] = (int) $_REQUEST['viewport_width'];
$params['menu'] = false;
$params_combined = json_decode($_REQUEST['data_combined'], true);
$module_list = json_decode($_REQUEST['data_module_list'], true);
$type_graph_pdf = $_REQUEST['type_graph_pdf'];
if ((isset($params['width']) === false
|| ($params['width'] <= 0))
) {
$params['width'] = 650;
if ((int) $params['landscape'] === 1) {
$params['width'] = 850;
}
if ($params['vconsole'] === false) {
$params['width'] = (int) $_REQUEST['viewport_width'];
if ((isset($params['width']) === false
|| ($params['width'] <= 0))
) {
$params['width'] = 650;
if ((int) $params['landscape'] === 1) {
$params['width'] = 850;
}
if ($type_graph_pdf === 'slicebar') {
$params['width'] = 150;
$params['height'] = 70;
if ($type_graph_pdf === 'slicebar') {
$params['width'] = 150;
$params['height'] = 70;
}
}
}

View File

@ -3859,17 +3859,22 @@ function generator_chart_to_pdf($type_graph_pdf, $params, $params_combined=false
$width_img = 500;
// Set height image.
$height_img = 170;
$params['height'] = 170;
if ((int) $params['landscape'] === 1) {
$height_img = 150;
$params['height'] = 150;
}
if ($params['vconsole'] === false) {
// Set height image.
$height_img = 170;
$params['height'] = 170;
if ((int) $params['landscape'] === 1) {
$height_img = 150;
$params['height'] = 150;
}
if ($type_graph_pdf === 'slicebar') {
$width_img = 360;
$height_img = 70;
if ($type_graph_pdf === 'slicebar') {
$width_img = 360;
$height_img = 70;
}
} else {
$width_img = $params['width'];
$height_img = $params['height'];
}
$params_encode_json = urlencode(json_encode($params));

View File

@ -7859,6 +7859,7 @@ function reporting_simple_graph(
'server_id' => $id_meta,
'height' => $config['graph_image_height'],
'landscape' => $content['landscape'],
'backgroundColor' => 'transparent',
'return_img_base_64' => true,
];

View File

@ -279,12 +279,6 @@ function flot_area_graph(
// Trick to get translated string from javascript.
$return .= html_print_input_hidden('unknown_text', __('Unknown'), true);
// To use the js document ready event or not. Default true.
$document_ready = true;
if (isset($params['document_ready']) === true) {
$document_ready = $params['document_ready'];
}
$values = json_encode($array_data);
$legend = json_encode($legend);
@ -302,10 +296,6 @@ function flot_area_graph(
$return .= "<script type='text/javascript'>";
if ($document_ready === true) {
$return .= '$(document).ready( function () {';
}
$return .= "pandoraFlotArea(\n";
$return .= "'".$graph_id."', \n";
$return .= $values.", \n";
@ -319,10 +309,6 @@ function flot_area_graph(
$return .= $array_events_alerts."\n";
$return .= ');';
if ($document_ready === true) {
$return .= '});';
}
$return .= '</script>';
// Parent layer.

View File

@ -168,7 +168,7 @@ final class ModuleGraph extends Item
\enterprise_include_once('include/functions_metaconsole.php');
}
$imageOnly = false;
$imageOnly = true;
$backgroundType = static::extractBackgroundType($data);
$period = static::extractPeriod($data);
@ -205,29 +205,32 @@ final class ModuleGraph extends Item
* the height of one of it to replicate the legacy functionality.
*/
$width = (int) $data['width'];
$height = (int) $data['height'];
if ($width === 0) {
$width = 440;
}
if ($height === 0) {
$height = 220;
}
// Custom graph.
if (empty($customGraphId) === false) {
$customGraph = \db_get_row('tgraph', 'id_graph', $customGraphId);
if ($data['width'] < 440) {
$data['width'] = 440;
}
if ($data['height'] < 220) {
$data['height'] = 220;
}
$params = [
'period' => $period,
'width' => (int) $data['width'],
'height' => ($data['height'] - 40),
'title' => '',
'unit_name' => null,
'show_alerts' => false,
'only_image' => $imageOnly,
'vconsole' => true,
'document_ready' => false,
'backgroundColor' => $backgroundType,
'period' => $period,
'width' => $width,
'height' => $height,
'title' => '',
'unit_name' => null,
'show_alerts' => false,
'only_image' => $imageOnly,
'vconsole' => true,
'backgroundColor' => $backgroundType,
'return_img_base_64' => true,
];
$paramsCombined = [
@ -238,7 +241,8 @@ final class ModuleGraph extends Item
'modules_series' => $customGraph['modules_series'],
];
$data['html'] = \graphic_combined_module(
$imgbase64 = 'data:image/jpg;base64,';
$imgbase64 .= \graphic_combined_module(
false,
$params,
$paramsCombined
@ -249,33 +253,29 @@ final class ModuleGraph extends Item
throw new \InvalidArgumentException('missing module Id');
}
if ($data['width'] < 440) {
$data['width'] = 440;
}
if ($data['height'] < 220) {
$data['height'] = 220;
}
$params = [
'agent_module_id' => $moduleId,
'period' => $period,
'show_events' => false,
'width' => (int) $data['width'],
'height' => ($data['height'] - 40),
'title' => \modules_get_agentmodule_name($moduleId),
'unit' => \modules_get_unit($moduleId),
'only_image' => $imageOnly,
'menu' => false,
'backgroundColor' => $backgroundType,
'type_graph' => $graphType,
'vconsole' => true,
'document_ready' => false,
'agent_module_id' => $moduleId,
'period' => $period,
'show_events' => false,
'width' => $width,
'height' => $height,
'title' => \modules_get_agentmodule_name(
$moduleId
),
'unit' => \modules_get_unit($moduleId),
'only_image' => $imageOnly,
'menu' => false,
'backgroundColor' => $backgroundType,
'type_graph' => $graphType,
'vconsole' => true,
'return_img_base_64' => true,
];
$data['html'] = \grafico_modulo_sparse($params);
$imgbase64 = 'data:image/jpg;base64,';
$imgbase64 .= \grafico_modulo_sparse($params);
}
$data['html'] = $imgbase64;
// 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

@ -95,7 +95,7 @@ page.onCallback = function() {
page.render(output_filename, { format: "png" });
} else {
page.settings.loadImages = false;
var base64 = page.renderBase64("jpg");
var base64 = page.renderBase64("png");
// do not remove this console.output
console.log(base64);
}

View File

@ -391,57 +391,21 @@ export default class ModuleGraph extends Item<ModuleGraphProps> {
protected createDomElement(): HTMLElement {
const element = document.createElement("div");
element.className = "module-graph";
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();
}
// 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);
}
}
element.style.backgroundImage = `url(${this.props.html})`;
element.style.backgroundRepeat = "no-repeat";
element.style.backgroundSize = `${this.props.width}px ${
this.props.height
}px`;
return element;
}
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();
}
// 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());
}
}
element.style.backgroundImage = `url(${this.props.html})`;
element.style.backgroundRepeat = "no-repeat";
element.style.backgroundSize = `${this.props.width}px ${
this.props.height
}px`;
}
/**