Fix marquee selection bug in newly created graphs (#1263)

* [#187619346] Bug fix: Marquee selection broken in newly created graph

* It turns out the bug was brought about by the css transition causing the pixi points background object to experience a *negative* width and height. It didn't matter that it subsequently was given positive values. So the fix is to prevent it from ever getting negative width or height.

* * Code review change

v3/src/components/data-display/pixi/pixi-points.ts

@@ -167,10 +167,14 @@ export class PixiPoints {
   }
 
   resize(width: number, height: number) {
-    this.renderer.resize(width, height)
-    this.background.width = width
-    this.background.height = height
-    this.startRendering()
+    // We only set the background size if the width and height are valid. If we ever set width/height of background to
+    // negative values, the background won't be able to detect pointer events.
+    if (width > 0 && height > 0) {
+      this.renderer.resize(width, height)
+      this.background.width = width
+      this.background.height = height
+      this.startRendering()
+    }
   }
 
   setVisibility(isVisible: boolean) {
@@ -505,7 +509,6 @@ export class PixiPoints {
     // Note that background event handling attempts to pass the event to the element beneath the cursor,
     // as if the canvas background were transparent. This facilitates the passing of events to other map layers.
     this.background.eventMode = "static"
-
     // Click event redistribution.
     this.background.on("click", (event: PIXI.FederatedPointerEvent) => {
       const elementUnderneath = getElementUnderCanvas(event)