@antv/l7-map 2.9.20 → 2.9.22

package/es/camera.js

@@ -5,25 +5,28 @@ import _inherits from "@babel/runtime/helpers/inherits";
 import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
 import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import _merge from "lodash/merge";
 
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
 
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
 
+// @ts-ignore
 import { EventEmitter } from 'eventemitter3';
-import LngLat from './geo/lng_lat';
-import LngLatBounds from './geo/lng_lat_bounds';
-import Point from './geo/point';
-import Transform from './geo/transform';
-import { Event } from './handler/events/event';
-import { clamp, ease as defaultEasing, interpolate, now, pick, prefersReducedMotion, wrap } from './util';
-
-var Camera = function (_EventEmitter) {
+import { merge } from 'lodash';
+import LngLat from "./geo/lng_lat";
+import LngLatBounds from "./geo/lng_lat_bounds";
+import Point from "./geo/point";
+import Transform from "./geo/transform";
+import { Event } from "./handler/events/event";
+import { clamp, ease as defaultEasing, interpolate, now, pick, prefersReducedMotion, wrap } from "./util";
+
+var Camera = /*#__PURE__*/function (_EventEmitter) {
   _inherits(Camera, _EventEmitter);
 
   var _super = _createSuper(Camera);
 
+  // public requestRenderFrame: (_: any) => number;
+  // public cancelRenderFrame: (_: number) => void;
   function Camera(options) {
     var _this;
 
@@ -31,46 +34,13 @@ var Camera = function (_EventEmitter) {
 
     _this = _super.call(this);
 
-    _defineProperty(_assertThisInitialized(_this), "transform", void 0);
-
-    _defineProperty(_assertThisInitialized(_this), "options", void 0);
-
-    _defineProperty(_assertThisInitialized(_this), "moving", void 0);
-
-    _defineProperty(_assertThisInitialized(_this), "zooming", void 0);
-
-    _defineProperty(_assertThisInitialized(_this), "rotating", void 0);
-
-    _defineProperty(_assertThisInitialized(_this), "pitching", void 0);
-
-    _defineProperty(_assertThisInitialized(_this), "padding", void 0);
-
-    _defineProperty(_assertThisInitialized(_this), "bearingSnap", void 0);
-
-    _defineProperty(_assertThisInitialized(_this), "easeEndTimeoutID", void 0);
-
-    _defineProperty(_assertThisInitialized(_this), "easeStart", void 0);
-
-    _defineProperty(_assertThisInitialized(_this), "easeOptions", void 0);
-
-    _defineProperty(_assertThisInitialized(_this), "easeId", void 0);
-
-    _defineProperty(_assertThisInitialized(_this), "onEaseFrame", void 0);
-
-    _defineProperty(_assertThisInitialized(_this), "onEaseEnd", void 0);
-
-    _defineProperty(_assertThisInitialized(_this), "easeFrameId", void 0);
-
-    _defineProperty(_assertThisInitialized(_this), "pitchEnabled", void 0);
-
-    _defineProperty(_assertThisInitialized(_this), "rotateEnabled", void 0);
-
     _defineProperty(_assertThisInitialized(_this), "renderFrameCallback", function () {
       var t = Math.min((now() - _this.easeStart) / _this.easeOptions.duration, 1);
 
       _this.onEaseFrame(_this.easeOptions.easing(t));
 
       if (t < 1) {
+        // this.easeFrameId = window.requestAnimationFrame(this.renderFrameCallback);
         _this.easeFrameId = _this.requestRenderFrame(_this.renderFrameCallback);
       } else {
         _this.stop();
@@ -143,7 +113,7 @@ var Camera = function (_EventEmitter) {
   }, {
     key: "panTo",
     value: function panTo(lnglat, options, eventData) {
-      return this.easeTo(_merge({
+      return this.easeTo(merge({
         center: lnglat
       }, options), eventData);
     }
@@ -178,7 +148,7 @@ var Camera = function (_EventEmitter) {
   }, {
     key: "zoomTo",
     value: function zoomTo(zoom, options, eventData) {
-      return this.easeTo(_merge({
+      return this.easeTo(merge({
         zoom: zoom
       }, options), eventData);
     }
@@ -198,14 +168,14 @@ var Camera = function (_EventEmitter) {
   }, {
     key: "rotateTo",
     value: function rotateTo(bearing, options, eventData) {
-      return this.easeTo(_merge({
+      return this.easeTo(merge({
         bearing: bearing
       }, options), eventData);
     }
   }, {
     key: "resetNorth",
     value: function resetNorth(options, eventData) {
-      this.rotateTo(0, _merge({
+      this.rotateTo(0, merge({
         duration: 1000
       }, options), eventData);
       return this;
@@ -213,7 +183,7 @@ var Camera = function (_EventEmitter) {
   }, {
     key: "resetNorthPitch",
     value: function resetNorthPitch(options, eventData) {
-      this.easeTo(_merge({
+      this.easeTo(merge({
         bearing: 0,
         pitch: 0,
         duration: 1000
@@ -223,13 +193,15 @@ var Camera = function (_EventEmitter) {
   }, {
     key: "fitBounds",
     value: function fitBounds(bounds, options, eventData) {
-      return this.fitInternal(this.cameraForBounds(bounds, options), options, eventData);
+      return this.fitInternal( // @ts-ignore
+      this.cameraForBounds(bounds, options), options, eventData);
     }
   }, {
     key: "cameraForBounds",
     value: function cameraForBounds(bounds, options) {
       bounds = LngLatBounds.convert(bounds);
-      return this.cameraForBoxAndBearing(bounds.getNorthWest(), bounds.getSouthEast(), 0, options);
+      return this.cameraForBoxAndBearing(bounds.getNorthWest(), bounds.getSouthEast(), 0, // @ts-ignore
+      options);
     }
   }, {
     key: "snapToNorth",
@@ -304,7 +276,7 @@ var Camera = function (_EventEmitter) {
 
       var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
       var eventData = arguments.length > 1 ? arguments[1] : undefined;
-      options = _merge({
+      options = merge({
         offset: [0, 0],
         duration: 500,
         easing: defaultEasing
@@ -366,7 +338,9 @@ var Camera = function (_EventEmitter) {
         }
 
         if (_this2.padding) {
-          tr.interpolatePadding(startPadding, padding, k);
+          tr.interpolatePadding(startPadding, padding, k); // When padding is being applied, Transform#centerPoint is changing continously,
+          // thus we need to recalculate offsetPoint every fra,e
+
           pointAtOffset = tr.centerPoint.add(offsetAsPoint);
         }
 
@@ -383,7 +357,8 @@ var Camera = function (_EventEmitter) {
         _this2.fireMoveEvents(eventData);
       }, function (interruptingEaseId) {
         _this2.afterEase(eventData, interruptingEaseId);
-      }, options);
+      }, // @ts-ignore
+      options);
       return this;
     }
   }, {
@@ -394,13 +369,14 @@ var Camera = function (_EventEmitter) {
       var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
       var eventData = arguments.length > 1 ? arguments[1] : undefined;
 
+      // Fall through to jumpTo if user has set prefers-reduced-motion
       if (!options.essential && prefersReducedMotion()) {
         var coercedOptions = pick(options, ['center', 'zoom', 'bearing', 'pitch', 'around']);
         return this.jumpTo(coercedOptions, eventData);
       }
 
       this.stop();
-      options = _merge({
+      options = merge({
         offset: [0, 0],
         speed: 1.2,
         curve: 1.42,
@@ -423,18 +399,31 @@ var Camera = function (_EventEmitter) {
       this.normalizeCenter(center);
       var from = tr.project(locationAtOffset);
       var delta = tr.project(center).sub(from);
-      var rho = options.curve;
-      var w0 = Math.max(tr.width, tr.height);
-      var w1 = w0 / scale;
+      var rho = options.curve; // w₀: Initial visible span, measured in pixels at the initial scale.
+
+      var w0 = Math.max(tr.width, tr.height); // w₁: Final visible span, measured in pixels with respect to the initial scale.
+
+      var w1 = w0 / scale; // Length of the flight path as projected onto the ground plane, measured in pixels from
+      // the world image origin at the initial scale.
+
       var u1 = delta.mag();
 
       if ('minZoom' in options) {
-        var minZoom = clamp(Math.min(options.minZoom, startZoom, zoom), tr.minZoom, tr.maxZoom);
+        var minZoom = clamp(Math.min(options.minZoom, startZoom, zoom), tr.minZoom, tr.maxZoom); // w<sub>m</sub>: Maximum visible span, measured in pixels with respect to the initial
+        // scale.
+
         var wMax = w0 / tr.zoomScale(minZoom - startZoom);
         rho = Math.sqrt(wMax / u1 * 2);
-      }
+      } // ρ²
+
 
       var rho2 = rho * rho;
+      /**
+       * rᵢ: Returns the zoom-out factor at one end of the animation.
+       *
+       * @param i 0 for the ascent or 1 for the descent.
+       * @private
+       */
 
       function r(i) {
         var b = (w1 * w1 - w0 * w0 + (i ? -1 : 1) * rho2 * rho2 * u1 * u1) / (2 * (i ? w1 : w0) * rho2 * u1);
@@ -451,21 +440,27 @@ var Camera = function (_EventEmitter) {
 
       function tanh(n) {
         return sinh(n) / cosh(n);
-      }
+      } // r₀: Zoom-out factor during ascent.
+
 
-      var r0 = r(0);
+      var r0 = r(0); // w(s): Returns the visible span on the ground, measured in pixels with respect to the
+      // initial scale. Assumes an angular field of view of 2 arctan ½ ≈ 53°.
 
       var w = function w(s) {
         return cosh(r0) / cosh(r0 + rho * s);
-      };
+      }; // u(s): Returns the distance along the flight path as projected onto the ground plane,
+      // measured in pixels from the world image origin at the initial scale.
+
 
       var u = function u(s) {
         return w0 * ((cosh(r0) * tanh(r0 + rho * s) - sinh(r0)) / rho2) / u1;
-      };
+      }; // S: Total length of the flight path, measured in ρ-screenfuls.
 
-      var S = (r(1) - r0) / rho;
+
+      var S = (r(1) - r0) / rho; // When u₀ = u₁, the optimal path doesn’t require both ascent and descent.
 
       if (Math.abs(u1) < 0.000001 || !isFinite(S)) {
+        // Perform a more or less instantaneous transition if the path is too short.
         if (Math.abs(w0 - w1) < 0.000001) {
           return this.easeTo(options, eventData);
         }
@@ -499,7 +494,9 @@ var Camera = function (_EventEmitter) {
       this.padding = !tr.isPaddingEqual(padding);
       this.prepareEase(eventData, false);
       this.ease(function (k) {
-        var s = k * S;
+        // s: The distance traveled along the flight path, measured in ρ-screenfuls.
+        var s = k * S; // @ts-ignore
+
         var easeScale = 1 / w(s);
         tr.zoom = k === 1 ? zoom : startZoom + tr.scaleZoom(easeScale);
 
@@ -512,7 +509,9 @@ var Camera = function (_EventEmitter) {
         }
 
         if (_this3.padding) {
-          tr.interpolatePadding(startPadding, padding, k);
+          tr.interpolatePadding(startPadding, padding, k); // When padding is being applied, Transform#centerPoint is changing continously,
+          // thus we need to recalculate offsetPoint every frame
+
           pointAtOffset = tr.centerPoint.add(offsetAsPoint);
         }
 
@@ -528,22 +527,34 @@ var Camera = function (_EventEmitter) {
   }, {
     key: "fitScreenCoordinates",
     value: function fitScreenCoordinates(p0, p1, bearing, options, eventData) {
-      return this.fitInternal(this.cameraForBoxAndBearing(this.transform.pointLocation(Point.convert(p0)), this.transform.pointLocation(Point.convert(p1)), bearing, options), options, eventData);
+      return this.fitInternal( // @ts-ignore
+      this.cameraForBoxAndBearing(this.transform.pointLocation(Point.convert(p0)), this.transform.pointLocation(Point.convert(p1)), bearing, // @ts-ignore
+      options), options, eventData);
     }
   }, {
     key: "stop",
     value: function stop(allowGestures, easeId) {
       if (this.easeFrameId) {
-        this.cancelRenderFrame(this.easeFrameId);
-        delete this.easeFrameId;
+        this.cancelRenderFrame(this.easeFrameId); // @ts-ignore
+
+        delete this.easeFrameId; // @ts-ignore
+
         delete this.onEaseFrame;
       }
 
       if (this.onEaseEnd) {
-        var onEaseEnd = this.onEaseEnd;
+        // The _onEaseEnd function might emit events which trigger new
+        // animation, which sets a new _onEaseEnd. Ensure we don't delete
+        // it unintentionally.
+        var onEaseEnd = this.onEaseEnd; // @ts-ignore
+
         delete this.onEaseEnd;
         onEaseEnd.call(this, easeId);
-      }
+      } // if (!allowGestures) {
+      //     const handlers = (this: any).handlers;
+      //     if (handlers) handlers.stop();
+      // }
+
 
       return this;
     }
@@ -618,9 +629,12 @@ var Camera = function (_EventEmitter) {
   }, {
     key: "afterEase",
     value: function afterEase(eventData, easeId) {
+      // if this easing is being stopped to start another easing with
+      // the same id then don't fire any events to avoid extra start/stop events
       if (this.easeId && easeId && this.easeId === easeId) {
         return;
-      }
+      } // @ts-ignore
+
 
       delete this.easeId;
       var wasZooming = this.zooming;
@@ -669,7 +683,7 @@ var Camera = function (_EventEmitter) {
         right: 0,
         left: 0
       };
-      options = _merge({
+      options = merge({
         padding: defaultPadding,
         offset: [0, 0],
         maxZoom: this.transform.maxZoom
@@ -685,26 +699,40 @@ var Camera = function (_EventEmitter) {
         };
       }
 
-      options.padding = _merge(defaultPadding, options.padding);
+      options.padding = merge(defaultPadding, options.padding);
       var tr = this.transform;
-      var edgePadding = tr.padding;
+      var edgePadding = tr.padding; // We want to calculate the upper right and lower left of the box defined by p0 and p1
+      // in a coordinate system rotate to match the destination bearing.
+
       var p0world = tr.project(LngLat.convert(p0));
       var p1world = tr.project(LngLat.convert(p1));
       var p0rotated = p0world.rotate(-bearing * Math.PI / 180);
       var p1rotated = p1world.rotate(-bearing * Math.PI / 180);
       var upperRight = new Point(Math.max(p0rotated.x, p1rotated.x), Math.max(p0rotated.y, p1rotated.y));
-      var lowerLeft = new Point(Math.min(p0rotated.x, p1rotated.x), Math.min(p0rotated.y, p1rotated.y));
+      var lowerLeft = new Point(Math.min(p0rotated.x, p1rotated.x), Math.min(p0rotated.y, p1rotated.y)); // Calculate zoom: consider the original bbox and padding.
+
       var size = upperRight.sub(lowerLeft);
-      var scaleX = (tr.width - (edgePadding.left + edgePadding.right + options.padding.left + options.padding.right)) / size.x;
-      var scaleY = (tr.height - (edgePadding.top + edgePadding.bottom + options.padding.top + options.padding.bottom)) / size.y;
+      var scaleX = (tr.width - ( // @ts-ignore
+      edgePadding.left + // @ts-ignore
+      edgePadding.right + // @ts-ignore
+      options.padding.left + // @ts-ignore
+      options.padding.right)) / size.x;
+      var scaleY = (tr.height - ( // @ts-ignore
+      edgePadding.top + // @ts-ignore
+      edgePadding.bottom + // @ts-ignore
+      options.padding.top + // @ts-ignore
+      options.padding.bottom)) / size.y;
 
       if (scaleY < 0 || scaleX < 0) {
         return;
       }
 
-      var zoom = Math.min(tr.scaleZoom(tr.scale * Math.min(scaleX, scaleY)), options.maxZoom);
-      var offset = Point.convert(options.offset);
-      var paddingOffsetX = (options.padding.left - options.padding.right) / 2;
+      var zoom = Math.min(tr.scaleZoom(tr.scale * Math.min(scaleX, scaleY)), options.maxZoom); // Calculate center: apply the zoom, the configured offset, as well as offset that exists as a result of padding.
+
+      var offset = Point.convert(options.offset); // @ts-ignore
+
+      var paddingOffsetX = (options.padding.left - options.padding.right) / 2; // @ts-ignore
+
       var paddingOffsetY = (options.padding.top - options.padding.bottom) / 2;
       var offsetAtInitialZoom = new Point(offset.x + paddingOffsetX, offset.y + paddingOffsetY);
       var offsetAtFinalZoom = offsetAtInitialZoom.mult(tr.scale / tr.zoomScale(zoom));
@@ -718,12 +746,15 @@ var Camera = function (_EventEmitter) {
   }, {
     key: "fitInternal",
     value: function fitInternal(calculatedOptions, options, eventData) {
+      // cameraForBounds warns + returns undefined if unable to fit:
       if (!calculatedOptions) {
         return this;
       }
 
-      options = _merge(calculatedOptions, options);
-      delete options.padding;
+      options = merge(calculatedOptions, options); // Explictly remove the padding field because, calculatedOptions already accounts for padding by setting zoom and center accordingly.
+
+      delete options.padding; // @ts-ignore
+
       return options.linear ? this.easeTo(options, eventData) : this.flyTo(options, eventData);
     }
   }]);
@@ -731,5 +762,4 @@ var Camera = function (_EventEmitter) {
   return Camera;
 }(EventEmitter);
 
-export { Camera as default };
-//# sourceMappingURL=camera.js.map
+export { Camera as default };

package/es/css/l7.css

@@ -0,0 +1,98 @@
+.l7-map {
+  font: 12px/20px 'Helvetica Neue', Arial, Helvetica, sans-serif;
+  overflow: hidden;
+  position: relative;
+  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+}
+
+.l7-canvas {
+  position: absolute;
+  left: 0;
+  top: 0;
+}
+
+.l7-map:-webkit-full-screen {
+  width: 100%;
+  height: 100%;
+}
+
+.l7-canary {
+  background-color: salmon;
+}
+
+.l7-canvas-container.l7-interactive,
+.l7-ctrl-group button.l7-ctrl-compass {
+  cursor: -webkit-grab;
+  cursor: -moz-grab;
+  cursor: grab;
+  -moz-user-select: none;
+  -webkit-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+}
+
+.l7-canvas-container.l7-interactive.l7-track-pointer {
+  cursor: pointer;
+}
+
+.l7-canvas-container.l7-interactive:active,
+.l7-ctrl-group button.l7-ctrl-compass:active {
+  cursor: -webkit-grabbing;
+  cursor: -moz-grabbing;
+  cursor: grabbing;
+}
+
+.l7-canvas-container.l7-touch-zoom-rotate,
+.l7-canvas-container.l7-touch-zoom-rotate .l7-canvas {
+  touch-action: pan-x pan-y;
+}
+
+.l7-canvas-container.l7-touch-drag-pan,
+.l7-canvas-container.l7-touch-drag-pan .l7-canvas {
+  touch-action: pinch-zoom;
+}
+
+.l7-canvas-container.l7-touch-zoom-rotate.l7-touch-drag-pan,
+.l7-canvas-container.l7-touch-zoom-rotate.l7-touch-drag-pan .l7-canvas {
+  touch-action: none;
+}
+
+.l7-ctrl-top-left,
+.l7-ctrl-top-right,
+.l7-ctrl-bottom-left,
+.l7-ctrl-bottom-right { position: absolute; pointer-events: none; z-index: 2; }
+.l7-ctrl-top-left     { top: 0; left: 0; }
+.l7-ctrl-top-right    { top: 0; right: 0; }
+.l7-ctrl-bottom-left  { bottom: 0; left: 0; }
+.l7-ctrl-bottom-right { right: 0; bottom: 0; }
+
+.l7-ctrl {
+  clear: both;
+  pointer-events: auto;
+
+  /* workaround for a Safari bug https://github.com/mapbox/mapbox-gl-js/issues/8185 */
+  transform: translate(0, 0);
+}
+.l7-ctrl-top-left .l7-ctrl     { margin: 10px 0 0 10px; float: left; }
+.l7-ctrl-top-right .l7-ctrl    { margin: 10px 10px 0 0; float: right; }
+.l7-ctrl-bottom-left .l7-ctrl  { margin: 0 0 10px 10px; float: left; }
+.l7-ctrl-bottom-right .l7-ctrl { margin: 0 10px 10px 0; float: right; }
+
+
+.l7-crosshair,
+.l7-crosshair .l7-interactive,
+.l7-crosshair .l7-interactive:active {
+    cursor: crosshair;
+}
+
+.l7-boxzoom {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 0;
+    height: 0;
+    background: #fff;
+    border: 2px dotted #202020;
+    opacity: 0.5;
+    z-index: 10;
+}

package/es/earthmap.js

@@ -5,14 +5,14 @@ import _inherits from "@babel/runtime/helpers/inherits";
 import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
 import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import _merge from "lodash/merge";
 
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
 
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
 
 import { DOM } from '@antv/l7-utils';
-import Camera from './camera';
+import { merge } from 'lodash';
+import Camera from "./camera";
 
 function loadStyles(css, doc) {
   var isMiniAli = typeof my !== 'undefined' && !!my && typeof my.showToast === 'function' && my.isFRM !== true;
@@ -55,15 +55,17 @@ function loadStyles(css, doc) {
 }
 
 loadStyles(".l7-map {\n  font: 12px/20px 'Helvetica Neue', Arial, Helvetica, sans-serif;\n  overflow: hidden;\n  position: relative;\n  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\n}\n\n.l7-canvas {\n  position: absolute;\n  left: 0;\n  top: 0;\n}\n\n.l7-map:-webkit-full-screen {\n  width: 100%;\n  height: 100%;\n}\n\n.l7-canary {\n  background-color: salmon;\n}\n\n.l7-canvas-container.l7-interactive,\n.l7-ctrl-group button.l7-ctrl-compass {\n  cursor: -webkit-grab;\n  cursor: grab;\n  -moz-user-select: none;\n  -webkit-user-select: none;\n  -ms-user-select: none;\n  user-select: none;\n}\n\n.l7-canvas-container.l7-interactive.l7-track-pointer {\n  cursor: pointer;\n}\n\n.l7-canvas-container.l7-interactive:active,\n.l7-ctrl-group button.l7-ctrl-compass:active {\n  cursor: -webkit-grabbing;\n  cursor: grabbing;\n}\n\n.l7-canvas-container.l7-touch-zoom-rotate,\n.l7-canvas-container.l7-touch-zoom-rotate .l7-canvas {\n  -ms-touch-action: pan-x pan-y;\n      touch-action: pan-x pan-y;\n}\n\n.l7-canvas-container.l7-touch-drag-pan,\n.l7-canvas-container.l7-touch-drag-pan .l7-canvas {\n  -ms-touch-action: pinch-zoom;\n      touch-action: pinch-zoom;\n}\n\n.l7-canvas-container.l7-touch-zoom-rotate.l7-touch-drag-pan,\n.l7-canvas-container.l7-touch-zoom-rotate.l7-touch-drag-pan .l7-canvas {\n  -ms-touch-action: none;\n      touch-action: none;\n}\n\n.l7-ctrl-top-left,\n.l7-ctrl-top-right,\n.l7-ctrl-bottom-left,\n.l7-ctrl-bottom-right { position: absolute; pointer-events: none; z-index: 2; }\n.l7-ctrl-top-left     { top: 0; left: 0; }\n.l7-ctrl-top-right    { top: 0; right: 0; }\n.l7-ctrl-bottom-left  { bottom: 0; left: 0; }\n.l7-ctrl-bottom-right { right: 0; bottom: 0; }\n\n.l7-ctrl {\n  clear: both;\n  pointer-events: auto;\n\n  /* workaround for a Safari bug https://github.com/mapbox/mapbox-gl-js/issues/8185 */\n  -webkit-transform: translate(0, 0);\n          transform: translate(0, 0);\n}\n.l7-ctrl-top-left .l7-ctrl     { margin: 10px 0 0 10px; float: left; }\n.l7-ctrl-top-right .l7-ctrl    { margin: 10px 10px 0 0; float: right; }\n.l7-ctrl-bottom-left .l7-ctrl  { margin: 0 0 10px 10px; float: left; }\n.l7-ctrl-bottom-right .l7-ctrl { margin: 0 10px 10px 0; float: right; }\n\n\n.l7-crosshair,\n.l7-crosshair .l7-interactive,\n.l7-crosshair .l7-interactive:active {\n    cursor: crosshair;\n}\n\n.l7-boxzoom {\n    position: absolute;\n    top: 0;\n    left: 0;\n    width: 0;\n    height: 0;\n    background: #fff;\n    border: 2px dotted #202020;\n    opacity: 0.5;\n    z-index: 10;\n}\n");
-import LngLat from './geo/lng_lat';
-import LngLatBounds from './geo/lng_lat_bounds';
-import Point from './geo/point';
-import HandlerManager from './handler/handler_manager';
-import { renderframe } from './util';
-import { PerformanceUtils } from './utils/performance';
-import TaskQueue from './utils/task_queue';
+import LngLat from "./geo/lng_lat";
+import LngLatBounds from "./geo/lng_lat_bounds"; // @ts-ignore
+
+import Point from "./geo/point";
+import HandlerManager from "./handler/handler_manager";
+import { renderframe } from "./util";
+import { PerformanceUtils } from "./utils/performance";
+import TaskQueue from "./utils/task_queue";
 var defaultMinZoom = -2;
-var defaultMaxZoom = 22;
+var defaultMaxZoom = 22; // the default values, but also the valid range
+
 var defaultMinPitch = 0;
 var defaultMaxPitch = 60;
 var DefaultOptions = {
@@ -93,7 +95,7 @@ var DefaultOptions = {
   pitchEnabled: true,
   rotateEnabled: true
 };
-export var EarthMap = function (_Camera) {
+export var EarthMap = /*#__PURE__*/function (_Camera) {
   _inherits(EarthMap, _Camera);
 
   var _super = _createSuper(EarthMap);
@@ -103,36 +105,10 @@ export var EarthMap = function (_Camera) {
 
     _classCallCheck(this, EarthMap);
 
-    _this = _super.call(this, _merge({}, DefaultOptions, options));
-
-    _defineProperty(_assertThisInitialized(_this), "doubleClickZoom", void 0);
-
-    _defineProperty(_assertThisInitialized(_this), "dragRotate", void 0);
-
-    _defineProperty(_assertThisInitialized(_this), "dragPan", void 0);
-
-    _defineProperty(_assertThisInitialized(_this), "touchZoomRotate", void 0);
-
-    _defineProperty(_assertThisInitialized(_this), "scrollZoom", void 0);
-
-    _defineProperty(_assertThisInitialized(_this), "keyboard", void 0);
-
-    _defineProperty(_assertThisInitialized(_this), "touchPitch", void 0);
-
-    _defineProperty(_assertThisInitialized(_this), "boxZoom", void 0);
-
-    _defineProperty(_assertThisInitialized(_this), "handlers", void 0);
-
-    _defineProperty(_assertThisInitialized(_this), "container", void 0);
-
-    _defineProperty(_assertThisInitialized(_this), "canvas", void 0);
-
-    _defineProperty(_assertThisInitialized(_this), "canvasContainer", void 0);
+    _this = _super.call(this, merge({}, DefaultOptions, options));
 
     _defineProperty(_assertThisInitialized(_this), "renderTaskQueue", new TaskQueue());
 
-    _defineProperty(_assertThisInitialized(_this), "frame", void 0);
-
     _defineProperty(_assertThisInitialized(_this), "trackResize", true);
 
     _defineProperty(_assertThisInitialized(_this), "onWindowOnline", function () {
@@ -167,7 +143,8 @@ export var EarthMap = function (_Camera) {
     value: function resize(eventData) {
       var dimensions = this.containerDimensions();
       var width = dimensions[0];
-      var height = dimensions[1];
+      var height = dimensions[1]; // this.resizeCanvas(width, height);
+
       this.transform.resize(width, height);
       var fireMoving = !this.moving;
 
@@ -406,7 +383,14 @@ export var EarthMap = function (_Camera) {
 
       if (this.options.interactive) {
         canvasContainer.classList.add('l7-interactive');
-      }
+      } // this.canvas = DOM.create(
+      //   'canvas',
+      //   'l7-canvas',
+      //   canvasContainer,
+      // ) as HTMLCanvasElement;
+      // this.canvas.setAttribute('tabindex', '-');
+      // this.canvas.setAttribute('aria-label', 'Map');
+
     }
   }, {
     key: "containerDimensions",
@@ -426,12 +410,12 @@ export var EarthMap = function (_Camera) {
     value: function resizeCanvas(width, height) {
       var pixelRatio = DOM.DPR || 1;
       this.canvas.width = pixelRatio * width;
-      this.canvas.height = pixelRatio * height;
+      this.canvas.height = pixelRatio * height; // Maintain the same canvas size, potentially downscaling it for HiDPI displays
+
       this.canvas.style.width = "".concat(width, "px");
       this.canvas.style.height = "".concat(height, "px");
     }
   }]);
 
   return EarthMap;
-}(Camera);
-//# sourceMappingURL=earthmap.js.map
+}(Camera);