@deck.gl/google-maps - npm Package Compare versions

Comparing version 8.2.8 to 8.3.0-alpha.1

dist.min.js

@@ -1,1 +0,1 @@
-!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("deck")):"function"==typeof define&&define.amd?define(["deck"],t):"object"==typeof exports?exports.deck=t(require("deck")):e.deck=t(e.deck)}(window,(function(e){return function(e){var t={};function n(o){if(t[o])return t[o].exports;var i=t[o]={i:o,l:!1,exports:{}};return e[o].call(i.exports,i,i.exports,n),i.l=!0,i.exports}return n.m=e,n.c=t,n.d=function(e,t,o){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:o})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var o=Object.create(null);if(n.r(o),Object.defineProperty(o,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var i in e)n.d(o,i,function(t){return e[t]}.bind(null,i));return o},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s=3)}([function(e,t){e.exports=function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}},function(e,t){function n(e,t){for(var n=0;n<t.length;n++){var o=t[n];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(e,o.key,o)}}e.exports=function(e,t,o){return t&&n(e.prototype,t),o&&n(e,o),e}},function(t,n){t.exports=e},function(e,t,n){var o=n(4),i=("undefined"==typeof window?global:window).deck||{};if(!i.Layer)throw new Error("@deck.gl/core is not found");e.exports=Object.assign(i,o)},function(e,t,n){"use strict";n.r(t);var o=n(0),i=n.n(o),r=n(1),a=n.n(r),s=n(2);function l(e,t,n){if(n){if(n.props.userData._googleMap===e)return n;u(n)}var o={click:null,dblclick:null,mousemove:null,mouseout:null};n=new s.Deck({canvas:c(t),initialViewState:{longitude:0,latitude:0,zoom:1},controller:!1,userData:{_googleMap:e,_eventListeners:o}});var i=function(t){o[t]=e.addListener(t,(function(e){return function(e,t,n){var o={type:t,offsetCenter:p(n,e),srcEvent:n};switch(t){case"click":e._lastPointerDownInfo=e.pickObject(o.offsetCenter),o.tapCount=1,e._onEvent(o);break;case"dblclick":o.type="click",o.tapCount=2,e._onEvent(o);break;case"mousemove":o.type="pointermove",e._onPointerMove(o);break;case"mouseout":o.type="pointerleave",e._onPointerMove(o);break;default:return}}(n,t,e)}))};for(var r in o)i(r);return n}function c(e){var t=e.getPanes().overlayLayer,n=document.createElement("canvas");return Object.assign(n.style,{position:"absolute"}),t.appendChild(n),n}function u(e){var t=e.props.userData._eventListeners;for(var n in t)t[n].remove();e.finalize(),e.canvas.parentNode.removeChild(e.canvas)}function p(e,t){if(e.pixel)return e.pixel;var n=t.getViewports()[0].project([e.latLng.lng(),e.latLng.lat()]);return{x:n[0],y:n[1]}}var f=function(){return!1},d=function(){function e(t){i()(this,e),this.props={},this._map=null;var n=new google.maps.OverlayView;n.onAdd=this._onAdd.bind(this),n.onRemove=this._onRemove.bind(this),n.draw=this._draw.bind(this),this._overlay=n,this.setProps(t)}return a()(e,[{key:"setMap",value:function(e){e!==this._map&&(this._map&&(this._overlay.setMap(null),this._map=null),e&&(this._map=e,this._overlay.setMap(e)))}},{key:"setProps",value:function(e){Object.assign(this.props,e),this._deck&&this._deck.setProps(this.props)}},{key:"pickObject",value:function(e){return this._deck&&this._deck.pickObject(e)}},{key:"pickMultipleObjects",value:function(e){return this._deck&&this._deck.pickMultipleObjects(e)}},{key:"pickObjects",value:function(e){return this._deck&&this._deck.pickObjects(e)}},{key:"finalize",value:function(){this.setMap(null),this._deck&&(u(this._deck),this._deck=null)}},{key:"_onAdd",value:function(){this._deck=l(this._map,this._overlay,this._deck),this._deck.setProps(this.props)}},{key:"_onRemove",value:function(){this._deck.setProps({layerFilter:f})}},{key:"_draw",value:function(){var e=this._deck,t=function(e,t){var n=e.getDiv().firstChild,o=n.offsetWidth,i=n.offsetHeight,r=t.getProjection(),a=e.getBounds(),s=a.getNorthEast(),l=a.getSouthWest(),c=r.fromLatLngToDivPixel(s),u=r.fromLatLngToDivPixel(l),p=new google.maps.Point(0,0),f=r.fromContainerPixelToLatLng(p),d=r.fromLatLngToDivPixel(f),v=d.x,h=d.y,g=r.getWorldWidth(),y=Math.ceil(o/g);v-=Math.floor(y/2)*g;var k=i?(u.y-c.y)/i:1,_=Math.log2(k||1)+e.getZoom()-1,m=new google.maps.Point(o/2,i/2),b=r.fromContainerPixelToLatLng(m),w=b.lat(),x=b.lng();if(Math.abs(w)>85.05113){w=w>0?85.05113:-85.05113;var P=new google.maps.LatLng(w,x);h+=(m=r.fromLatLngToContainerPixel(P)).y-i/2}return{width:o,height:i,left:v,top:h,zoom:_,pitch:e.getTilt(),latitude:w,longitude:x}}(this._map,this._overlay),n=t.width,o=t.height,i=t.left,r=t.top,a=t.zoom,s=t.pitch,l=t.latitude,c=t.longitude,u=0===s;e.canvas.style.left="".concat(i,"px"),e.canvas.style.top="".concat(r,"px"),e.setProps({width:n,height:o,viewState:{latitude:l,longitude:c,zoom:a,repeat:!0},layerFilter:u?this.props.layerFilter:f}),e.redraw()}}]),e}();n.d(t,"GoogleMapsOverlay",(function(){return d}))}])}));
+!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("deck")):"function"==typeof define&&define.amd?define(["deck"],t):"object"==typeof exports?exports.deck=t(require("deck")):e.deck=t(e.deck)}(window,(function(e){return function(e){var t={};function n(o){if(t[o])return t[o].exports;var r=t[o]={i:o,l:!1,exports:{}};return e[o].call(r.exports,r,r.exports,n),r.l=!0,r.exports}return n.m=e,n.c=t,n.d=function(e,t,o){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:o})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var o=Object.create(null);if(n.r(o),Object.defineProperty(o,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var r in e)n.d(o,r,function(t){return e[t]}.bind(null,r));return o},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s=4)}([function(e,t){e.exports=function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}},function(e,t){function n(e,t){for(var n=0;n<t.length;n++){var o=t[n];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(e,o.key,o)}}e.exports=function(e,t,o){return t&&n(e.prototype,t),o&&n(e,o),e}},function(e,t){e.exports=function(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}},function(t,n){t.exports=e},function(e,t,n){var o=n(5),r=("undefined"==typeof window?global:window).deck||{};if(!r.Layer)throw new Error("@deck.gl/core is not found");e.exports=Object.assign(r,o)},function(e,t,n){"use strict";n.r(t);var o=n(0),r=n.n(o),i=n(1),a=n.n(i),c=n(2),u=n.n(c),l=n(3);function s(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);t&&(o=o.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,o)}return n}function f(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?s(Object(n),!0).forEach((function(t){u()(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):s(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}function p(e,t,n,o){if(n){if(n.props.userData._googleMap===e)return n;h(n)}var r={click:null,dblclick:null,mousemove:null,mouseout:null};n=new l.Deck(f(f({},o),{},{parent:d(t),initialViewState:{longitude:0,latitude:0,zoom:1},controller:!1,userData:{_googleMap:e,_eventListeners:r}}));var i=function(t){r[t]=e.addListener(t,(function(e){return function(e,t,n){var o={type:t,offsetCenter:v(n,e),srcEvent:n};switch(t){case"click":e._lastPointerDownInfo=e.pickObject(o.offsetCenter),o.tapCount=1,e._onEvent(o);break;case"dblclick":o.type="click",o.tapCount=2,e._onEvent(o);break;case"mousemove":o.type="pointermove",e._onPointerMove(o);break;case"mouseout":o.type="pointerleave",e._onPointerMove(o);break;default:return}}(n,t,e)}))};for(var a in r)i(a);return n}function d(e){return e.getPanes().overlayLayer}function h(e){var t=e.props.userData._eventListeners;for(var n in t)t[n].remove();e.finalize()}function v(e,t){if(e.pixel)return e.pixel;var n=t.getViewports()[0].project([e.latLng.lng(),e.latLng.lat()]);return{x:n[0],y:n[1]}}var y=function(){return!1},g=function(){function e(t){r()(this,e),this.props={},this._map=null;var n=new google.maps.OverlayView;n.onAdd=this._onAdd.bind(this),n.onRemove=this._onRemove.bind(this),n.draw=this._draw.bind(this),this._overlay=n,this.setProps(t)}return a()(e,[{key:"setMap",value:function(e){e!==this._map&&(this._map&&(this._overlay.setMap(null),this._map=null),e&&(this._map=e,this._overlay.setMap(e)))}},{key:"setProps",value:function(e){Object.assign(this.props,e),this._deck&&this._deck.setProps(this.props)}},{key:"pickObject",value:function(e){return this._deck&&this._deck.pickObject(e)}},{key:"pickMultipleObjects",value:function(e){return this._deck&&this._deck.pickMultipleObjects(e)}},{key:"pickObjects",value:function(e){return this._deck&&this._deck.pickObjects(e)}},{key:"finalize",value:function(){this.setMap(null),this._deck&&(h(this._deck),this._deck=null)}},{key:"_onAdd",value:function(){this._deck=p(this._map,this._overlay,this._deck,this.props)}},{key:"_onRemove",value:function(){this._deck.setProps({layerFilter:y})}},{key:"_draw",value:function(){var e=this._deck,t=function(e,t){var n=e.getDiv().firstChild,o=n.offsetWidth,r=n.offsetHeight,i=t.getProjection(),a=e.getBounds(),c=a.getNorthEast(),u=a.getSouthWest(),l=i.fromLatLngToDivPixel(c),s=i.fromLatLngToDivPixel(u),f=new google.maps.Point(0,0),p=i.fromContainerPixelToLatLng(f),d=i.fromLatLngToDivPixel(p),h=d.x,v=d.y,y=i.getWorldWidth(),g=Math.ceil(o/y);h-=Math.floor(g/2)*y;var b=r?(s.y-l.y)/r:1,k=Math.log2(b||1)+e.getZoom()-1,m=new google.maps.Point(o/2,r/2),_=i.fromContainerPixelToLatLng(m),w=_.lat(),O=_.lng();if(Math.abs(w)>85.05113){w=w>0?85.05113:-85.05113;var j=new google.maps.LatLng(w,O);v+=(m=i.fromLatLngToContainerPixel(j)).y-r/2}return{width:o,height:r,left:h,top:v,zoom:k,pitch:e.getTilt(),latitude:w,longitude:O}}(this._map,this._overlay),n=t.width,o=t.height,r=t.left,i=t.top,a=t.zoom,c=t.pitch,u=t.latitude,l=t.longitude,s=0===c;e.canvas.style.left="".concat(r,"px"),e.canvas.style.top="".concat(i,"px"),e.setProps({width:n,height:o,viewState:{latitude:u,longitude:l,zoom:a,repeat:!0},layerFilter:s?this.props.layerFilter:y}),e.redraw()}}]),e}();n.d(t,"GoogleMapsOverlay",(function(){return g}))}])}));

