Chart, response sizing

2023-10-12 13:01:57 +02:00
parent 708745013f
commit ff2fc96575
3 changed files with 5 additions and 4 deletions
--- a/Front/skydivelogs-app/src/app/list-of-tunnel-flights/list-of-tunnel-flights.component.html
+++ b/Front/skydivelogs-app/src/app/list-of-tunnel-flights/list-of-tunnel-flights.component.html
@@ -12,7 +12,7 @@
        <mat-radio-button value="all">{{ 'ListTunnelFlight_AllFlights' | translate }}</mat-radio-button>
    </mat-radio-group>

-    <div style="display: block; width: 55%;">
+    <div style="display: inline-block; position: relative; width: 100%;">
        <canvas baseChart
                [data]="barChartData" 
                [options]="barChartOptions"
--- a/Front/skydivelogs-app/src/app/list-of-tunnel-flights/list-of-tunnel-flights.component.ts
+++ b/Front/skydivelogs-app/src/app/list-of-tunnel-flights/list-of-tunnel-flights.component.ts
@@ -66,6 +66,7 @@ export class ListOfTunnelFlightsComponent implements OnInit {

        this.barChartOptions = {
            responsive: true,
+            maintainAspectRatio: true,
            plugins: {
                legend: {
                    display: true