Merge pull request #4352 from cisagov/feature/CSET-2970

cisagov · Jan 15, 2025 · 13d8303 · 13d8303
2 parents 62405be + 5cff6d6
commit 13d8303
Show file tree

Hide file tree

Showing 4 changed files with 18 additions and 12 deletions.
diff --git a/CSETWebNg/src/app/assessment/results/analysis/dashboard/dashboard.component.html b/CSETWebNg/src/app/assessment/results/analysis/dashboard/dashboard.component.html
@@ -62,7 +62,7 @@ <h3 class="text-center">{{t('reports.core.dashboard.score')}}</h3>
     <div class="d-flex flex-column flex-00a mb-5">
       <h3 class="text-center">{{t('titles.assessment compliance')}}</h3>
       <p [innerHTML]="t('reports.assessment compliance text')"></p>
-      <canvas id="canvasAssessmentCompliance">{{assessComplChart}}</canvas>
+      <canvas id="canvasAssessmentCompliance" height="200" width="700">{{assessComplChart}}</canvas>
     </div>
 
 
@@ -76,7 +76,7 @@ <h3 class="text-center">{{t('titles.ranked categories')}}</h3>
 
         <p>{{t('reports.ranked categories text 1b')}}</p>
 
-        <canvas id="canvasTopCategories">{{topCategChart}}</canvas>
+        <canvas id="canvasTopCategories" height="300" width="700">{{topCategChart}}</canvas>
       </div>
     </div>
 

diff --git a/...ebNg/src/app/assessment/results/analysis/standards-ranked/standards-ranked.component.html b/...ebNg/src/app/assessment/results/analysis/standards-ranked/standards-ranked.component.html
@@ -22,10 +22,18 @@
 -------------------------->
 <div class="white-panel d-flex flex-column justify-content-start flex-11a" *transloco="let t">
   <h3>{{t('titles.ranked categories')}}</h3>
-  <p class="fst-italic" [class.d-none]="showChart">
+
+  <div *ngIf="!initialized">
+    <div class="spinner-container" style="margin-left: auto; margin-right: auto;">
+      <div style="max-width: 50px; max-height: 50px;"></div>
+    </div>
+  </div>
+
+  <p class="fst-italic" *ngIf="initialized && !chartIsVisible">
     {{t('reports.core.no ranking')}}
   </p>
-  <div [class.d-none]="!showChart">
+
+  <div [class.d-none]="!chartIsVisible">
     <p>{{t('reports.ranked categories text 1a')}}</p>
 
     <p>{{t('reports.ranked categories text 1b')}}</p>
@@ -34,12 +42,6 @@ <h3>{{t('titles.ranked categories')}}</h3>
       <canvas id="canvasStandardRank">{{chart}}</canvas>
     </div>
 
-    <div *ngIf="!initialized">
-      <div class="spinner-container" style="margin-left: auto; margin-right: auto;">
-        <div style="max-width: 50px; max-height: 50px;"></div>
-      </div>
-    </div>
-
     <div class="data" [hidden]="!initialized">
       <p>{{t('reports.ranked categories text 2')}}</p>
 

diff --git a/CSETWebNg/src/app/assessment/results/analysis/standards-ranked/standards-ranked.component.ts b/CSETWebNg/src/app/assessment/results/analysis/standards-ranked/standards-ranked.component.ts
@@ -36,7 +36,7 @@ import { TranslocoService } from '@jsverse/transloco';
   host: { class: 'd-flex flex-column flex-11a' }
 })
 export class StandardsRankedComponent implements OnInit {
-  showChart = false;
+  chartIsVisible = false;
   chart: Chart;
   dataRows: { title: string; rank: string; failed: number; total: number; percent: string; }[];
   initialized = false;
@@ -55,7 +55,7 @@ export class StandardsRankedComponent implements OnInit {
 
   setupChart(x: any) {
     // only show the chart if there is some non-zero data to show
-    this.showChart = x.data.some(x => x > 0);
+    this.chartIsVisible = x.data.some(x => x > 0);
 
     if (this.chart) {
       this.chart.destroy();

diff --git a/CSETWebNg/src/app/services/analysis.service.ts b/CSETWebNg/src/app/services/analysis.service.ts
@@ -134,6 +134,8 @@ export class AnalysisService {
         ],
       },
       options: {
+        responsive: false,
+        maintainAspectRatio: false,
         indexAxis: 'y',
         plugins: {
           title: {
@@ -187,6 +189,8 @@ export class AnalysisService {
         ],
       },
       options: {
+        responsive: false,
+        maintainAspectRatio: false,
         indexAxis: 'y',
         plugins: {
           title: {