🔨 simplify legend in stacked chart components

owid · Jan 3, 2025 · c4b9e29 · c4b9e29
1 parent 8280d1f
commit c4b9e29
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 23 deletions.
diff --git a/packages/@ourworldindata/grapher/src/stackedCharts/StackedBarChart.tsx b/packages/@ourworldindata/grapher/src/stackedCharts/StackedBarChart.tsx
@@ -212,7 +212,7 @@ export class StackedBarChart
 
     @computed protected get paddingForLegendTop(): number {
         return this.showHorizontalLegend
-            ? this.horizontalColorLegendHeight + 8
+            ? this.horizontalColorLegend.height + 8
             : 0
     }
 
@@ -326,16 +326,7 @@ export class StackedBarChart
     }
 
     @computed
-    private get horizontalColorLegendHeight(): number {
-        return HorizontalCategoricalColorLegend.height({
-            fontSize: this.fontSize,
-            align: this.legendAlign,
-            maxWidth: this.legendWidth,
-            categoricalBins: this.categoricalLegendData,
-        })
-    }
-
-    @computed get colorLegend(): HorizontalCategoricalColorLegend {
+    private get horizontalColorLegend(): HorizontalCategoricalColorLegend {
         return new HorizontalCategoricalColorLegend({
             fontSize: this.fontSize,
             align: this.legendAlign,
@@ -500,7 +491,7 @@ export class StackedBarChart
 
         return showHorizontalLegend ? (
             <HorizontalCategoricalColorLegendComponent
-                legend={this.colorLegend}
+                legend={this.horizontalColorLegend}
                 x={this.legendX}
                 y={this.categoryLegendY}
                 activeColors={this.activeColors}

diff --git a/packages/@ourworldindata/grapher/src/stackedCharts/StackedDiscreteBarChart.tsx b/packages/@ourworldindata/grapher/src/stackedCharts/StackedDiscreteBarChart.tsx
@@ -328,8 +328,8 @@ export class StackedDiscreteBarChart
 
     @computed private get boundsWithoutLegend(): Bounds {
         return this.bounds.padTop(
-            this.showLegend && this.legendHeight > 0
-                ? this.legendHeight + this.legendPaddingTop
+            this.showLegend && this.legend.height > 0
+                ? this.legend.height + this.legendPaddingTop
                 : 0
         )
     }
@@ -553,15 +553,6 @@ export class StackedDiscreteBarChart
         })
     }
 
-    @computed private get legendHeight(): number {
-        return HorizontalCategoricalColorLegend.height({
-            fontSize: this.fontSize,
-            align: this.legendAlign,
-            maxWidth: this.legendWidth,
-            categoricalBins: this.categoricalLegendData,
-        })
-    }
-
     @computed private get formatColumn(): CoreColumn {
         return this.yColumns[0]
     }