fix ROI shift issue when saving svg (#1742)

* fix ROI shift issue when saving svg * cleaner solution suggested by Turner
igvteam · Dec 15, 2023 · 7213932 · 7213932
1 parent af99de9
commit 7213932
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 3 deletions.
diff --git a/js/browser.js b/js/browser.js
@@ -380,7 +380,7 @@ class Browser {
      */
     toSVG() {
 
-        const {y, width, height} = this.columnContainer.getBoundingClientRect()
+        const {x, y, width, height} = this.columnContainer.getBoundingClientRect()
 
         const h_render = 8000
 
@@ -412,6 +412,8 @@ class Browser {
             trackView.renderSVGContext(context, delta)
         }
 
+        // ROI -> SVG
+        delta.deltaX = x
         this.roiManager.renderSVGContext(context, delta)
 
         // reset height to trim away unneeded svg canvas real estate. Yes, a bit of a hack.

diff --git a/js/roi/ROIManager.js b/js/roi/ROIManager.js
@@ -237,13 +237,13 @@ class ROIManager {
             // body
             const { x, y, width, height } = regionElement.getBoundingClientRect()
             context.fillStyle = regionElement.style.backgroundColor
-            context.fillRect(x+deltaX, y+deltaY, width, height)
+            context.fillRect(x-deltaX, y+deltaY, width, height)
 
             // header
             const header = regionElement.querySelector('div')
             const { x:xx, y:yy, width:ww, height:hh } = header.getBoundingClientRect()
             context.fillStyle = header.style.backgroundColor
-            context.fillRect(xx+deltaX, yy+deltaY, ww, hh)
+            context.fillRect(xx-deltaX, yy+deltaY, ww, hh)
         }
     }