chore: update scale bar position (#1136)

chanzuckerberg · Oct 10, 2024 · 6b0933d · 6b0933d
1 parent 358b0a0
commit 6b0933d
Show file tree

Hide file tree

Showing 4 changed files with 6 additions and 27 deletions.
diff --git a/.infra/rdev/values.yaml b/.infra/rdev/values.yaml
@@ -2,7 +2,7 @@ stack:
   services:
     explorer:
       image:
-        tag: sha-d6f3e23b
+        tag: sha-29601284
       replicaCount: 1
       env:
         # env vars common to all deployment stages

diff --git a/client/src/components/Graph/Graph.tsx b/client/src/components/Graph/Graph.tsx
@@ -1200,8 +1200,10 @@ class Graph extends React.Component<GraphProps, GraphState> {
     this.openseadragon.scalebar({
       type: Openseadragon.ScalebarType.MICROSCOPY,
       pixelsPerMeter: calculatedPixelsPerMeter,
+      yOffset: 60,
+      xOffset: 80,
       minWidth: "75px",
-      location: Openseadragon.ScalebarLocation.BOTTOM_LEFT,
+      location: Openseadragon.ScalebarLocation.BOTTOM_RIGHT,
       color: "black",
       fontColor: "black",
       backgroundColor: "rgba(255, 255, 255, 0.5)",

diff --git a/client/src/components/Graph/openseadragon-scalebar.js b/client/src/components/Graph/openseadragon-scalebar.js
@@ -268,11 +268,6 @@
       this.divElt.style.top = `${location.y}px`;
     },
     drawMicroscopyScalebar(size, text) {
-      // this.divElt.style.display = "flex";
-      // this.divElt.style.alignItems = "flex-end"; // Align the ticks to the bottom
-      // this.divElt.style.justifyContent = "space-between";
-
-      // OG code ****************************************************
       this.divElt.style.fontSize = this.fontSize;
       this.divElt.style.fontFamily = this.fontFamily;
       this.divElt.style.textAlign = "center";
@@ -286,26 +281,6 @@
       this.divElt.style.backgroundColor = this.backgroundColor;
       this.divElt.innerHTML = text;
       this.divElt.style.width = `${size}px`;
-
-      // // New code ****************************************************
-
-      // // Create the first label (0)
-      // const label0 = document.createElement("div");
-      // label0.className = "label";
-      // label0.innerHTML = "0";
-      // label0.style.top = "3px";
-      // label0.style.fontSize = "12px";
-
-      // const tick1 = document.createElement("span");
-      // tick1.className = "tick";
-      // tick1.style.position = "absolute";
-      // tick1.style.top = "10px"; // Align tick above the line
-      // tick1.style.left = "7px";
-      // tick1.style.height = "6px"; // Smaller tick
-      // tick1.style.width = "2px";
-      // tick1.style.backgroundColor = "black";
-      // label0.appendChild(tick1);
-      // this.divElt.appendChild(label0);
     },
     drawMapScalebar(size, text) {
       this.divElt.style.fontSize = this.fontSize;

diff --git a/client/src/global.d.ts b/client/src/global.d.ts
@@ -13,6 +13,8 @@ declare module "openseadragon" {
     type?: string;
     pixelsPerMeter?: number;
     minWidth?: string;
+    yOffset?: number;
+    xOffset?: number;
     location?: string;
     color?: string;
     fontColor?: string;