@deck.gl/arcgis 9.0.0-beta.8 → 9.0.0-beta.9

package/dist/dist.dev.js

@@ -279,7 +279,7 @@ var __exports__ = (() => {
   // bundle.ts
   __reExport(bundle_exports, peer_dependency_exports);
 
-  // src/deck-props.js
+  // dist/deck-props.js
   var properties = {
     layers: {},
     layerFilter: {},
@@ -333,7 +333,7 @@ var __exports__ = (() => {
     return DeckProps;
   }
 
-  // src/deck-layer.js
+  // dist/deck-layer.js
   function createDeckLayer(DeckProps, Layer2, DeckLayerView2D) {
     return Layer2.createSubclass({
       properties: {
@@ -351,9 +351,7 @@ var __exports__ = (() => {
             layer: this
           });
         }
-        console.error(
-          "DeckLayer does not support SceneView at the moment. Use DeckRenderer instead."
-        );
+        console.error("DeckLayer does not support SceneView at the moment. Use DeckRenderer instead.");
         return null;
       }
     });
@@ -4532,9 +4530,9 @@ ${source2}`;
         this.device.gl.transformFeedbackVaryings(this.handle, varyings, bufferMode);
       }
       this._linkShaders();
-      import_core18.log.time(0, `RenderPipeline ${this.id} - shaderLayout introspection`)();
+      import_core18.log.time(1, `RenderPipeline ${this.id} - shaderLayout introspection`)();
       this.introspectedLayout = getShaderLayout(this.device.gl, this.handle);
-      import_core18.log.timeEnd(0, `RenderPipeline ${this.id} - shaderLayout introspection`)();
+      import_core18.log.timeEnd(1, `RenderPipeline ${this.id} - shaderLayout introspection`)();
       this.shaderLayout = (0, import_core19.mergeShaderLayout)(this.introspectedLayout, props.shaderLayout);
       switch (this.props.topology) {
         case "triangle-fan-webgl":
@@ -5824,11 +5822,11 @@ ${source2}`;
     return true;
   }
 
-  // src/commons.ts
+  // dist/commons.js
   var import_engine = __toESM(require_engine(), 1);
   var import_core29 = __toESM(require_core(), 1);
   function initializeResources(device) {
-    const deckglTexture = device.createTexture({
+    const texture = device.createTexture({
       format: "rgba8unorm",
       width: 1,
       height: 1,
@@ -5839,15 +5837,13 @@ ${source2}`;
         addressModeV: "clamp-to-edge"
       }
     });
-    this.deckglTexture = deckglTexture;
-    this.buffer = device.createBuffer(new Int8Array([-1, -1, 1, -1, -1, 1, -1, 1, 1, 1, 1, -1]));
-    this.model = new import_engine.Model(device, {
+    const model = new import_engine.Model(device, {
       vs: `#version 300 es
-in vec2 a_pos;
+in vec2 pos;
 out vec2 v_texcoord;
 void main(void) {
-    gl_Position = vec4(a_pos, 0.0, 1.0);
-    v_texcoord = (a_pos + 1.0) / 2.0;
+    gl_Position = vec4(pos, 0.0, 1.0);
+    v_texcoord = (pos + 1.0) / 2.0;
 }
     `,
       fs: `#version 300 es
@@ -5862,124 +5858,115 @@ void main(void) {
     fragColor = imageColor;
 }
     `,
-      bufferLayout: [{ name: "a_pos", format: "sint8x2" }],
       bindings: {
-        deckglTexture
+        deckglTexture: texture
       },
       parameters: {
         depthWriteEnabled: true,
         depthCompare: "less-equal"
       },
-      attributes: {
-        a_pos: this.buffer
-      },
-      vertexCount: 6,
-      topology: "triangle-strip"
+      geometry: new import_engine.Geometry({
+        topology: "triangle-strip",
+        attributes: {
+          pos: { size: 2, value: new Int8Array([-1, -1, 1, -1, -1, 1, -1, 1, 1, 1, 1, -1]) }
+        }
+      }),
+      vertexCount: 6
     });
-    this.deckFbo = device.createFramebuffer({
+    const fbo = device.createFramebuffer({
       id: "deckfbo",
       width: 1,
       height: 1,
-      colorAttachments: [deckglTexture]
+      colorAttachments: [texture]
     });
-    this.deckInstance = new import_core29.Deck({
+    const deckInstance = new import_core29.Deck({
       viewState: {},
       controller: false,
-      gl: device.gl,
+      device,
       parameters: {
         depthTest: true
       },
-      _framebuffer: this.deckFbo,
+      _framebuffer: fbo,
       width: null,
       height: null,
       _customRender: (redrawReason) => {
         if (redrawReason === "arcgis") {
-          this.deckInstance._drawLayers(redrawReason);
+          deckInstance._drawLayers(redrawReason);
         } else {
           this.redraw();
         }
       }
     });
+    return { deck: deckInstance, texture, fbo, model };
   }
-  function render({ gl, width, height, viewState }) {
-    const screenFbo = gl.getParameter(gl.FRAMEBUFFER_BINDING);
+  function render(resources, viewport) {
+    const { model, deck, fbo } = resources;
+    const device = model.device;
+    const screenFbo = device.getParametersWebGL(36006);
+    const { width, height, ...viewState } = viewport;
     const dpr = window.devicePixelRatio;
-    width = Math.round(width * dpr);
-    height = Math.round(height * dpr);
-    this.deckFbo.resize({ width, height });
-    this.deckInstance.setProps({ viewState });
-    this.deckInstance.redraw("arcgis");
-    const device = this.deckInstance.device;
+    const pixelWidth = Math.round(width * dpr);
+    const pixelHeight = Math.round(height * dpr);
+    fbo.resize({ width: pixelWidth, height: pixelHeight });
+    deck.setProps({ viewState });
+    deck.redraw("arcgis");
     const textureToScreenPass = device.beginRenderPass({
       framebuffer: screenFbo,
-      parameters: { viewport: [0, 0, width, height] },
+      parameters: { viewport: [0, 0, pixelWidth, pixelHeight] },
       clearColor: [0, 0, 0, 0],
       clearDepth: 1
     });
-    device.withParametersWebGL(
-      {
-        blend: true,
-        blendFunc: [gl.ONE, gl.ONE_MINUS_SRC_ALPHA]
-      },
-      () => {
-        this.model.setBindings({
-          deckglTexture: this.deckFbo.colorAttachments[0]
-        });
-        this.model.draw(textureToScreenPass);
-      }
-    );
+    device.withParametersWebGL({
+      blend: true,
+      blendFunc: [1, 771]
+    }, () => {
+      model.draw(textureToScreenPass);
+    });
   }
-  function finalizeResources() {
-    this.deckInstance?.finalize();
-    this.deckInstance = null;
-    this.model?.delete();
-    this.buffer?.delete();
-    this.deckFbo?.delete();
-    this.deckglTexture?.delete();
+  function finalizeResources(resources) {
+    resources.deck.finalize();
+    resources.model.destroy();
+    resources.fbo.destroy();
+    resources.texture.destroy();
   }
 
-  // src/deck-layer-view-2d.js
+  // dist/deck-layer-view-2d.js
   function createDeckLayerView2D(BaseLayerViewGL2D) {
     return BaseLayerViewGL2D.createSubclass({
       properties: {
-        deckgl: {},
-        deckFbo: {},
-        model: {},
-        buffer: {}
+        resources: null
       },
       attach() {
         const gl = this.context;
         const device = WebGLDevice.attach(gl);
-        initializeResources.call(this, device);
-        this.layer.deck.on("change", (props) => this.deckInstance.setProps(props));
-        this.deckInstance.setProps(this.layer.deck.toJSON());
+        this.resources = initializeResources.call(this, device);
+        this.layer.deck.on("change", (props) => this.resources.deck.setProps(props));
+        this.resources.deck.setProps(this.layer.deck.toJSON());
       },
       redraw() {
         this.requestRender();
       },
       detach() {
-        finalizeResources.call(this);
+        finalizeResources(this.resources);
+        this.resources = null;
       },
       render(renderParameters) {
         const [width, height] = this.view.state.size;
         const state = renderParameters.state;
-        render.call(this, {
-          gl: renderParameters.context,
+        render(this.resources, {
           width,
           height,
-          viewState: {
-            latitude: this.view.center.latitude,
-            longitude: this.view.center.longitude,
-            zoom: this.view.featuresTilingScheme.scaleToLevel(state.scale),
-            bearing: -state.rotation,
-            pitch: 0
-          }
+          latitude: this.view.center.latitude,
+          longitude: this.view.center.longitude,
+          zoom: this.view.featuresTilingScheme.scaleToLevel(state.scale),
+          bearing: -state.rotation,
+          pitch: 0
         });
       }
     });
   }
 
-  // src/deck-renderer.js
+  // dist/deck-renderer.js
   function arcgisFOVToDeckAltitude(fov, aspectRatio) {
     const D = Math.sqrt(1 + aspectRatio ** 2);
     const halfFOV = fov / 2 / 180 * Math.PI;
@@ -5988,44 +5975,46 @@ void main(void) {
   function createDeckRenderer(DeckProps, externalRenderers) {
     class DeckRenderer {
       constructor(view, props) {
+        this.resources = null;
         this.view = view;
         this.deck = new DeckProps(props);
       }
       setup(context) {
         const gl = context.gl;
-        initializeResources.call(this, gl);
-        this.deck.on("change", (props) => this.deckInstance.setProps(props));
-        this.deckInstance.setProps(this.deck.toJSON());
+        const device = WebGLDevice.attach(gl);
+        const resources = initializeResources.call(this, device);
+        this.deck.on("change", (props) => resources.deck.setProps(props));
+        resources.deck.setProps(this.deck.toJSON());
+        this.resources = resources;
       }
       dispose() {
-        finalizeResources.call(this);
+        if (this.resources) {
+          finalizeResources(this.resources);
+        }
       }
       redraw() {
         externalRenderers.requestRender(this.view);
       }
-      render(context) {
+      render() {
         const [width, height] = this.view.size;
-        render.call(this, {
-          gl: context.gl,
+        render(this.resources, {
           width,
           height,
-          viewState: {
-            latitude: this.view.center.latitude,
-            longitude: this.view.center.longitude,
-            altitude: arcgisFOVToDeckAltitude(this.view.camera.fov, width / height),
-            zoom: this.view.zoom,
-            bearing: this.view.camera.heading,
-            pitch: this.view.camera.tilt
-          }
+          latitude: this.view.center.latitude,
+          longitude: this.view.center.longitude,
+          altitude: arcgisFOVToDeckAltitude(this.view.camera.fov, width / height),
+          zoom: this.view.zoom,
+          bearing: this.view.camera.heading,
+          pitch: this.view.camera.tilt
         });
       }
     }
     return DeckRenderer;
   }
 
-  // src/load-modules.js
+  // dist/load-modules.js
   var import_esri_loader = __toESM(require_esri_loader(), 1);
-  var arcGIS = null;
+  var arcGIS;
   async function loadArcGISModules(modules, loadScriptOptions) {
     const namespace = Array.isArray(modules) ? null : modules;
     await loadArcGISModule(namespace, loadScriptOptions);
@@ -6036,28 +6025,24 @@ void main(void) {
     }
     return arcGIS;
   }
-  function loadArcGISModule(esri, loadScriptOptions) {
+  async function loadArcGISModule(esri, loadScriptOptions) {
     if (arcGIS) {
       return arcGIS;
     }
     if (esri) {
-      const Layer2 = esri.layers.Layer;
-      const Accessor2 = esri.core.Accessor;
-      const BaseLayerViewGL2D = esri.views["2d"].layers.BaseLayerViewGL2D;
-      const externalRenderers = esri.views["3d"].externalRenderers;
-      return initialize(Layer2, Accessor2, BaseLayerViewGL2D, externalRenderers);
-    }
-    return (0, import_esri_loader.loadModules)(
-      [
-        "esri/layers/Layer",
-        "esri/core/Accessor",
-        "esri/views/2d/layers/BaseLayerViewGL2D",
-        "esri/views/3d/externalRenderers"
-      ],
-      loadScriptOptions
-    ).then(([Layer2, Accessor2, BaseLayerViewGL2D, externalRenderers]) => {
-      return initialize(Layer2, Accessor2, BaseLayerViewGL2D, externalRenderers);
-    });
+      const Layer3 = esri.layers.Layer;
+      const Accessor3 = esri.core.Accessor;
+      const BaseLayerViewGL2D2 = esri.views["2d"].layers.BaseLayerViewGL2D;
+      const externalRenderers2 = esri.views["3d"].externalRenderers;
+      return initialize(Layer3, Accessor3, BaseLayerViewGL2D2, externalRenderers2);
+    }
+    const [Layer2, Accessor2, BaseLayerViewGL2D, externalRenderers] = await (0, import_esri_loader.loadModules)([
+      "esri/layers/Layer",
+      "esri/core/Accessor",
+      "esri/views/2d/layers/BaseLayerViewGL2D",
+      "esri/views/3d/externalRenderers"
+    ], loadScriptOptions);
+    return initialize(Layer2, Accessor2, BaseLayerViewGL2D, externalRenderers);
   }
   function initialize(Layer2, Accessor2, BaseLayerViewGL2D, externalRenderers) {
     const DeckProps = createDeckProps(Accessor2);