@antv/l7-map 2.9.32-alpha.4 → 2.9.32-alpha.5

package/lib/earthmap.js

@@ -1,43 +1,94 @@
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+"use strict";
 
-// src/earthmap.ts
-var earthmap_exports = {};
-__export(earthmap_exports, {
-  EarthMap: () => EarthMap
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
 });
-module.exports = __toCommonJS(earthmap_exports);
-var import_l7_utils = require("@antv/l7-utils");
-var import_lodash = require("lodash");
-var import_camera = __toESM(require("./camera"));
-var import_l7 = require("./css/l7.css");
-var import_lng_lat = __toESM(require("./geo/lng_lat"));
-var import_lng_lat_bounds = __toESM(require("./geo/lng_lat_bounds"));
-var import_point = __toESM(require("./geo/point"));
-var import_handler_manager = __toESM(require("./handler/handler_manager"));
-var import_util = require("./util");
-var import_performance = require("./utils/performance");
-var import_task_queue = __toESM(require("./utils/task_queue"));
+exports.EarthMap = void 0;
+
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+
+var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
+
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+
+var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _l7Utils = require("@antv/l7-utils");
+
+var _lodash = require("lodash");
+
+var _camera = _interopRequireDefault(require("./camera"));
+
+var _lng_lat = _interopRequireDefault(require("./geo/lng_lat"));
+
+var _lng_lat_bounds = _interopRequireDefault(require("./geo/lng_lat_bounds"));
+
+var _point = _interopRequireDefault(require("./geo/point"));
+
+var _handler_manager = _interopRequireDefault(require("./handler/handler_manager"));
+
+var _util = require("./util");
+
+var _performance = require("./utils/performance");
+
+var _task_queue = _interopRequireDefault(require("./utils/task_queue"));
+
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(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; } }
+
+function loadStyles(css, doc) {
+  var isMiniAli = typeof my !== 'undefined' && !!my && typeof my.showToast === 'function' && my.isFRM !== true;
+  var isWeChatMiniProgram = typeof wx !== 'undefined' && wx !== null && (typeof wx.request !== 'undefined' || typeof wx.miniProgram !== 'undefined');
+
+  if (isMiniAli || isWeChatMiniProgram) {
+    return;
+  }
+
+  if (!doc) doc = document;
+
+  if (!doc) {
+    return;
+  }
+
+  var head = doc.head || doc.getElementsByTagName('head')[0];
+
+  if (!head) {
+    head = doc.createElement('head');
+    var body = doc.body || doc.getElementsByTagName('body')[0];
+
+    if (body) {
+      body.parentNode.insertBefore(head, body);
+    } else {
+      doc.documentElement.appendChild(head);
+    }
+  }
+
+  var style = doc.createElement('style');
+  style.type = 'text/css';
+
+  if (style.styleSheet) {
+    style.styleSheet.cssText = css;
+  } else {
+    style.appendChild(doc.createTextNode(css));
+  }
+
+  head.appendChild(style);
+  return style;
+}
+
+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");
 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 = {
@@ -67,212 +118,327 @@ var DefaultOptions = {
   pitchEnabled: true,
   rotateEnabled: true
 };
-var EarthMap = class extends import_camera.default {
-  constructor(options) {
-    super((0, import_lodash.merge)({}, DefaultOptions, options));
-    this.renderTaskQueue = new import_task_queue.default();
-    this.trackResize = true;
-    this.onWindowOnline = () => {
-      this.update();
-    };
-    this.onWindowResize = (event) => {
-      if (this.trackResize) {
-        this.resize({ originalEvent: event }).update();
+
+var EarthMap = /*#__PURE__*/function (_Camera) {
+  (0, _inherits2.default)(EarthMap, _Camera);
+
+  var _super = _createSuper(EarthMap);
+
+  function EarthMap(options) {
+    var _this;
+
+    (0, _classCallCheck2.default)(this, EarthMap);
+    _this = _super.call(this, (0, _lodash.merge)({}, DefaultOptions, options));
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "renderTaskQueue", new _task_queue.default());
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "trackResize", true);
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onWindowOnline", function () {
+      _this.update();
+    });
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onWindowResize", function (event) {
+      if (_this.trackResize) {
+        _this.resize({
+          originalEvent: event
+        }).update();
       }
-    };
-    this.initContainer();
-    this.resize();
-    this.handlers = new import_handler_manager.default(this, this.options);
-    if (typeof window !== "undefined") {
-      window.addEventListener("online", this.onWindowOnline, false);
-      window.addEventListener("resize", this.onWindowResize, false);
-      window.addEventListener("orientationchange", this.onWindowResize, false);
+    });
+
+    _this.initContainer();
+
+    _this.resize();
+
+    _this.handlers = new _handler_manager.default((0, _assertThisInitialized2.default)(_this), _this.options);
+
+    if (typeof window !== 'undefined') {
+      window.addEventListener('online', _this.onWindowOnline, false);
+      window.addEventListener('resize', _this.onWindowResize, false);
+      window.addEventListener('orientationchange', _this.onWindowResize, false);
     }
+
+    return _this;
   }
