@deck.gl/arcgis 9.0.0-beta.1 → 9.0.0-beta.10

package/package.json

@@ -2,7 +2,8 @@
   "name": "@deck.gl/arcgis",
   "description": "Use deck.gl as a custom ArcGIS API for JavaScript layer",
   "license": "MIT",
-  "version": "9.0.0-beta.1",
+  "type": "module",
+  "version": "9.0.0-beta.10",
   "publishConfig": {
     "access": "public"
   },
@@ -16,12 +17,17 @@
     "type": "git",
     "url": "https://github.com/visgl/deck.gl.git"
   },
-  "main": "dist/es5/index.js",
-  "module": "dist/esm/index.js",
+  "main": "dist/index.cjs",
+  "module": "dist/index.js",
+  "exports": {
+    ".": {
+      "import": "./dist/index.js",
+      "require": "./dist/index.cjs"
+    }
+  },
   "files": [
     "dist",
     "src",
-    "typed",
     "dist.min.js"
   ],
   "sideEffects": false,
@@ -29,15 +35,19 @@
     "build-bundle": "ocular-bundle ./bundle.ts",
     "prepublishOnly": "npm run build-bundle && npm run build-bundle -- --env=dev"
   },
+  "dependencies": {
+    "@luma.gl/constants": "^9.0.4",
+    "@luma.gl/webgl": "^9.0.4",
+    "esri-loader": "^3.3.0"
+  },
   "peerDependencies": {
     "@arcgis/core": "^4.0.0",
-    "@deck.gl/core": "^9.0.0-alpha",
-    "@luma.gl/core": "9.0.0-alpha.54",
-    "@luma.gl/engine": "9.0.0-alpha.54"
+    "@deck.gl/core": "^9.0.0-beta",
+    "@luma.gl/core": "^9.0.4",
+    "@luma.gl/engine": "^9.0.4"
   },
-  "dependencies": {
-    "@babel/runtime": "^7.0.0",
-    "esri-loader": "^3.3.0"
+  "devDependencies": {
+    "@arcgis/core": "^4.21.0"
   },
-  "gitHead": "9628417918bec5cc73c1345bfcd2f2be575741f1"
+  "gitHead": "6c44f602069374cd21268ff279c5bf818c905ff7"
 }

package/src/commons.ts

@@ -1,49 +1,82 @@
 /* eslint-disable no-invalid-this */
 
-import type {Device} from '@luma.gl/core';
-import {Model} from '@luma.gl/engine';
 import {GL} from '@luma.gl/constants';
-import {withGLParameters} from '@luma.gl/webgl';
-
+import {Model, Geometry} from '@luma.gl/engine';
 import {Deck} from '@deck.gl/core';
+import type {Device, Texture, Framebuffer} from '@luma.gl/core';
+import type {WebGLDevice} from '@luma.gl/webgl';
+
+interface Renderer {
+  redraw: () => void;
+}
 
