#10696 fixed resize circular mesh

pandora_console/include/functions_graph.php

@@ -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);
 }
 
 

pandora_console/include/functions_netflow.php

@@ -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>';

pandora_console/include/graphs/functions_d3.php

@@ -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) {

pandora_console/include/graphs/pandora.d3.js

@@ -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;
+          x = d3.event.layerX + 10;
-          y = d3.event.pageY + 10;
+          y = d3.event.layerY + 10;
 
           $("#tooltip").css("left", x + "px");
           $("#tooltip").css("top", y + "px");

pandora_console/include/lib/Dashboard/Widgets/netflow.php

@@ -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

pandora_console/include/styles/netflow_widget.css

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