[Bug]Using @deck.gl/arcgis@9.0.20: deck.getTooltip({object}) the parameter object is undefined.

gdnwr commented 2 months ago

Description

Using @deck.gl/arcgis@9.0.20: The value of the parameter "object" in the getTooltip function is undefined.

const layer = new arcGIS.DeckLayer();

layer.deck.getTooltip = ({ object }) => {
  // deck.gl@9.0.20 @deck.gl/arcgis@9.0.20
  // object is undefined
  console.log("deck.getTooltip", object);
  return object?.properties?.name;
};

Flavors

[X] Script tag
[ ] React
[ ] Python/Jupyter notebook
[ ] MapboxOverlay
[ ] GoogleMapsOverlay
[ ] CartoLayer
[X] ArcGIS

Expected Behavior

No response

Steps to Reproduce

@deck.gl/arcgis@9.0.20： https://codesandbox.io/p/sandbox/arcgis-deck-forked-9m52cr?file=%2Findex.html

@deck.gl/arcgis@8.9.35： https://codesandbox.io/p/sandbox/arcgis-deck-forked-pg687r?file=%2Findex.html%3A59%2C28

Environment

Framework version: @deck.gl/arcgis@9.0.20
Browser: chrome 124.0
OS: windows11

Logs

No response

Pessimistress commented 2 months ago

https://github.com/visgl/deck.gl/tree/master/examples/get-started/pure-js/arcgis works as expected.

Please provide fully functional code to reproduce your issue. We cannot debug from screenshots.

gdnwr commented 2 months ago

https://github.com/visgl/deck.gl/tree/master/examples/get-started/pure-js/arcgis works as expected.

Please provide fully functional code to reproduce your issue. We cannot debug from screenshots.

Hello, are examples from CodeSandbox not acceptable? https://codesandbox.io/p/sandbox/arcgis-deck-forked-9m52cr?file=%2Findex.html

<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta
      name="viewport"
      content="initial-scale=1,maximum-scale=1,user-scalable=no"
    />
    <title>
      Build a custom layer view using deck.gl | Sample | ArcGIS Maps SDK for
      JavaScript 4.29
    </title>

    <script src="https://unpkg.com/deck.gl@9.0.14/dist.min.js"></script>
    <script src="https://unpkg.com/@deck.gl/layers@9.0.14/dist.min.js"></script>
    <script src="https://unpkg.com/@deck.gl/arcgis@9.0.14/dist.min.js"></script>
    <link
      rel="stylesheet"
      href="https://js.arcgis.com/4.29/esri/themes/light/main.css"
    />
    <script src="https://js.arcgis.com/4.29/"></script>

    <style>
      html,
      body,
      #viewDiv {
        padding: 0;
        margin: 0;
        height: 100%;
        width: 100%;
      }
    </style>

    <script>
      require(["esri/Map", "esri/views/MapView"], (Map, MapView) => {
        deck.loadArcGISModules().then((arcGIS) => {
          const layer = new arcGIS.DeckLayer();

          const geoJsonLayer = new deck.GeoJsonLayer({
            id: "GeoJsonLayer",
            data: "https://raw.githubusercontent.com/visgl/deck.gl-data/master/website/bart.geo.json",

            extruded: true,
            filled: true,
            getElevation: 30,
            getFillColor: [160, 160, 180, 200],
            getLineColor: (f) => {
              const hex = f.properties.color;
              // convert to RGB
              return hex
                ? hex.match(/[0-9a-f]{2}/g).map((x) => parseInt(x, 16))
                : [0, 0, 0];
            },
            getLineWidth: 600,
            getPointRadius: 4,
            getText: (f) => f.properties.name,
            getTextSize: 12,
            lineWidthMinPixels: 2,
            pointRadiusUnits: "pixels",
            pointType: "circle+text",
            stroked: false,
            pickable: true,
          });

          layer.deck.layers = [geoJsonLayer];

          layer.deck.getCursor = ({ isHovering }) => {
            if (isHovering) return "pointer";
            return "default";
          };
          layer.deck.getTooltip = ({ object }) => {
            // deck.gl@9.0.14 @deck.gl/arcgis@9.0.14
            console.log("deck.getTooltip", object);
            return object?.properties?.name;
          };

          const map = new Map({
            basemap: "dark-gray-vector",
            layers: [layer],
          });

          const mapView = new MapView({
            container: "viewDiv",
            map,
            center: [-122.4, 37.74],
            zoom: 11,
          });
        });
      });
    </script>
  </head>

  <body>
    <div id="viewDiv"></div>
  </body>
</html>

gdnwr commented 2 months ago

@Pessimistress Hello, the test code has been provided. Could you please help with it when you have time? https://codesandbox.io/p/sandbox/arcgis-deck-forked-9m52cr?file=%2Findex.html

Pessimistress commented 2 months ago

I can reproduce this on a Windows machine with NVIDIA GTX 1060. Firefox works as expected. All browsers on Mac work as expected.

gdnwr commented 2 months ago

@Pessimistress May I ask when this issue is scheduled to be fixed?

Pessimistress commented 2 months ago

I do not know what is causing it. If you can provide more information (like your GPU) it may help us narrow it down.

gdnwr commented 1 month ago

Hardware information: AMD Ryzen 7 5800H with Radeon Graphics. no dedicated graphics card. OS: windows11. Chrome125: The issue with Chrome is reproducible. Firefox126: Firefox works normally during initialization, but after dragging the map, it malfunctions.

gdnwr commented 1 month ago

@Pessimistress Hello, the use of deck.gl in ArcGIS is currently almost unusable. Could you collaborate with the ArcGIS developers to address this issue?

damix911 commented 1 month ago

Hello @gdnwr, thank you for your report and repro. I am going to take a look.

gdnwr commented 3 weeks ago

Waiting patiently !

visgl / deck.gl