-export function initializeResources(device: Device) {
-  // What is `this` referring to this function???
-  this.buffer = device.createBuffer(new Int8Array([-1, -1, 1, -1, -1, 1, 1, 1]));
+export type RenderResources = {
+  deck: Deck;
+  texture: Texture;
+  model: Model;
+  fbo: Framebuffer;
+};
+
+export function initializeResources(this: Renderer, device: Device): RenderResources {
+  const texture = device.createTexture({
+    format: 'rgba8unorm',
+    width: 1,
+    height: 1,
+    sampler: {
+      minFilter: 'linear',
+      magFilter: 'linear',
+      addressModeU: 'clamp-to-edge',
+      addressModeV: 'clamp-to-edge'
+    }
+  });
 
-  this.model = new Model(device, {
+  const model = new 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
 precision mediump float;
-uniform sampler2D u_texture;
+uniform sampler2D deckglTexture;
 in vec2 v_texcoord;
 out vec4 fragColor;
+
 void main(void) {
-    vec4 rgba = texture(u_texture, v_texcoord);
-    rgba.rgb *= rgba.a;
-    fragColor = rgba;
+    vec4 imageColor = texture(deckglTexture, v_texcoord);
+    imageColor.rgb *= imageColor.a;
+    fragColor = imageColor;
 }
     `,
-    attributes: {
-      // eslint-disable-next-line camelcase
-      a_pos: this.buffer
+    bindings: {
+      deckglTexture: texture
+    },
+    parameters: {
+      depthWriteEnabled: true,
+      depthCompare: 'less-equal'
     },
-    vertexCount: 4,
-    drawMode: GL.TRIANGLE_STRIP
+    geometry: new 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({width: 1, height: 1});
+  const fbo = device.createFramebuffer({
+    id: 'deckfbo',
+    width: 1,
+    height: 1,
+    colorAttachments: [texture]
+  });
 
-  this.deckInstance = new Deck({
+  const deckInstance = new Deck({
     // The view state will be set dynamically to track the MapView current extent.
     viewState: {},
 
@@ -51,7 +84,7 @@ void main(void) {
     controller: false,
 
     // We use the same WebGL context as the ArcGIS API for JavaScript.
-    gl: device.gl,
+    device,
 
     // We need depth testing in general; we don't know what layers might be added to the deck.
     parameters: {
@@ -59,7 +92,7 @@ void main(void) {
     },
 
     // This deck renders into an auxiliary framebuffer.
-    _framebuffer: this.deckFbo,
+    _framebuffer: fbo,
 
     // To disable canvas resizing, since the FBO is owned by the ArcGIS API for JavaScript.
     width: null,
@@ -67,49 +100,68 @@ void main(void) {
 
     _customRender: redrawReason => {
       if (redrawReason === 'arcgis') {
-        this.deckInstance._drawLayers(redrawReason);
+        deckInstance._drawLayers(redrawReason);
       } else {
         this.redraw();
       }
     }
   });
+
+  return {deck: deckInstance, texture, fbo, model};
 }
 
-export function render({gl, width, height, viewState}) {
-  const screenFbo = gl.getParameter(gl.FRAMEBUFFER_BINDING);
+export function render(
+  resources: RenderResources,
+  viewport: {
+    width: number;
+    height: number;
+    longitude: number;
+    latitude: number;
+    zoom: number;
+    altitude?: number;
+    pitch: number;
+    bearing: number;
+  }
+) {
+  const {model, deck, fbo} = resources;
+  const device = model.device;
+  const screenFbo = (device as WebGLDevice).getParametersWebGL(GL.FRAMEBUFFER_BINDING);
+  const {width, height, ...viewState} = viewport;
 
   /* global window */
   const dpr = window.devicePixelRatio;
-  width = Math.round(width * dpr);
-  height = Math.round(height * dpr);
+  const pixelWidth = Math.round(width * dpr);
+  const pixelHeight = Math.round(height * dpr);
 
-  this.deckFbo.resize({width, height});
+  fbo.resize({width: pixelWidth, height: pixelHeight});
 
-  this.deckInstance.setProps({viewState});
+  deck.setProps({viewState});
   // redraw deck immediately into deckFbo
-  this.deckInstance.redraw('arcgis');
+  deck.redraw('arcgis');
 
   // We overlay the texture on top of the map using the full-screen quad.
-  withGLParameters(
-    gl,
+
+  const textureToScreenPass = device.beginRenderPass({
+    framebuffer: screenFbo,
+    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],
-      framebuffer: screenFbo,
-      viewport: [0, 0, width, height]
+      blendFunc: [GL.ONE, GL.ONE_MINUS_SRC_ALPHA]
     },
     () => {
-      // eslint-disable-next-line camelcase
-      this.model.setUniforms({u_texture: this.deckFbo}).draw(this.context.renderPass);
+      model.draw(textureToScreenPass);
     }
   );
 }
 
-export function finalizeResources() {
-  this.deckInstance?.finalize();
-  this.deckInstance = null;
-
-  this.model?.delete();
-  this.buffer?.delete();
-  this.deckFbo?.delete();
+export function finalizeResources(resources: RenderResources) {
+  resources.deck.finalize();
+  resources.model.destroy();
+  resources.fbo.destroy();
+  resources.texture.destroy();
 }

package/src/{deck-layer-view-2d.js → deck-layer-view-2d.ts}

@@ -1,12 +1,10 @@
+import {WebGLDevice} from '@luma.gl/webgl';
 import {initializeResources, render, finalizeResources} from './commons';
 
 export default function createDeckLayerView2D(BaseLayerViewGL2D) {
   return BaseLayerViewGL2D.createSubclass({
     properties: {
-      deckgl: {},
-      deckFbo: {},
-      model: {},
-      buffer: {}
+      resources: null
     },
 
     // Attach is called as soon as the layer view is ready to start rendering.
@@ -14,13 +12,15 @@ export default function createDeckLayerView2D(BaseLayerViewGL2D) {
       // We use a full-screen quad and shaders to composite the frame rendered
       // with deck.gl on top of the MapView. Composition uses the MapView context.
       const gl = this.context;
-      initializeResources.call(this, gl);
+      const device = WebGLDevice.attach(gl);
+
+      this.resources = initializeResources.call(this, device);
 
       // Update deck props
-      this.layer.deck.on('change', props => this.deckInstance.setProps(props));
+      this.layer.deck.on('change', props => this.resources.deck.setProps(props));
 
       // We need to start drawing the deck.gl layer immediately.
-      this.deckInstance.setProps(this.layer.deck.toJSON());
+      this.resources.deck.setProps(this.layer.deck.toJSON());
     },
 
     redraw() {
@@ -29,7 +29,8 @@ export default function createDeckLayerView2D(BaseLayerViewGL2D) {
 
     // Called when the layer must be destroyed.
     detach() {
-      finalizeResources.call(this);
+      finalizeResources(this.resources);
+      this.resources = null;
     },
 
     // Called every time that the layer view must be rendered.
@@ -38,17 +39,14 @@ export default function createDeckLayerView2D(BaseLayerViewGL2D) {
       // The view state must be kept in-sync with the MapView of the ArcGIS API.
       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
       });
     }
   });

package/src/deck-renderer.ts

@@ -0,0 +1,65 @@
+/* eslint-disable no-invalid-this */
+import {WebGLDevice} from '@luma.gl/webgl';
+import {initializeResources, render, finalizeResources, RenderResources} from './commons';
+
+import SceneView from '@arcgis/core/views/SceneView';
+import type {DeckProps} from '@deck.gl/core';
+
+/** Convert ArcGIS FOV to WebMercatorViewport altitude */
+function arcgisFOVToDeckAltitude(fov: number, aspectRatio: number): number {
+  // ArcGIS fov is corner-to-corner
+  const D = Math.sqrt(1 + aspectRatio ** 2);
+  const halfFOV = (fov / 2 / 180) * Math.PI;
+  return D / 2 / Math.tan(halfFOV);
+}
+
+export default function createDeckRenderer(DeckProps, externalRenderers) {
+  class DeckRenderer {
+    view: SceneView;
+    deck: any;
+    resources: RenderResources | null = null;
+
+    constructor(view: SceneView, props: DeckProps) {
+      this.view = view;
+      this.deck = new DeckProps(props);
+    }
+
+    setup(context) {
+      const gl = context.gl;
+      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() {
+      if (this.resources) {
+        finalizeResources(this.resources);
+      }
+    }
+
+    redraw() {
+      externalRenderers.requestRender(this.view);
+    }
+
+    render() {
+      const [width, height] = this.view.size;
+
+      render(this.resources!, {
+        width,
+        height,
+        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;
+}

package/src/{load-modules.js → load-modules.ts}

@@ -2,11 +2,20 @@ import createDeckProps from './deck-props';
 import createDeckLayer from './deck-layer';
 import createDeckLayerView2D from './deck-layer-view-2d';
 import createDeckRenderer from './deck-renderer';
-import {loadModules as esriLoaderLoadModules} from 'esri-loader';
+import {loadModules as esriLoaderLoadModules, ILoadScriptOptions} from 'esri-loader';
 
-let arcGIS = null;
+type LoadedModules = {
+  DeckLayer: any;
+  DeckRenderer: any;
+  modules?: unknown[];
+};
 
-export async function loadArcGISModules(modules, loadScriptOptions) {
+let arcGIS: LoadedModules;
+
+export async function loadArcGISModules(
+  modules: string[],
+  loadScriptOptions: ILoadScriptOptions
+): Promise<LoadedModules> {
   const namespace = Array.isArray(modules) ? null : modules;
   await loadArcGISModule(namespace, loadScriptOptions);
 
@@ -18,7 +27,10 @@ export async function loadArcGISModules(modules, loadScriptOptions) {
   return arcGIS;
 }
 
-function loadArcGISModule(esri, loadScriptOptions) {
+async function loadArcGISModule(
+  esri,
+  loadScriptOptions: ILoadScriptOptions
+): Promise<LoadedModules> {
   if (arcGIS) {
     // Already loaded
     return arcGIS;
@@ -34,7 +46,7 @@ function loadArcGISModule(esri, loadScriptOptions) {
     return initialize(Layer, Accessor, BaseLayerViewGL2D, externalRenderers);
   }
 
-  return esriLoaderLoadModules(
+  const [Layer, Accessor, BaseLayerViewGL2D, externalRenderers] = await esriLoaderLoadModules(
     [
       'esri/layers/Layer',
       'esri/core/Accessor',
@@ -42,12 +54,11 @@ function loadArcGISModule(esri, loadScriptOptions) {
       'esri/views/3d/externalRenderers'
     ],
     loadScriptOptions
-  ).then(([Layer, Accessor, BaseLayerViewGL2D, externalRenderers]) => {
-    return initialize(Layer, Accessor, BaseLayerViewGL2D, externalRenderers);
-  });
+  );
+  return initialize(Layer, Accessor, BaseLayerViewGL2D, externalRenderers);
 }
 
-function initialize(Layer, Accessor, BaseLayerViewGL2D, externalRenderers) {
+function initialize(Layer, Accessor, BaseLayerViewGL2D, externalRenderers): LoadedModules {
   const DeckProps = createDeckProps(Accessor);
   const DeckLayerView2D = createDeckLayerView2D(BaseLayerViewGL2D);
   const DeckLayer = createDeckLayer(DeckProps, Layer, DeckLayerView2D);

package/dist/es5/commons.js

@@ -1,95 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.initializeResources = initializeResources;
-exports.render = render;
-exports.finalizeResources = finalizeResources;
-
-var _engine = require("@luma.gl/engine");
-
-var _constants = require("@luma.gl/constants");
-
-var _webgl = require("@luma.gl/webgl");
-
-var _core = require("@deck.gl/core");
-
-function initializeResources(device) {
-  var _this = this;
-
-  this.buffer = device.createBuffer(new Int8Array([-1, -1, 1, -1, -1, 1, 1, 1]));
-  this.model = new _engine.Model(device, {
-    vs: "#version 300 es\nin vec2 a_pos;\nout vec2 v_texcoord;\nvoid main(void) {\n    gl_Position = vec4(a_pos, 0.0, 1.0);\n    v_texcoord = (a_pos + 1.0) / 2.0;\n}\n    ",
-    fs: "#version 300 es\nprecision mediump float;\nuniform sampler2D u_texture;\nin vec2 v_texcoord;\nout vec4 fragColor;\nvoid main(void) {\n    vec4 rgba = texture(u_texture, v_texcoord);\n    rgba.rgb *= rgba.a;\n    fragColor = rgba;\n}\n    ",
-    attributes: {
-      a_pos: this.buffer
-    },
-    vertexCount: 4,
-    drawMode: 5
-  });
-  this.deckFbo = device.createFramebuffer({
-    width: 1,
-    height: 1
-  });
-  this.deckInstance = new _core.Deck({
-    viewState: {},
-    controller: false,
-    gl: device.gl,
-    parameters: {
-      depthTest: true
-    },
-    _framebuffer: this.deckFbo,
-    width: null,
-    height: null,
-    _customRender: function _customRender(redrawReason) {
-      if (redrawReason === 'arcgis') {
-        _this.deckInstance._drawLayers(redrawReason);
-      } else {
-        _this.redraw();
-      }
-    }
-  });
-}
-
-function render(_ref) {
-  var _this2 = this;
-
-  var gl = _ref.gl,
-      width = _ref.width,
-      height = _ref.height,
-      viewState = _ref.viewState;
-  var screenFbo = gl.getParameter(36006);
-  var dpr = window.devicePixelRatio;
-  width = Math.round(width * dpr);
-  height = Math.round(height * dpr);
-  this.deckFbo.resize({
-    width: width,
-    height: height
-  });
-  this.deckInstance.setProps({
-    viewState: viewState
-  });
-  this.deckInstance.redraw('arcgis');
-  (0, _webgl.withGLParameters)(gl, {
-    blend: true,
-    blendFunc: [1, 771],
-    framebuffer: screenFbo,
-    viewport: [0, 0, width, height]
-  }, function () {
-    _this2.model.setUniforms({
-      u_texture: _this2.deckFbo
-    }).draw(_this2.context.renderPass);
-  });
-}
-
-function finalizeResources() {
-  var _this$deckInstance, _this$model, _this$buffer, _this$deckFbo;
-
-  (_this$deckInstance = this.deckInstance) === null || _this$deckInstance === void 0 ? void 0 : _this$deckInstance.finalize();
-  this.deckInstance = null;
-  (_this$model = this.model) === null || _this$model === void 0 ? void 0 : _this$model.delete();
-  (_this$buffer = this.buffer) === null || _this$buffer === void 0 ? void 0 : _this$buffer.delete();
-  (_this$deckFbo = this.deckFbo) === null || _this$deckFbo === void 0 ? void 0 : _this$deckFbo.delete();
-}
-//# sourceMappingURL=commons.js.map

package/dist/es5/commons.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/commons.ts"],"names":["initializeResources","device","buffer","createBuffer","Int8Array","model","Model","vs","fs","attributes","a_pos","vertexCount","drawMode","deckFbo","createFramebuffer","width","height","deckInstance","Deck","viewState","controller","gl","parameters","depthTest","_framebuffer","_customRender","redrawReason","_drawLayers","redraw","render","screenFbo","getParameter","dpr","window","devicePixelRatio","Math","round","resize","setProps","blend","blendFunc","framebuffer","viewport","setUniforms","u_texture","draw","context","renderPass","finalizeResources","finalize","delete"],"mappings":"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","sourcesContent":["/* eslint-disable no-invalid-this */\n\nimport type {Device} from '@luma.gl/core';\nimport {Model} from '@luma.gl/engine';\nimport {GL} from '@luma.gl/constants';\nimport {withGLParameters} from '@luma.gl/webgl';\n\nimport {Deck} from '@deck.gl/core';\n\nexport function initializeResources(device: Device) {\n  // What is `this` referring to this function???\n  this.buffer = device.createBuffer(new Int8Array([-1, -1, 1, -1, -1, 1, 1, 1]));\n\n  this.model = new Model(device, {\n    vs: `\\\n#version 300 es\nin vec2 a_pos;\nout vec2 v_texcoord;\nvoid main(void) {\n    gl_Position = vec4(a_pos, 0.0, 1.0);\n    v_texcoord = (a_pos + 1.0) / 2.0;\n}\n    `,\n    fs: `\\\n#version 300 es\nprecision mediump float;\nuniform sampler2D u_texture;\nin vec2 v_texcoord;\nout vec4 fragColor;\nvoid main(void) {\n    vec4 rgba = texture(u_texture, v_texcoord);\n    rgba.rgb *= rgba.a;\n    fragColor = rgba;\n}\n    `,\n    attributes: {\n      // eslint-disable-next-line camelcase\n      a_pos: this.buffer\n    },\n    vertexCount: 4,\n    drawMode: GL.TRIANGLE_STRIP\n  });\n\n  this.deckFbo = device.createFramebuffer({width: 1, height: 1});\n\n  this.deckInstance = new Deck({\n    // The view state will be set dynamically to track the MapView current extent.\n    viewState: {},\n\n    // Input is handled by the ArcGIS API for JavaScript.\n    controller: false,\n\n    // We use the same WebGL context as the ArcGIS API for JavaScript.\n    gl: device.gl,\n\n    // We need depth testing in general; we don't know what layers might be added to the deck.\n    parameters: {\n      depthTest: true\n    },\n\n    // This deck renders into an auxiliary framebuffer.\n    _framebuffer: this.deckFbo,\n\n    // To disable canvas resizing, since the FBO is owned by the ArcGIS API for JavaScript.\n    width: null,\n    height: null,\n\n    _customRender: redrawReason => {\n      if (redrawReason === 'arcgis') {\n        this.deckInstance._drawLayers(redrawReason);\n      } else {\n        this.redraw();\n      }\n    }\n  });\n}\n\nexport function render({gl, width, height, viewState}) {\n  const screenFbo = gl.getParameter(gl.FRAMEBUFFER_BINDING);\n\n  /* global window */\n  const dpr = window.devicePixelRatio;\n  width = Math.round(width * dpr);\n  height = Math.round(height * dpr);\n\n  this.deckFbo.resize({width, height});\n\n  this.deckInstance.setProps({viewState});\n  // redraw deck immediately into deckFbo\n  this.deckInstance.redraw('arcgis');\n\n  // We overlay the texture on top of the map using the full-screen quad.\n  withGLParameters(\n    gl,\n    {\n      blend: true,\n      blendFunc: [gl.ONE, gl.ONE_MINUS_SRC_ALPHA],\n      framebuffer: screenFbo,\n      viewport: [0, 0, width, height]\n    },\n    () => {\n      // eslint-disable-next-line camelcase\n      this.model.setUniforms({u_texture: this.deckFbo}).draw(this.context.renderPass);\n    }\n  );\n}\n\nexport function finalizeResources() {\n  this.deckInstance?.finalize();\n  this.deckInstance = null;\n\n  this.model?.delete();\n  this.buffer?.delete();\n  this.deckFbo?.delete();\n}\n"],"file":"commons.js"}

package/dist/es5/deck-layer-view-2d.js

@@ -1,62 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = createDeckLayerView2D;
-
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
-var _commons = require("./commons");
-
-function createDeckLayerView2D(BaseLayerViewGL2D) {
-  return BaseLayerViewGL2D.createSubclass({
-    properties: {
-      deckgl: {},
-      deckFbo: {},
-      model: {},
-      buffer: {}
-    },
-    attach: function attach() {
-      var _this = this;
-
-      var gl = this.context;
-
-      _commons.initializeResources.call(this, gl);
-
-      this.layer.deck.on('change', function (props) {
-        return _this.deckInstance.setProps(props);
-      });
-      this.deckInstance.setProps(this.layer.deck.toJSON());
-    },
-    redraw: function redraw() {
-      this.requestRender();
-    },
-    detach: function detach() {
-      _commons.finalizeResources.call(this);
-    },
-    render: function render(renderParameters) {
-      var _this$view$state$size = (0, _slicedToArray2.default)(this.view.state.size, 2),
-          width = _this$view$state$size[0],
-          height = _this$view$state$size[1];
-
-      var state = renderParameters.state;
-
-      _commons.render.call(this, {
-        gl: renderParameters.context,
-        width: width,
-        height: height,
-        viewState: {
-          latitude: this.view.center.latitude,
-          longitude: this.view.center.longitude,
-          zoom: this.view.featuresTilingScheme.scaleToLevel(state.scale),
-          bearing: -state.rotation,
-          pitch: 0
-        }
-      });
-    }
-  });
-}
-//# sourceMappingURL=deck-layer-view-2d.js.map

package/dist/es5/deck-layer-view-2d.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/deck-layer-view-2d.js"],"names":["createDeckLayerView2D","BaseLayerViewGL2D","createSubclass","properties","deckgl","deckFbo","model","buffer","attach","gl","context","initializeResources","call","layer","deck","on","props","deckInstance","setProps","toJSON","redraw","requestRender","detach","finalizeResources","render","renderParameters","view","state","size","width","height","viewState","latitude","center","longitude","zoom","featuresTilingScheme","scaleToLevel","scale","bearing","rotation","pitch"],"mappings":";;;;;;;;;;;AAAA;;AAEe,SAASA,qBAAT,CAA+BC,iBAA/B,EAAkD;AAC/D,SAAOA,iBAAiB,CAACC,cAAlB,CAAiC;AACtCC,IAAAA,UAAU,EAAE;AACVC,MAAAA,MAAM,EAAE,EADE;AAEVC,MAAAA,OAAO,EAAE,EAFC;AAGVC,MAAAA,KAAK,EAAE,EAHG;AAIVC,MAAAA,MAAM,EAAE;AAJE,KAD0B;AAStCC,IAAAA,MATsC,oBAS7B;AAAA;;AAGP,UAAMC,EAAE,GAAG,KAAKC,OAAhB;;AACAC,mCAAoBC,IAApB,CAAyB,IAAzB,EAA+BH,EAA/B;;AAGA,WAAKI,KAAL,CAAWC,IAAX,CAAgBC,EAAhB,CAAmB,QAAnB,EAA6B,UAAAC,KAAK;AAAA,eAAI,KAAI,CAACC,YAAL,CAAkBC,QAAlB,CAA2BF,KAA3B,CAAJ;AAAA,OAAlC;AAGA,WAAKC,YAAL,CAAkBC,QAAlB,CAA2B,KAAKL,KAAL,CAAWC,IAAX,CAAgBK,MAAhB,EAA3B;AACD,KApBqC;AAsBtCC,IAAAA,MAtBsC,oBAsB7B;AACP,WAAKC,aAAL;AACD,KAxBqC;AA2BtCC,IAAAA,MA3BsC,oBA2B7B;AACPC,iCAAkBX,IAAlB,CAAuB,IAAvB;AACD,KA7BqC;AAgCtCY,IAAAA,MAhCsC,kBAgC/BC,gBAhC+B,EAgCb;AACvB,+DAAwB,KAAKC,IAAL,CAAUC,KAAV,CAAgBC,IAAxC;AAAA,UAAOC,KAAP;AAAA,UAAcC,MAAd;;AAEA,UAAMH,KAAK,GAAGF,gBAAgB,CAACE,KAA/B;;AAEAH,sBAAOZ,IAAP,CAAY,IAAZ,EAAkB;AAChBH,QAAAA,EAAE,EAAEgB,gBAAgB,CAACf,OADL;AAEhBmB,QAAAA,KAAK,EAALA,KAFgB;AAGhBC,QAAAA,MAAM,EAANA,MAHgB;AAIhBC,QAAAA,SAAS,EAAE;AACTC,UAAAA,QAAQ,EAAE,KAAKN,IAAL,CAAUO,MAAV,CAAiBD,QADlB;AAETE,UAAAA,SAAS,EAAE,KAAKR,IAAL,CAAUO,MAAV,CAAiBC,SAFnB;AAGTC,UAAAA,IAAI,EAAE,KAAKT,IAAL,CAAUU,oBAAV,CAA+BC,YAA/B,CAA4CV,KAAK,CAACW,KAAlD,CAHG;AAITC,UAAAA,OAAO,EAAE,CAACZ,KAAK,CAACa,QAJP;AAKTC,UAAAA,KAAK,EAAE;AALE;AAJK,OAAlB;AAYD;AAjDqC,GAAjC,CAAP;AAmDD","sourcesContent":["import {initializeResources, render, finalizeResources} from './commons';\n\nexport default function createDeckLayerView2D(BaseLayerViewGL2D) {\n  return BaseLayerViewGL2D.createSubclass({\n    properties: {\n      deckgl: {},\n      deckFbo: {},\n      model: {},\n      buffer: {}\n    },\n\n    // Attach is called as soon as the layer view is ready to start rendering.\n    attach() {\n      // We use a full-screen quad and shaders to composite the frame rendered\n      // with deck.gl on top of the MapView. Composition uses the MapView context.\n      const gl = this.context;\n      initializeResources.call(this, gl);\n\n      // Update deck props\n      this.layer.deck.on('change', props => this.deckInstance.setProps(props));\n\n      // We need to start drawing the deck.gl layer immediately.\n      this.deckInstance.setProps(this.layer.deck.toJSON());\n    },\n\n    redraw() {\n      this.requestRender();\n    },\n\n    // Called when the layer must be destroyed.\n    detach() {\n      finalizeResources.call(this);\n    },\n\n    // Called every time that the layer view must be rendered.\n    render(renderParameters) {\n      const [width, height] = this.view.state.size;\n      // The view state must be kept in-sync with the MapView of the ArcGIS API.\n      const state = renderParameters.state;\n\n      render.call(this, {\n        gl: renderParameters.context,\n        width,\n        height,\n        viewState: {\n          latitude: this.view.center.latitude,\n          longitude: this.view.center.longitude,\n          zoom: this.view.featuresTilingScheme.scaleToLevel(state.scale),\n          bearing: -state.rotation,\n          pitch: 0\n        }\n      });\n    }\n  });\n}\n"],"file":"deck-layer-view-2d.js"}

package/dist/es5/deck-layer.js

@@ -1,31 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = createDeckLayer;
-
-function createDeckLayer(DeckProps, Layer, DeckLayerView2D) {
-  return Layer.createSubclass({
-    properties: {
-      deck: {},
-      blendMode: {},
-      effect: {}
-    },
-    constructor: function constructor() {
-      this.deck = new DeckProps();
-    },
-    createLayerView: function createLayerView(view) {
-      if (view.type === '2d') {
-        return new DeckLayerView2D({
-          view: view,
-          layer: this
-        });
-      }
-
-      console.error('DeckLayer does not support SceneView at the moment. Use DeckRenderer instead.');
-      return null;
-    }
-  });
-}
-//# sourceMappingURL=deck-layer.js.map