diff --git a/src/opnsense/www/css/dashboard.css b/src/opnsense/www/css/dashboard.css
index 8810c162f..d6b09d26b 100644
--- a/src/opnsense/www/css/dashboard.css
+++ b/src/opnsense/www/css/dashboard.css
@@ -141,8 +141,15 @@ td {
margin: 5px;
}
+.canvas-container-noaspectratio {
+ position: relative;
+}
+
.canvas-container {
position: relative;
+ /* ChartJS v4 workaround: https://github.com/chartjs/Chart.js/issues/11005 */
+ aspect-ratio: 2;
+ overflow: hidden;
}
.cpu-canvas-container {
diff --git a/src/opnsense/www/js/widgets/InterfaceStatistics.js b/src/opnsense/www/js/widgets/InterfaceStatistics.js
index 7ae874d30..3b00860eb 100644
--- a/src/opnsense/www/js/widgets/InterfaceStatistics.js
+++ b/src/opnsense/www/js/widgets/InterfaceStatistics.js
@@ -36,13 +36,6 @@ export default class InterfaceStatistics extends BaseTableWidget {
this.sortedData = [];
}
- getGridOptions() {
- return {
- // trigger overflow-y:scroll after 650px height
- sizeToContent: 650,
- };
- }
-
getMarkup() {
let $container = $('
');
let $table = this.createTable('interface-statistics-table', {
diff --git a/src/opnsense/www/js/widgets/ThermalSensors.js b/src/opnsense/www/js/widgets/ThermalSensors.js
index cb07d81d9..4ea265e57 100644
--- a/src/opnsense/www/js/widgets/ThermalSensors.js
+++ b/src/opnsense/www/js/widgets/ThermalSensors.js
@@ -37,7 +37,7 @@ export default class ThermalSensors extends BaseWidget {
getMarkup() {
return $(`
-
diff --git a/src/opnsense/www/js/widgets/Traffic.js b/src/opnsense/www/js/widgets/Traffic.js
index 2456668b0..8f0bb8431 100644
--- a/src/opnsense/www/js/widgets/Traffic.js
+++ b/src/opnsense/www/js/widgets/Traffic.js
@@ -199,11 +199,11 @@ export default class Traffic extends BaseWidget {
return $(`
${this.translations.trafficin}
-
+
${this.translations.trafficout}
-
diff --git a/src/opnsense/www/themes/opnsense-dark/assets/stylesheets/dashboard.scss b/src/opnsense/www/themes/opnsense-dark/assets/stylesheets/dashboard.scss
index a10e71623..a779cd8b3 100644
--- a/src/opnsense/www/themes/opnsense-dark/assets/stylesheets/dashboard.scss
+++ b/src/opnsense/www/themes/opnsense-dark/assets/stylesheets/dashboard.scss
@@ -142,8 +142,15 @@ td {
margin: 5px;
}
+.canvas-container-noaspectratio {
+ position: relative;
+}
+
.canvas-container {
position: relative;
+ /* ChartJS v4 workaround: https://github.com/chartjs/Chart.js/issues/11005 */
+ aspect-ratio: 2;
+ overflow: hidden;
}
.cpu-canvas-container {
diff --git a/src/opnsense/www/themes/opnsense/assets/stylesheets/dashboard.scss b/src/opnsense/www/themes/opnsense/assets/stylesheets/dashboard.scss
index 66dd0d3fc..ae06e5bb4 100644
--- a/src/opnsense/www/themes/opnsense/assets/stylesheets/dashboard.scss
+++ b/src/opnsense/www/themes/opnsense/assets/stylesheets/dashboard.scss
@@ -142,8 +142,15 @@ td {
margin: 5px;
}
+.canvas-container-noaspectratio {
+ position: relative;
+}
+
.canvas-container {
position: relative;
+ /* ChartJS v4 workaround: https://github.com/chartjs/Chart.js/issues/11005 */
+ aspect-ratio: 2;
+ overflow: hidden;
}
.cpu-canvas-container {