#10696 fixed resize circular mesh

This commit is contained in:
Daniel Cebrian 2023-07-19 10:36:30 +02:00
parent 81991cc4fe
commit 018bfe1288
6 changed files with 31 additions and 10 deletions

View File

@ -4618,7 +4618,10 @@ function graph_netflow_circular_mesh($data)
include_once $config['homedir'].'/include/graphs/functions_d3.php';
return d3_relationship_graph($data['elements'], $data['matrix'], 900, true);
$width = (empty($data['width']) === false) ? $data['width'] : 900;
$height = (empty($data['height']) === false) ? $data['height'] : 900;
return d3_relationship_graph($data['elements'], $data['matrix'], $width, true, $height);
}

View File

@ -1233,7 +1233,9 @@ function netflow_draw_item(
$max_aggregates,
$connection_name='',
$output='HTML',
$address_resolution=false
$address_resolution=false,
$width_content=false,
$height_content=false
) {
$aggregate = $filter['aggregate'];
$interval = ($end_date - $start_date);
@ -1432,6 +1434,9 @@ function netflow_draw_item(
netflow_aggregate_is_ip($aggregate)
);
$data_circular['width'] = $width_content;
$data_circular['height'] = $height_content;
$html = '<div class="center">';
$html .= graph_netflow_circular_mesh($data_circular);
$html .= '</div>';

View File

@ -57,7 +57,7 @@ function include_javascript_d3($return=false)
}
function d3_relationship_graph($elements, $matrix, $width=700, $return=false)
function d3_relationship_graph($elements, $matrix, $width=700, $return=false, $height=700)
{
global $config;
@ -72,7 +72,7 @@ function d3_relationship_graph($elements, $matrix, $width=700, $return=false)
$output = '<div id="chord_diagram"></div>';
$output .= include_javascript_d3(true);
$output .= "<script language=\"javascript\" type=\"text/javascript\">
chordDiagram('#chord_diagram', $elements, $matrix, $width);
chordDiagram('#chord_diagram', $elements, $matrix, $width, $height);
</script>";
if (!$return) {

View File

@ -22,7 +22,7 @@
// matrix = [[0, 0, 2], // a[a => a, a => b, a => c]
// [5, 0, 1], // b[b => a, b => b, b => c]
// [2, 3, 0]]; // c[c => a, c => b, c => c]
function chordDiagram(recipient, elements, matrix, width) {
function chordDiagram(recipient, elements, matrix, width, height) {
d3.chart = d3.chart || {};
d3.chart.chordWheel = function(options) {
// Default values
@ -59,10 +59,13 @@ function chordDiagram(recipient, elements, matrix, width) {
.enter()
.append("svg:svg")
.attr("width", width)
.attr("height", width)
.attr("height", height)
.attr("class", "dependencyWheel")
.append("g")
.attr("transform", "translate(" + width / 2 + "," + width / 2 + ")");
.attr(
"transform",
"translate(" + width / 2 + "," + height / 2 + ") scale(1.2)"
);
var arc = d3.svg
.arc()
@ -206,8 +209,8 @@ function chordDiagram(recipient, elements, matrix, width) {
.on("mousemove", move_tooltip);
function move_tooltip(d) {
x = d3.event.pageX + 10;
y = d3.event.pageY + 10;
x = d3.event.layerX + 10;
y = d3.event.layerY + 10;
$("#tooltip").css("left", x + "px");
$("#tooltip").css("top", y + "px");

View File

@ -339,6 +339,10 @@ class Netflow extends Widget
$style .= ' width: 95%;';
}
if ($size['width'] > $size['height']) {
$size['width'] = $size['height'];
}
// Draw the netflow chart.
$output .= html_print_div(
[
@ -353,7 +357,9 @@ class Netflow extends Widget
$this->values['max_values'],
'',
'HTML',
0
0,
($size['width'] - 50),
($size['height'] - 20),
),
],
true

View File

@ -7,3 +7,7 @@
#image_hide_show_labels {
display: none !important;
}
.select2-search--dropdown .select2-search__field {
padding: 0px !important;
}