-  resize(eventData) {
-    const dimensions = this.containerDimensions();
-    const width = dimensions[0];
-    const height = dimensions[1];
-    this.transform.resize(width, height);
-    const fireMoving = !this.moving;
-    if (fireMoving) {
-      this.stop();
-      this.emit("movestart", new Event("movestart", eventData));
-      this.emit("move", new Event("move", eventData));
+
+  (0, _createClass2.default)(EarthMap, [{
+    key: "resize",
+    value: function resize(eventData) {
+      var dimensions = this.containerDimensions();
+      var width = dimensions[0];
+      var height = dimensions[1]; // this.resizeCanvas(width, height);
+
+      this.transform.resize(width, height);
+      var fireMoving = !this.moving;
+
+      if (fireMoving) {
+        this.stop();
+        this.emit('movestart', new Event('movestart', eventData));
+        this.emit('move', new Event('move', eventData));
+      }
+
+      this.emit('resize', new Event('resize', eventData));
+
+      if (fireMoving) {
+        this.emit('moveend', new Event('moveend', eventData));
+      }
+
+      return this;
     }
-    this.emit("resize", new Event("resize", eventData));
-    if (fireMoving) {
-      this.emit("moveend", new Event("moveend", eventData));
+  }, {
+    key: "getContainer",
+    value: function getContainer() {
+      return this.container;
     }
-    return this;
-  }
-  getContainer() {
-    return this.container;
-  }
-  getCanvas() {
-    return this.canvas;
-  }
-  getCanvasContainer() {
-    return this.canvasContainer;
-  }
-  project(lngLat) {
-    return this.transform.locationPoint(import_lng_lat.default.convert(lngLat));
-  }
-  unproject(point) {
-    return this.transform.pointLocation(import_point.default.convert(point));
-  }
-  getBounds() {
-    return this.transform.getBounds();
-  }
-  getMaxBounds() {
-    return this.transform.getMaxBounds();
-  }
-  setMaxBounds(bounds) {
-    this.transform.setMaxBounds(import_lng_lat_bounds.default.convert(bounds));
-  }
-  setStyle(style) {
-    return;
-  }
-  setMinZoom(minZoom) {
-    minZoom = minZoom === null || minZoom === void 0 ? defaultMinZoom : minZoom;
-    if (minZoom >= defaultMinZoom && minZoom <= this.transform.maxZoom) {
-      this.transform.minZoom = minZoom;
-      if (this.getZoom() < minZoom) {
-        this.setZoom(minZoom);
+  }, {
+    key: "getCanvas",
+    value: function getCanvas() {
+      return this.canvas;
+    }
+  }, {
+    key: "getCanvasContainer",
+    value: function getCanvasContainer() {
+      return this.canvasContainer;
+    }
+  }, {
+    key: "project",
+    value: function project(lngLat) {
+      return this.transform.locationPoint(_lng_lat.default.convert(lngLat));
+    }
+  }, {
+    key: "unproject",
+    value: function unproject(point) {
+      return this.transform.pointLocation(_point.default.convert(point));
+    }
+  }, {
+    key: "getBounds",
+    value: function getBounds() {
+      return this.transform.getBounds();
+    }
+  }, {
+    key: "getMaxBounds",
+    value: function getMaxBounds() {
+      return this.transform.getMaxBounds();
+    }
+  }, {
+    key: "setMaxBounds",
+    value: function setMaxBounds(bounds) {
+      this.transform.setMaxBounds(_lng_lat_bounds.default.convert(bounds));
+    }
+  }, {
+    key: "setStyle",
+    value: function setStyle(style) {
+      return;
+    }
+  }, {
+    key: "setMinZoom",
+    value: function setMinZoom(minZoom) {
+      minZoom = minZoom === null || minZoom === undefined ? defaultMinZoom : minZoom;
+
+      if (minZoom >= defaultMinZoom && minZoom <= this.transform.maxZoom) {
+        this.transform.minZoom = minZoom;
+
+        if (this.getZoom() < minZoom) {
+          this.setZoom(minZoom);
+        }
+
+        return this;
+      } else {
+        throw new Error("minZoom must be between ".concat(defaultMinZoom, " and the current maxZoom, inclusive"));
       }
-      return this;
-    } else {
-      throw new Error(`minZoom must be between ${defaultMinZoom} and the current maxZoom, inclusive`);
     }
-  }
-  getMinZoom() {
-    return this.transform.minZoom;
-  }
-  setMaxZoom(maxZoom) {
-    maxZoom = maxZoom === null || maxZoom === void 0 ? defaultMaxZoom : maxZoom;
-    if (maxZoom >= this.transform.minZoom) {
-      this.transform.maxZoom = maxZoom;
-      if (this.getZoom() > maxZoom) {
-        this.setZoom(maxZoom);
+  }, {
+    key: "getMinZoom",
+    value: function getMinZoom() {
+      return this.transform.minZoom;
+    }
+  }, {
+    key: "setMaxZoom",
+    value: function setMaxZoom(maxZoom) {
+      maxZoom = maxZoom === null || maxZoom === undefined ? defaultMaxZoom : maxZoom;
+
+      if (maxZoom >= this.transform.minZoom) {
+        this.transform.maxZoom = maxZoom;
+
+        if (this.getZoom() > maxZoom) {
+          this.setZoom(maxZoom);
+        }
+
+        return this;
+      } else {
+        throw new Error('maxZoom must be greater than the current minZoom');
       }
-      return this;
-    } else {
-      throw new Error("maxZoom must be greater than the current minZoom");
     }
-  }
-  getMaxZoom() {
-    return this.transform.maxZoom;
-  }
-  setMinPitch(minPitch) {
-    minPitch = minPitch === null || minPitch === void 0 ? defaultMinPitch : minPitch;
-    if (minPitch < defaultMinPitch) {
-      throw new Error(`minPitch must be greater than or equal to ${defaultMinPitch}`);
+  }, {
+    key: "getMaxZoom",
+    value: function getMaxZoom() {
+      return this.transform.maxZoom;
     }
-    if (minPitch >= defaultMinPitch && minPitch <= this.transform.maxPitch) {
-      this.transform.minPitch = minPitch;
-      if (this.getPitch() < minPitch) {
-        this.setPitch(minPitch);
+  }, {
+    key: "setMinPitch",
+    value: function setMinPitch(minPitch) {
+      minPitch = minPitch === null || minPitch === undefined ? defaultMinPitch : minPitch;
+
+      if (minPitch < defaultMinPitch) {
+        throw new Error("minPitch must be greater than or equal to ".concat(defaultMinPitch));
+      }
+
+      if (minPitch >= defaultMinPitch && minPitch <= this.transform.maxPitch) {
+        this.transform.minPitch = minPitch;
+
+        if (this.getPitch() < minPitch) {
+          this.setPitch(minPitch);
+        }
+
+        return this;
+      } else {
+        throw new Error("minPitch must be between ".concat(defaultMinPitch, " and the current maxPitch, inclusive"));
       }
-      return this;
-    } else {
-      throw new Error(`minPitch must be between ${defaultMinPitch} and the current maxPitch, inclusive`);
     }
-  }
-  getMinPitch() {
-    return this.transform.minPitch;
-  }
-  setMaxPitch(maxPitch) {
-    maxPitch = maxPitch === null || maxPitch === void 0 ? defaultMaxPitch : maxPitch;
-    if (maxPitch > defaultMaxPitch) {
-      throw new Error(`maxPitch must be less than or equal to ${defaultMaxPitch}`);
+  }, {
+    key: "getMinPitch",
+    value: function getMinPitch() {
+      return this.transform.minPitch;
     }
-    if (maxPitch >= this.transform.minPitch) {
-      this.transform.maxPitch = maxPitch;
-      if (this.getPitch() > maxPitch) {
-        this.setPitch(maxPitch);
+  }, {
+    key: "setMaxPitch",
+    value: function setMaxPitch(maxPitch) {
+      maxPitch = maxPitch === null || maxPitch === undefined ? defaultMaxPitch : maxPitch;
+
+      if (maxPitch > defaultMaxPitch) {
+        throw new Error("maxPitch must be less than or equal to ".concat(defaultMaxPitch));
+      }
+
+      if (maxPitch >= this.transform.minPitch) {
+        this.transform.maxPitch = maxPitch;
+
+        if (this.getPitch() > maxPitch) {
+          this.setPitch(maxPitch);
+        }
+
+        return this;
+      } else {
+        throw new Error('maxPitch must be greater than the current minPitch');
       }
-      return this;
-    } else {
-      throw new Error("maxPitch must be greater than the current minPitch");
     }
-  }
-  getMaxPitch() {
-    return this.transform.maxPitch;
-  }
-  getRenderWorldCopies() {
-    return this.transform.renderWorldCopies;
-  }
-  setRenderWorldCopies(renderWorldCopies) {
-    this.transform.renderWorldCopies = !!renderWorldCopies;
-  }
-  remove() {
-    if (this.frame) {
-      this.frame.cancel();
-      this.frame = null;
+  }, {
+    key: "getMaxPitch",
+    value: function getMaxPitch() {
+      return this.transform.maxPitch;
     }
-    this.renderTaskQueue.clear();
-  }
-  requestRenderFrame(cb) {
-    this.update();
-    return this.renderTaskQueue.add(cb);
-  }
-  cancelRenderFrame(id) {
-    return this.renderTaskQueue.remove(id);
-  }
-  triggerRepaint() {
-    if (!this.frame) {
-      this.frame = (0, import_util.renderframe)((paintStartTimeStamp) => {
-        import_performance.PerformanceUtils.frame(paintStartTimeStamp);
-        this.frame = null;
-        this.update(paintStartTimeStamp);
-      });
+  }, {
+    key: "getRenderWorldCopies",
+    value: function getRenderWorldCopies() {
+      return this.transform.renderWorldCopies;
     }
-  }
-  update(time) {
-    if (!this.frame) {
-      this.frame = (0, import_util.renderframe)((paintStartTimeStamp) => {
-        import_performance.PerformanceUtils.frame(paintStartTimeStamp);
+  }, {
+    key: "setRenderWorldCopies",
+    value: function setRenderWorldCopies(renderWorldCopies) {
+      this.transform.renderWorldCopies = !!renderWorldCopies;
+    }
+  }, {
+    key: "remove",
+    value: function remove() {
+      if (this.frame) {
+        this.frame.cancel();
         this.frame = null;
-        this.renderTaskQueue.run(time);
-      });
+      }
+
+      this.renderTaskQueue.clear();
     }
-  }
-  initContainer() {
-    if (typeof this.options.container === "string") {
-      this.container = window.document.getElementById(this.options.container);
-      if (!this.container) {
-        throw new Error(`Container '${this.options.container}' not found.`);
+  }, {
+    key: "requestRenderFrame",
+    value: function requestRenderFrame(cb) {
+      this.update();
+      return this.renderTaskQueue.add(cb);
+    }
+  }, {
+    key: "cancelRenderFrame",
+    value: function cancelRenderFrame(id) {
+      return this.renderTaskQueue.remove(id);
+    }
+  }, {
+    key: "triggerRepaint",
+    value: function triggerRepaint() {
+      var _this2 = this;
+
+      if (!this.frame) {
+        this.frame = (0, _util.renderframe)(function (paintStartTimeStamp) {
+          _performance.PerformanceUtils.frame(paintStartTimeStamp);
+
+          _this2.frame = null;
+
+          _this2.update(paintStartTimeStamp);
+        });
+      }
+    }
+  }, {
+    key: "update",
+    value: function update(time) {
+      var _this3 = this;
+
+      if (!this.frame) {
+        this.frame = (0, _util.renderframe)(function (paintStartTimeStamp) {
+          _performance.PerformanceUtils.frame(paintStartTimeStamp);
+
+          _this3.frame = null;
+
+          _this3.renderTaskQueue.run(time);
+        });
       }
-    } else if (this.options.container instanceof HTMLElement) {
-      this.container = this.options.container;
-    } else {
-      throw new Error("Invalid type: 'container' must be a String or HTMLElement.");
     }
-    const container = this.container;
-    container.classList.add("l7-map");
-    const canvasContainer = this.canvasContainer = import_l7_utils.DOM.create("div", "l7-canvas-container", container);
-    if (this.options.interactive) {
-      canvasContainer.classList.add("l7-interactive");
+  }, {
+    key: "initContainer",
+    value: function initContainer() {
+      if (typeof this.options.container === 'string') {
+        this.container = window.document.getElementById(this.options.container);
+
+        if (!this.container) {
+          throw new Error("Container '".concat(this.options.container, "' not found."));
+        }
+      } else if (this.options.container instanceof HTMLElement) {
+        this.container = this.options.container;
+      } else {
+        throw new Error("Invalid type: 'container' must be a String or HTMLElement.");
+      }
+
+      var container = this.container;
+      container.classList.add('l7-map');
+
+      var canvasContainer = this.canvasContainer = _l7Utils.DOM.create('div', 'l7-canvas-container', container);
+
+      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');
+
     }
-  }
-  containerDimensions() {
-    let width = 0;
-    let height = 0;
-    if (this.container) {
-      width = this.container.clientWidth || 400;
-      height = this.container.clientHeight || 300;
+  }, {
+    key: "containerDimensions",
+    value: function containerDimensions() {
+      var width = 0;
+      var height = 0;
+
+      if (this.container) {
+        width = this.container.clientWidth || 400;
+        height = this.container.clientHeight || 300;
+      }
+
+      return [width, height];
     }
-    return [width, height];
-  }
-  resizeCanvas(width, height) {
-    const pixelRatio = import_l7_utils.DOM.DPR || 1;
-    this.canvas.width = pixelRatio * width;
-    this.canvas.height = pixelRatio * height;
-    this.canvas.style.width = `${width}px`;
-    this.canvas.style.height = `${height}px`;
-  }
-};
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  EarthMap
-});
+  }, {
+    key: "resizeCanvas",
+    value: function resizeCanvas(width, height) {
+      var pixelRatio = _l7Utils.DOM.DPR || 1;
+      this.canvas.width = pixelRatio * width;
+      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.default);
+
+exports.EarthMap = EarthMap;