diff --git a/libs/shared/lib/vis/nodelink/components/NLPixi.tsx b/libs/shared/lib/vis/nodelink/components/NLPixi.tsx
index 3f236696c4868bbac939348aa05114e2185bbdac..a2f0588322332aaa4a3a40196625bdc3e9b0a7b5 100644
--- a/libs/shared/lib/vis/nodelink/components/NLPixi.tsx
+++ b/libs/shared/lib/vis/nodelink/components/NLPixi.tsx
@@ -43,11 +43,23 @@ export const NLPixi = (props: Props) => {
   //   app.render();
   // }, [props.windowSize]);
 
+  function resize() {
+    const width = ref?.current?.clientWidth || 1000;
+    const height = ref?.current?.clientHeight || 1000;
+    app.renderer.resize(width, height);
+    if (viewport.current) {
+      viewport.current.screenWidth = width;
+      viewport.current.worldWidth = width;
+      viewport.current.worldHeight = height;
+      viewport.current.screenHeight = height;
+    }
+    app.render();
+  }
+
   useEffect(() => {
     if (!ref.current) return;
     const resizeObserver = new ResizeObserver(() => {
-      app.renderer.resize(ref?.current?.clientWidth || 1000, ref?.current?.clientHeight || 1000);
-      app.render();
+      resize();
     });
     resizeObserver.observe(ref.current);
     return () => resizeObserver.disconnect(); // clean up
@@ -56,8 +68,7 @@ export const NLPixi = (props: Props) => {
   useEffect(() => {
     if (ref.current && ref.current.children.length === 0) {
       ref.current.appendChild(app.view as HTMLCanvasElement);
-      app.renderer.resize(ref?.current?.clientWidth || 1000, ref?.current?.clientHeight || 1000);
-      app.render();
+      resize();
     }
   }, [ref]);