From 72139325b136c62e57a9d52aaee6f1a207196ef2 Mon Sep 17 00:00:00 2001
From: wilsonGen <103169735+wilsonGen@users.noreply.github.com>
Date: Fri, 15 Dec 2023 10:16:40 +0800
Subject: [PATCH] fix ROI shift issue when saving svg (#1742)

* fix ROI shift issue when saving svg

* cleaner solution suggested by Turner
---
 js/browser.js        | 4 +++-
 js/roi/ROIManager.js | 4 ++--
 2 files changed, 5 insertions(+), 3 deletions(-)

diff --git a/js/browser.js b/js/browser.js
index b130a0036..8a34aaabc 100755
--- 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
index edfa6b923..2109a0546 100644
--- 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)
         }
     }