diff --git a/react-components/src/architecture/base/utilities/geometry/Range3.ts b/react-components/src/architecture/base/utilities/geometry/Range3.ts
index 30676d4d84c..3c8964c36ae 100644
--- a/react-components/src/architecture/base/utilities/geometry/Range3.ts
+++ b/react-components/src/architecture/base/utilities/geometry/Range3.ts
@@ -242,6 +242,12 @@ export class Range3 {
     this.z.scaleDelta(value.z);
   }
 
+  public scale(value: number): void {
+    this.x.scale(value);
+    this.y.scale(value);
+    this.z.scale(value);
+  }
+
   public add(value: Vector3): void {
     this.x.add(value.x);
     this.y.add(value.y);
diff --git a/react-components/src/architecture/concrete/axis/AxisThreeView.ts b/react-components/src/architecture/concrete/axis/AxisThreeView.ts
index b56b674718a..11550f406c0 100644
--- a/react-components/src/architecture/concrete/axis/AxisThreeView.ts
+++ b/react-components/src/architecture/concrete/axis/AxisThreeView.ts
@@ -271,7 +271,8 @@ export class AxisThreeView extends GroupThreeView {
           }
           labelCount += 1;
           end.addScaledVector(tickDirection, 2 * tickLength);
-          const text = incrementToString(tick);
+
+          const text = numberToString(dimension === 2 ? -tick : tick);
           const sprite = createSpriteWithText(text, tickFontSize, style.textColor);
           if (sprite === undefined) {
             continue;
@@ -601,7 +602,7 @@ function getTickDirection(faceIndex1: number, faceIndex2: number, target: Vector
   return target;
 }
 
-function incrementToString(value: number): string {
+function numberToString(value: number): string {
   // Sometimes the number comes out like this: 1.20000005 or 1.19999992 due to numeric precision limitations.
   // To get better rounded values, I wrote this myself: Multiply by some high integer and round it, then
   // convert to text, and insert the comma manually afterwards.