Update network-connections-chart.html
Costa Tsaousis committed
Feb 3, 2024 at 11:48 UTC
c86f21b621246512a8f865d42377e370378e6184
1 file changed
+13
-3
collectors/network-viewer.plugin/network-connections-chart.html
+13
-3
@@ -315,6 +315,7 @@
315
.style("fill", "url(#clientsGradient)");
316
317
svg.append("text")
318
+ .attr("id", "clientsText")
319
.text("Clients")
320
.attr("x", "50%")
321
.attr("y", borderPadding / 2 - 4)
@@ -349,6 +350,7 @@
350
.style("fill", "url(#serversGradient)"); // Use the reversed gradient fill
351
352
svg.append("text")
353
+ .attr("id", "serversText")
354
.text("Servers")
355
.attr("x", "50%")
356
.attr("y", h - borderPadding / 2 + 16)
@@ -383,6 +385,7 @@
385
.style("fill", "url(#publicGradient)");
386
387
svg.append("text")
388
+ .attr("id", "publicText")
389
.text("Public")
390
.attr("x", w - (borderPadding / 2))
391
.attr("y", ch - 10)
@@ -419,6 +422,7 @@
422
.style("fill", "url(#privateGradient)");
423
424
svg.append("text")
425
+ .attr("id", "privateText")
426
.text("Private")
427
.attr("x", borderPadding / 2)
428
.attr("y", ch)
@@ -432,7 +436,8 @@
436
}
437
438
function updateGradientBoxes(svg, w, h, borderPadding, theme) {
435
- // Assuming the IDs for gradients are set during their creation, update here accordingly
439
+ const cw = w / 2;
440
+ const ch = h / 2;
441
442
// Update clientsGradient (top gradient) - mainly adjusting width
443
svg.select("rect#clientsGradientRect")
@@ -460,7 +465,9 @@
465
466
// Update text position if necessary, adjusting for rotation
467
svg.select("text#publicText")
463
- .attr("transform", `rotate(90, ${w - (borderPadding / 2)}, ${h / 2})`);
468
+ .attr("x", w - (borderPadding / 2))
469
+ .attr("y", ch - 10)
470
+ .attr("transform", `rotate(90, ${w - (borderPadding / 2)}, ${ch})`);
471
472
// Update privateGradient (left gradient) - height adjustment only as it's already at x = 0
473
svg.select("rect#privateGradientRect")
@@ -468,7 +475,10 @@
475
476
// Update text position if necessary, adjusting for rotation
477
svg.select("text#privateText")
471
- .attr("transform", `rotate(-90, ${borderPadding / 2 - 10}, ${h / 2})`);
478
+ .attr("x", borderPadding / 2)
479
+ .attr("y", ch)
480
+ .attr("transform", `rotate(-90, ${borderPadding / 2 - 10}, ${ch})`);
481
+
482
}
483
484
let positionsMap = new Map();