dist/dist.dev.js

@@ -198,4 +198,3 @@ (function webpackUniversalModuleDefinition(root, factory) {
   _onAdd() {
-    this._deck = Object(_utils__WEBPACK_IMPORTED_MODULE_0__["createDeckInstance"])(this._map, this._overlay, this._deck);
-    this._deck.setProps(this.props);
+    this._deck = Object(_utils__WEBPACK_IMPORTED_MODULE_0__["createDeckInstance"])(this._map, this._overlay, this._deck, this.props);
   }
@@ -266,3 +265,3 @@
 /* harmony import */ var _deck_gl_core__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_deck_gl_core__WEBPACK_IMPORTED_MODULE_0__);
-/* global document, google */
+/* global google */
 
@@ -279,3 +278,3 @@
  */
-function createDeckInstance(map, overlay, deck) {
+function createDeckInstance(map, overlay, deck, props) {
   if (deck) {
@@ -297,3 +296,4 @@ if (deck.props.userData._googleMap === map) {
   deck = new _deck_gl_core__WEBPACK_IMPORTED_MODULE_0__["Deck"]({
-    canvas: createDeckCanvas(overlay),
+    ...props,
+    parent: getContainer(overlay),
     initialViewState: {
@@ -321,12 +321,4 @@ longitude: 0,
 
-function createDeckCanvas(overlay) {
-  const container = overlay.getPanes().overlayLayer;
-  const deckCanvas = document.createElement('canvas');
-  Object.assign(deckCanvas.style, {
-    // map container position is always non-static
-    position: 'absolute'
-  });
-
-  container.appendChild(deckCanvas);
-  return deckCanvas;
+function getContainer(overlay) {
+  return overlay.getPanes().overlayLayer;
 }
@@ -347,5 +339,2 @@
   deck.finalize();
-
-  // Remove canvas
-  deck.canvas.parentNode.removeChild(deck.canvas);
 }
@@ -352,0 +341,0 @@

dist/es5/google-maps-overlay.js

@@ -89,5 +89,3 @@ "use strict";
     value: function _onAdd() {
-      this._deck = (0, _utils.createDeckInstance)(this._map, this._overlay, this._deck);
-
-      this._deck.setProps(this.props);
+      this._deck = (0, _utils.createDeckInstance)(this._map, this._overlay, this._deck, this.props);
     }
@@ -94,0 +92,0 @@ }, {

dist/es5/utils.js

 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
 Object.defineProperty(exports, "__esModule", {
@@ -10,7 +12,13 @@ value: true
 
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
 var _core = require("@deck.gl/core");
 
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
 var MAX_LATITUDE = 85.05113;
 
-function createDeckInstance(map, overlay, deck) {
+function createDeckInstance(map, overlay, deck, props) {
   if (deck) {
@@ -30,4 +38,4 @@ if (deck.props.userData._googleMap === map) {
   };
-  deck = new _core.Deck({
-    canvas: createDeckCanvas(overlay),
+  deck = new _core.Deck(_objectSpread(_objectSpread({}, props), {}, {
+    parent: getContainer(overlay),
     initialViewState: {
@@ -43,3 +51,3 @@ longitude: 0,
     }
-  });
+  }));
 
@@ -59,10 +67,4 @@ var _loop = function _loop(eventType) {
 
-function createDeckCanvas(overlay) {
-  var container = overlay.getPanes().overlayLayer;
-  var deckCanvas = document.createElement('canvas');
-  Object.assign(deckCanvas.style, {
-    position: 'absolute'
-  });
-  container.appendChild(deckCanvas);
-  return deckCanvas;
+function getContainer(overlay) {
+  return overlay.getPanes().overlayLayer;
 }
@@ -78,3 +80,2 @@
   deck.finalize();
-  deck.canvas.parentNode.removeChild(deck.canvas);
 }
@@ -81,0 +82,0 @@

dist/es6/google-maps-overlay.js

@@ -65,5 +65,3 @@ import { createDeckInstance, destroyDeckInstance, getViewState } from './utils';
   _onAdd() {
-    this._deck = createDeckInstance(this._map, this._overlay, this._deck);
-
-    this._deck.setProps(this.props);
+    this._deck = createDeckInstance(this._map, this._overlay, this._deck, this.props);
   }
@@ -70,0 +68,0 @@

dist/es6/utils.js

@@ -0,4 +1,10 @@
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
 import { Deck } from '@deck.gl/core';
 const MAX_LATITUDE = 85.05113;
-export function createDeckInstance(map, overlay, deck) {
+export function createDeckInstance(map, overlay, deck, props) {
   if (deck) {
@@ -18,4 +24,4 @@ if (deck.props.userData._googleMap === map) {
   };
-  deck = new Deck({
-    canvas: createDeckCanvas(overlay),
+  deck = new Deck(_objectSpread(_objectSpread({}, props), {}, {
+    parent: getContainer(overlay),
     initialViewState: {
@@ -31,3 +37,3 @@ longitude: 0,
     }
-  });
+  }));
 
@@ -41,10 +47,4 @@ for (const eventType in eventListeners) {
 
-function createDeckCanvas(overlay) {
-  const container = overlay.getPanes().overlayLayer;
-  const deckCanvas = document.createElement('canvas');
-  Object.assign(deckCanvas.style, {
-    position: 'absolute'
-  });
-  container.appendChild(deckCanvas);
-  return deckCanvas;
+function getContainer(overlay) {
+  return overlay.getPanes().overlayLayer;
 }
@@ -62,3 +62,2 @@
   deck.finalize();
-  deck.canvas.parentNode.removeChild(deck.canvas);
 }
@@ -65,0 +64,0 @@ export function getViewState(map, overlay) {

dist/esm/google-maps-overlay.js

@@ -79,5 +79,3 @@ import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
     value: function _onAdd() {
-      this._deck = createDeckInstance(this._map, this._overlay, this._deck);
-
-      this._deck.setProps(this.props);
+      this._deck = createDeckInstance(this._map, this._overlay, this._deck, this.props);
     }
@@ -84,0 +82,0 @@ }, {

dist/esm/utils.js

@@ -0,4 +1,10 @@
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
 import { Deck } from '@deck.gl/core';
 var MAX_LATITUDE = 85.05113;
-export function createDeckInstance(map, overlay, deck) {
+export function createDeckInstance(map, overlay, deck, props) {
   if (deck) {
@@ -18,4 +24,4 @@ if (deck.props.userData._googleMap === map) {
   };
-  deck = new Deck({
-    canvas: createDeckCanvas(overlay),
+  deck = new Deck(_objectSpread(_objectSpread({}, props), {}, {
+    parent: getContainer(overlay),
     initialViewState: {
@@ -31,3 +37,3 @@ longitude: 0,
     }
-  });
+  }));
 
@@ -47,10 +53,4 @@ var _loop = function _loop(eventType) {
 
-function createDeckCanvas(overlay) {
-  var container = overlay.getPanes().overlayLayer;
-  var deckCanvas = document.createElement('canvas');
-  Object.assign(deckCanvas.style, {
-    position: 'absolute'
-  });
-  container.appendChild(deckCanvas);
-  return deckCanvas;
+function getContainer(overlay) {
+  return overlay.getPanes().overlayLayer;
 }
@@ -66,3 +66,2 @@
   deck.finalize();
-  deck.canvas.parentNode.removeChild(deck.canvas);
 }
@@ -69,0 +68,0 @@ export function getViewState(map, overlay) {

package.json

@@ -5,3 +5,3 @@ {
   "license": "MIT",
-  "version": "8.2.8",
+  "version": "8.3.0-alpha.1",
   "publishConfig": {
@@ -36,3 +36,3 @@ "access": "public"
   },
-  "gitHead": "e51ecdb7a5a71153fda924495b56a32dce1ab9d5"
+  "gitHead": "1a927bbe67b9746568c43e88b087467c94d6865c"
 }

src/google-maps-overlay.js

@@ -66,4 +66,3 @@ /* global google */
   _onAdd() {
-    this._deck = createDeckInstance(this._map, this._overlay, this._deck);
-    this._deck.setProps(this.props);
+    this._deck = createDeckInstance(this._map, this._overlay, this._deck, this.props);
   }
@@ -70,0 +69,0 @@

src/utils.js

@@ -1,2 +0,2 @@
-/* global document, google */
+/* global google */
 import {Deck} from '@deck.gl/core';
@@ -13,3 +13,3 @@
  */
-export function createDeckInstance(map, overlay, deck) {
+export function createDeckInstance(map, overlay, deck, props) {
   if (deck) {
@@ -31,3 +31,4 @@ if (deck.props.userData._googleMap === map) {
   deck = new Deck({
-    canvas: createDeckCanvas(overlay),
+    ...props,
+    parent: getContainer(overlay),
     initialViewState: {
@@ -55,12 +56,4 @@ longitude: 0,
 
-function createDeckCanvas(overlay) {
-  const container = overlay.getPanes().overlayLayer;
-  const deckCanvas = document.createElement('canvas');
-  Object.assign(deckCanvas.style, {
-    // map container position is always non-static
-    position: 'absolute'
-  });
-
-  container.appendChild(deckCanvas);
-  return deckCanvas;
+function getContainer(overlay) {
+  return overlay.getPanes().overlayLayer;
 }
@@ -81,5 +74,2 @@
   deck.finalize();
-
-  // Remove canvas
-  deck.canvas.parentNode.removeChild(deck.canvas);
 }
@@ -86,0 +76,0 @@

New alerts

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Worsened metrics

Total package byte prevSize

105610

decreased by-0.09%

Lines of code

1374

decreased by-1.86%

Number of low quality alerts

3

increased by50%

No dependency changes