Use margin to specify the spacing

deephaven · Mar 2, 2023 · 80caca5 · 80caca5
1 parent 9650d26
commit 80caca5
Showing 1 changed file with 40 additions and 18 deletions.
diff --git a/packages/chart/src/ChartUtils.test.ts b/packages/chart/src/ChartUtils.test.ts
@@ -318,6 +318,8 @@ describe('updating layout axes', () => {
 describe('handles subplots and columns/rows correctly', () => {
   const width = ChartUtils.AXIS_SIZE_PX * 5;
   const height = ChartUtils.AXIS_SIZE_PX * 10;
+  const halfXMargin = ChartUtils.AXIS_SIZE_PX / width / 2;
+  const halfYMargin = ChartUtils.AXIS_SIZE_PX / height / 2;
 
   it('handles row location correctly', () => {
     const axes = ChartTestUtils.makeDefaultAxes();
@@ -328,10 +330,10 @@ describe('handles subplots and columns/rows correctly', () => {
     const figure = ChartTestUtils.makeFigure({ charts, rows: 2 });
     expect(
       ChartUtils.getChartBounds(figure, charts[0], width, height)
-    ).toEqual({ bottom: 0.55, top: 1, left: 0, right: 1 });
+    ).toEqual({ bottom: 0.5 + halfYMargin, top: 1, left: 0, right: 1 });
     expect(
       ChartUtils.getChartBounds(figure, charts[1], width, height)
-    ).toEqual({ bottom: 0, top: 0.45, left: 0, right: 1 });
+    ).toEqual({ bottom: 0, top: 0.5 - halfYMargin, left: 0, right: 1 });
   });
 
   it('handles column location correctly', () => {
@@ -343,10 +345,10 @@ describe('handles subplots and columns/rows correctly', () => {
     const figure = ChartTestUtils.makeFigure({ charts, cols: 2 });
     expect(
       ChartUtils.getChartBounds(figure, charts[0], width, height)
-    ).toEqual({ bottom: 0, top: 1, left: 0, right: 0.4 });
+    ).toEqual({ bottom: 0, top: 1, left: 0, right: 0.5 - halfXMargin });
     expect(
       ChartUtils.getChartBounds(figure, charts[1], width, height)
-    ).toEqual({ bottom: 0, top: 1, left: 0.6, right: 1 });
+    ).toEqual({ bottom: 0, top: 1, left: 0.5 + halfXMargin, right: 1 });
   });
 
   it('handles colspan', () => {
@@ -357,15 +359,25 @@ describe('handles subplots and columns/rows correctly', () => {
       ChartTestUtils.makeChart({ axes, row: 1, colspan: 2 }),
     ];
     const figure = ChartTestUtils.makeFigure({ charts, cols: 2, rows: 2 });
-    expect(
-      ChartUtils.getChartBounds(figure, charts[0], width, height)
-    ).toEqual({ bottom: 0.55, top: 1, left: 0, right: 0.4 });
-    expect(
-      ChartUtils.getChartBounds(figure, charts[1], width, height)
-    ).toEqual({ bottom: 0.55, top: 1, left: 0.6, right: 1 });
+    expect(ChartUtils.getChartBounds(figure, charts[0], width, height)).toEqual(
+      {
+        bottom: 0.5 + halfYMargin,
+        top: 1,
+        left: 0,
+        right: 0.5 - halfXMargin,
+      }
+    );
+    expect(ChartUtils.getChartBounds(figure, charts[1], width, height)).toEqual(
+      {
+        bottom: 0.5 + halfYMargin,
+        top: 1,
+        left: 0.5 + halfXMargin,
+        right: 1,
+      }
+    );
     expect(
       ChartUtils.getChartBounds(figure, charts[2], width, height)
-    ).toEqual({ bottom: 0, top: 0.45, left: 0, right: 1 });
+    ).toEqual({ bottom: 0, top: 0.5 - halfYMargin, left: 0, right: 1 });
   });
 
   it('handles rowspan', () => {
@@ -376,15 +388,25 @@ describe('handles subplots and columns/rows correctly', () => {
       ChartTestUtils.makeChart({ axes, column: 1, rowspan: 2 }),
     ];
     const figure = ChartTestUtils.makeFigure({ charts, cols: 2, rows: 2 });
-    expect(
-      ChartUtils.getChartBounds(figure, charts[0], width, height)
-    ).toEqual({ bottom: 0.55, top: 1, left: 0, right: 0.4 });
-    expect(
-      ChartUtils.getChartBounds(figure, charts[1], width, height)
-    ).toEqual({ bottom: 0, top: 0.45, left: 0, right: 0.4 });
+    expect(ChartUtils.getChartBounds(figure, charts[0], width, height)).toEqual(
+      {
+        bottom: 0.5 + halfYMargin,
+        top: 1,
+        left: 0,
+        right: 0.5 - halfXMargin,
+      }
+    );
+    expect(ChartUtils.getChartBounds(figure, charts[1], width, height)).toEqual(
+      {
+        bottom: 0,
+        top: 0.5 - halfYMargin,
+        left: 0,
+        right: 0.5 - halfXMargin,
+      }
+    );
     expect(
       ChartUtils.getChartBounds(figure, charts[2], width, height)
-    ).toEqual({ bottom: 0, top: 1, left: 0.6, right: 1 });
+    ).toEqual({ bottom: 0, top: 1, left: 0.5 + halfXMargin, right: 1 });
   });
 });