@amcharts/amcharts5 5.7.2 → 5.7.4

package/.internal/core/render/backend/CanvasRenderer.js

@@ -3302,10 +3302,6 @@ export class CanvasRendererEvent {
  * @ignore
  */
 export class CanvasRenderer extends ArrayDisposer {
-    /*protected _mouseMoveThrottler: Throttler = new Throttler(() => {
-        this._dispatchGlobalMousemove(this._lastPointerMoveEvent.event, this._lastPointerMoveEvent.native);
-    });
-    */
     constructor(resolution) {
         super();
         Object.defineProperty(this, "view", {
@@ -3564,6 +3560,13 @@ export class CanvasRenderer extends ArrayDisposer {
             }, { passive: false }));
         }
     }
+    /*protected _mouseMoveThrottler: Throttler = new Throttler(() => {
+        this._dispatchGlobalMousemove(this._lastPointerMoveEvent.event, this._lastPointerMoveEvent.native);
+    });
+    */
+    resetImageArray() {
+        this._ghostLayer.imageArray = undefined;
+    }
     _delayTouchDeactivate() {
         if (this._touchActiveTimeout) {
             clearTimeout(this._touchActiveTimeout);
@@ -3819,8 +3822,13 @@ export class CanvasRenderer extends ArrayDisposer {
         return hit;
     }
     getObjectAtPoint(point) {
-        const bbox = this._adjustBoundingBox(this.view.getBoundingClientRect());
-        return this._getHitTarget(point, bbox, this._layerDom) || undefined;
+        const data = this._ghostLayer.getImageArray(point);
+        if (data[0] === 0 && data[1] === 0 && data[2] === 0) {
+            return undefined;
+        }
+        const colorId = Color.fromRGB(data[0], data[1], data[2]).toCSS();
+        const hit = this._colorMap[colorId];
+        return hit;
     }
     _withEvents(key, f) {
         const events = this._events[key];
@@ -4348,6 +4356,12 @@ class GhostLayer {
                 bottom: 0,
             }
         });
+        Object.defineProperty(this, "_resolution", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: 1
+        });
         Object.defineProperty(this, "_width", {
             enumerable: true,
             configurable: true,
@@ -4360,6 +4374,12 @@ class GhostLayer {
             writable: true,
             value: 0
         });
+        Object.defineProperty(this, "imageArray", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
         this.view = document.createElement("canvas");
         this.context = this.view.getContext("2d", { alpha: false, willReadFrequently: true });
         this.context.imageSmoothingEnabled = false;
@@ -4368,6 +4388,7 @@ class GhostLayer {
         this.view.style.left = "0px";
     }
     resize(canvasWidth, canvasHeight, domWidth, domHeight, resolution) {
+        this._resolution = resolution;
         canvasWidth += (this.margin.left + this.margin.right);
         canvasHeight += (this.margin.top + this.margin.bottom);
         // TODO this should take into account calculateSize
@@ -4387,6 +4408,16 @@ class GhostLayer {
         // TODO should this round ?
         Math.round(((point.x - bbox.left) / bbox.width) * this._width), Math.round(((point.y - bbox.top) / bbox.height) * this._height), 1, 1);
     }
+    getImageArray(point) {
+        if (!this.imageArray) {
+            this.imageArray = this.context.getImageData(0, 0, this._width, this._height).data;
+        }
+        const data = this.imageArray;
+        const x = Math.round(point.x * this._resolution);
+        const y = Math.round(point.y * this._resolution);
+        const i = (y * this._width + x) * 4;
+        return [data[i], data[i + 1], data[i + 2], data[i + 3]];
+    }
     setMargin(layers) {
         this.margin.left = 0;
         this.margin.right = 0;