@deck.gl-community/bing-maps 9.0.1

package/LICENSE

@@ -0,0 +1,19 @@
+Copyright (c) 2020 vis.gl a Series of LF Projects, LLC
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.

package/README.md

@@ -0,0 +1,96 @@
+# @deck.gl-community/bing-maps
+
+This module allows [deck.gl](https://deck.gl) to be used as a Bing Maps custom layer.
+
+## Installation
+
+```bash
+npm install deck.gl @deck.gl-community/bing-maps
+```
+
+## Usage
+
+```js
+import {loadModules} from '@deck.gl-community/bing-maps';
+import {GeoJsonLayer} from 'deck.gl';
+
+loadModules().then(({Maps, Location, DeckOverlay}) => {
+  // Create map
+  const map = new Map(document.getElementById('map'), {
+    credentials: 'YOUR_API_KEY',
+    // Disable modes that are not supported
+    disableBirdsEye: true,
+    disableStreetside: true
+  });
+
+  map.setView({
+    center: new Location(37.78, -122.45),
+    zoom: 10
+  });
+
+  // Add deck.gl overlay
+  const deckOverlay = new DeckOverlay({
+    layers: [
+      new GeoJsonLayer({
+        data:
+          'https://d2ad6b4ur7yvpq.cloudfront.net/naturalearth-3.3.0/ne_50m_admin_0_scale_rank.geojson',
+        lineWidthMinPixels: 2,
+        getLineColor: [60, 60, 60],
+        getFillColor: [200, 200, 200]
+      })
+    ]
+  });
+  map.layers.insert(deckOverlay);
+});
+```
+
+## API Reference
+
+### loadModules
+
+`loadModules(moduleNames)`
+
+Arguments:
+
+- `moduleNames` (Array<String>?) - Optional modules to load, e.g. `'Microsoft.Maps.GeoJson'`, `'Microsoft.Maps.DrawingTools'`
+
+Returns a Promise that resolves to the global `Microsoft.Maps` namespace. A custom class, `DeckOverlay`, is also added to the namespace.
+
+### DeckOverlay
+
+An implementation of [CustomOverlay](https://docs.microsoft.com/en-us/bingmaps/v8-web-control/map-control-api/customoverlay-class).
+
+```js
+const deckOverlay = new DeckOverlay({...});
+map.layers.insert(deckOverlay);
+```
+
+The constructor accepts a props object that is passed to the [Deck](https://deck.gl/docs/api-reference/core/deck) constructor. See the [limitations](#supported-features-and-limitations) section below for more details.
+
+The following [Deck methods](https://deck.gl/docs/api-reference/core/deck#methods) can be called directly from a `DeckOverlay` instance:
+
+- `deckOverlay.setProps`
+- `deckOverlay.pickObject`
+- `deckOverlay.pickMultipleObjects`
+- `deckOverlay.pickObjects`
+- `deckOverlay.redraw`
+- `deckOverlay.finalize`
+
+## Supported Features and Limitations
+
+Supported deck.gl features:
+
+- Layers
+- Effects
+- Auto-highlighting
+- Attribute transitions
+- `onHover` and `onClick` callbacks
+- Tooltip
+
+Not supported features:
+
+- Tilting
+- Multiple views
+- Controller
+- React integration
+- Gesture event callbacks (e.g. `onDrag*`)

package/dist/deck-overlay.d.ts

@@ -0,0 +1,19 @@
+export default function getDeckOverlay({ CustomOverlay, Events, MapTypeId }: {
+    CustomOverlay: any;
+    Events: any;
+    MapTypeId: any;
+}): {
+    new (props?: {}): {
+        [x: string]: any;
+        setProps(props: any): void;
+        pickObject(params: any): any;
+        pickMultipleObjects(params: any): any;
+        pickObjects(params: any): any;
+        finalize(): void;
+        onAdd(): void;
+        onLoad(): void;
+        onRemove(): void;
+        redraw(): void;
+    };
+    [x: string]: any;
+};

package/dist/deck-overlay.js

@@ -0,0 +1,59 @@
+// deck.gl-community
+// SPDX-License-Identifier: MIT
+// Copyright (c) vis.gl contributors
+import { createContainer, createDeckInstance, destroyDeckInstance, getViewState } from './utils';
+const HIDE_ALL_LAYERS = () => false;
+export default function getDeckOverlay({ CustomOverlay, Events, MapTypeId }) {
+    class DeckOverlay extends CustomOverlay {
+        constructor(props = {}) {
+            super();
+            this.props = props;
+        }
+        setProps(props) {
+            Object.assign(this.props, props);
+            if (this.deck) {
+                this.deck.setProps(props);
+            }
+        }
+        pickObject(params) {
+            return this.deck && this.deck.pickObject(params);
+        }
+        pickMultipleObjects(params) {
+            return this.deck && this.deck.pickMultipleObjects(params);
+        }
+        pickObjects(params) {
+            return this.deck && this.deck.pickObjects(params);
+        }
+        finalize() {
+            destroyDeckInstance(this.deck, Events);
+        }
+        // Set up DOM elements, and use setHtmlElement to bind it with the overlay.
+        onAdd() {
+            this.container = createContainer(this.props.style);
+            // Add the container to the overlay
+            this.setHtmlElement(this.container);
+        }
+        // Perform custom operations after adding the overlay to the map.
+        onLoad() {
+            const map = this.getMap();
+            this.deck = createDeckInstance(map, this, this.props, Events);
+        }
+        // Remove all event handlers from the map.
+        onRemove() {
+            destroyDeckInstance(this.deck, Events);
+            this.deck = null;
+        }
+        redraw() {
+            const map = this.getMap();
+            const { deck } = this;
+            const mapType = map.getMapTypeId();
+            const canSyncWithMap = mapType !== MapTypeId.streetside && mapType !== MapTypeId.birdseye;
+            deck.setProps({
+                ...getViewState(map),
+                layerFilter: canSyncWithMap ? this.props.layerFilter : HIDE_ALL_LAYERS
+            });
+            // deck.redraw();
+        }
+    }
+    return DeckOverlay;
+}

package/dist/index.cjs

@@ -0,0 +1,208 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+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 __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// dist/index.js
+var dist_exports = {};
+__export(dist_exports, {
+  loadModule: () => loadModule
+});
+module.exports = __toCommonJS(dist_exports);
+
+// dist/utils.js
+var import_core = require("@deck.gl/core");
+function createContainer(style) {
+  const container = document.createElement("canvas");
+  Object.assign(container.style, {
+    position: "absolute",
+    zIndex: 0,
+    // block deck.gl's own event listeners
+    pointerEvents: "none",
+    left: 0,
+    top: 0
+  }, style);
+  return container;
+}
+var mouseEvents = ["click", "dblclick", "mousedown", "mousemove", "mouseout"];
+var redrawEvents = ["viewchange", "mapresize", "maptypechanged"];
+function createDeckInstance(map, overlay, props, Events) {
+  const eventListeners = {};
+  const deck = new import_core.Deck({
+    ...props,
+    canvas: overlay.container,
+    views: new import_core.MapView({ repeat: true }),
+    ...getViewState(map),
+    controller: false,
+    userData: {
+      _map: map,
+      _eventListeners: eventListeners
+    },
+    onLoad: () => {
+      if (props.onLoad) {
+        props.onLoad();
+      }
+    }
+  });
+  for (const eventType of mouseEvents) {
+    eventListeners[eventType] = Events.addHandler(map, eventType, (evt) => handleMouseEvent(deck, eventType, evt));
+  }
+  for (const eventType of redrawEvents) {
+    eventListeners[eventType] = Events.addHandler(map, eventType, () => overlay.redraw());
+  }
+  return deck;
+}
+function getViewState(map) {
+  const zoom = map.getZoom();
+  const center = map.getCenter();
+  const width = map.getWidth();
+  const height = map.getHeight();
+  return {
+    width,
+    height,
+    viewState: {
+      longitude: center.longitude,
+      latitude: center.latitude,
+      zoom: zoom - 1
+    }
+  };
+}
+function destroyDeckInstance(deck, Events) {
+  if (!deck)
+    return;
+  const eventListeners = deck.props.userData._eventListeners;
+  for (const eventType in eventListeners) {
+    Events.removeHandler(eventListeners[eventType]);
+  }
+  deck.finalize();
+}
+function handleMouseEvent(deck, type, event) {
+  const mockEvent = {
+    type,
+    offsetCenter: {
+      x: deck.props.width / 2 + event.getX(),
+      y: deck.props.height / 2 + event.getY()
+    },
+    srcEvent: event
+  };
+  switch (type) {
+    case "mousedown":
+      deck._onPointerDown(mockEvent);
+      break;
+    case "click":
+      mockEvent.tapCount = 1;
+      deck._onEvent(mockEvent);
+      break;
+    case "dblclick":
+      mockEvent.type = "click";
+      mockEvent.tapCount = 2;
+      deck._onEvent(mockEvent);
+      break;
+    case "mousemove":
+      mockEvent.type = "pointermove";
+      deck._onPointerMove(mockEvent);
+      break;
+    case "mouseout":
+      mockEvent.type = "pointerleave";
+      deck._onPointerMove(mockEvent);
+      break;
+    default:
+      return;
+  }
+}
+
+// dist/deck-overlay.js
+var HIDE_ALL_LAYERS = () => false;
+function getDeckOverlay({ CustomOverlay, Events, MapTypeId }) {
+  class DeckOverlay extends CustomOverlay {
+    constructor(props = {}) {
+      super();
+      this.props = props;
+    }
+    setProps(props) {
+      Object.assign(this.props, props);
+      if (this.deck) {
+        this.deck.setProps(props);
+      }
+    }
+    pickObject(params) {
+      return this.deck && this.deck.pickObject(params);
+    }
+    pickMultipleObjects(params) {
+      return this.deck && this.deck.pickMultipleObjects(params);
+    }
+    pickObjects(params) {
+      return this.deck && this.deck.pickObjects(params);
+    }
+    finalize() {
+      destroyDeckInstance(this.deck, Events);
+    }
+    // Set up DOM elements, and use setHtmlElement to bind it with the overlay.
+    onAdd() {
+      this.container = createContainer(this.props.style);
+      this.setHtmlElement(this.container);
+    }
+    // Perform custom operations after adding the overlay to the map.
+    onLoad() {
+      const map = this.getMap();
+      this.deck = createDeckInstance(map, this, this.props, Events);
+    }
+    // Remove all event handlers from the map.
+    onRemove() {
+      destroyDeckInstance(this.deck, Events);
+      this.deck = null;
+    }
+    redraw() {
+      const map = this.getMap();
+      const { deck } = this;
+      const mapType = map.getMapTypeId();
+      const canSyncWithMap = mapType !== MapTypeId.streetside && mapType !== MapTypeId.birdseye;
+      deck.setProps({
+        ...getViewState(map),
+        layerFilter: canSyncWithMap ? this.props.layerFilter : HIDE_ALL_LAYERS
+      });
+    }
+  }
+  return DeckOverlay;
+}
+
+// dist/load-module.js
+var BING_MAPS_API_URL = "https://www.bing.com/api/maps/mapcontrol?callback=__loadBingMaps";
+function loadModule(moduleNames) {
+  return new Promise((resolve) => {
+    window.__loadBingMaps = () => {
+      const namespace = window.Microsoft.Maps;
+      namespace.DeckOverlay = getDeckOverlay(namespace);
+      delete window.__loadBingMaps;
+      if (moduleNames) {
+        Promise.all(moduleNames.map((m) => awaitCallback(namespace.loadModule, m))).then(() => resolve(namespace));
+      } else {
+        resolve(namespace);
+      }
+    };
+    const script = document.createElement("script");
+    script.type = "text/javascript";
+    script.src = BING_MAPS_API_URL;
+    const head = document.querySelector("head");
+    head.appendChild(script);
+  });
+}
+function awaitCallback(func, ...args) {
+  return new Promise((resolve) => {
+    func(...args, resolve);
+  });
+}
+//# sourceMappingURL=index.cjs.map

package/dist/index.cjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["index.js", "utils.js", "deck-overlay.js", "load-module.js"],
+  "sourcesContent": ["// deck.gl-community\n// SPDX-License-Identifier: MIT\n// Copyright (c) vis.gl contributors\nexport { default as loadModule } from './load-module';\n", "// deck.gl-community\n// SPDX-License-Identifier: MIT\n// Copyright (c) vis.gl contributors\nimport { Deck, MapView } from '@deck.gl/core';\nexport function createContainer(style) {\n    const container = document.createElement('canvas');\n    Object.assign(container.style, {\n        position: 'absolute',\n        zIndex: 0,\n        // block deck.gl's own event listeners\n        pointerEvents: 'none',\n        left: 0,\n        top: 0\n    }, style);\n    return container;\n}\nconst mouseEvents = ['click', 'dblclick', 'mousedown', 'mousemove', 'mouseout'];\nconst redrawEvents = ['viewchange', 'mapresize', 'maptypechanged'];\nexport function createDeckInstance(map, overlay, props, Events) {\n    const eventListeners = {};\n    const deck = new Deck({\n        ...props,\n        canvas: overlay.container,\n        views: new MapView({ repeat: true }),\n        ...getViewState(map),\n        controller: false,\n        userData: {\n            _map: map,\n            _eventListeners: eventListeners\n        },\n        onLoad: () => {\n            // TODO: .tooltip is protected, find another  way to set this.\n            // Bing Maps' label canvas has z-index of 20000\n            // deck.tooltip.el.style.zIndex = 30000;\n            if (props.onLoad) {\n                props.onLoad();\n            }\n        }\n    });\n    // Register event listeners\n    for (const eventType of mouseEvents) {\n        eventListeners[eventType] = Events.addHandler(map, eventType, (evt) => handleMouseEvent(deck, eventType, evt));\n    }\n    for (const eventType of redrawEvents) {\n        eventListeners[eventType] = Events.addHandler(map, eventType, () => overlay.redraw());\n    }\n    return deck;\n}\nexport function getViewState(map) {\n    const zoom = map.getZoom();\n    const center = map.getCenter();\n    const width = map.getWidth();\n    const height = map.getHeight();\n    return {\n        width,\n        height,\n        viewState: {\n            longitude: center.longitude,\n            latitude: center.latitude,\n            zoom: zoom - 1\n        }\n    };\n}\nexport function destroyDeckInstance(deck, Events) {\n    if (!deck)\n        return;\n    const eventListeners = deck.props.userData._eventListeners;\n    for (const eventType in eventListeners) {\n        Events.removeHandler(eventListeners[eventType]);\n    }\n    deck.finalize();\n}\nfunction handleMouseEvent(deck, type, event) {\n    const mockEvent = {\n        type,\n        offsetCenter: {\n            x: deck.props.width / 2 + event.getX(),\n            y: deck.props.height / 2 + event.getY()\n        },\n        srcEvent: event\n    };\n    switch (type) {\n        case 'mousedown':\n            deck._onPointerDown(mockEvent);\n            break;\n        case 'click':\n            mockEvent.tapCount = 1;\n            deck._onEvent(mockEvent);\n            break;\n        case 'dblclick':\n            mockEvent.type = 'click';\n            mockEvent.tapCount = 2;\n            deck._onEvent(mockEvent);\n            break;\n        case 'mousemove':\n            mockEvent.type = 'pointermove';\n            deck._onPointerMove(mockEvent);\n            break;\n        case 'mouseout':\n            mockEvent.type = 'pointerleave';\n            deck._onPointerMove(mockEvent);\n            break;\n        default:\n            return;\n    }\n}\n", "// deck.gl-community\n// SPDX-License-Identifier: MIT\n// Copyright (c) vis.gl contributors\nimport { createContainer, createDeckInstance, destroyDeckInstance, getViewState } from './utils';\nconst HIDE_ALL_LAYERS = () => false;\nexport default function getDeckOverlay({ CustomOverlay, Events, MapTypeId }) {\n    class DeckOverlay extends CustomOverlay {\n        constructor(props = {}) {\n            super();\n            this.props = props;\n        }\n        setProps(props) {\n            Object.assign(this.props, props);\n            if (this.deck) {\n                this.deck.setProps(props);\n            }\n        }\n        pickObject(params) {\n            return this.deck && this.deck.pickObject(params);\n        }\n        pickMultipleObjects(params) {\n            return this.deck && this.deck.pickMultipleObjects(params);\n        }\n        pickObjects(params) {\n            return this.deck && this.deck.pickObjects(params);\n        }\n        finalize() {\n            destroyDeckInstance(this.deck, Events);\n        }\n        // Set up DOM elements, and use setHtmlElement to bind it with the overlay.\n        onAdd() {\n            this.container = createContainer(this.props.style);\n            // Add the container to the overlay\n            this.setHtmlElement(this.container);\n        }\n        // Perform custom operations after adding the overlay to the map.\n        onLoad() {\n            const map = this.getMap();\n            this.deck = createDeckInstance(map, this, this.props, Events);\n        }\n        // Remove all event handlers from the map.\n        onRemove() {\n            destroyDeckInstance(this.deck, Events);\n            this.deck = null;\n        }\n        redraw() {\n            const map = this.getMap();\n            const { deck } = this;\n            const mapType = map.getMapTypeId();\n            const canSyncWithMap = mapType !== MapTypeId.streetside && mapType !== MapTypeId.birdseye;\n            deck.setProps({\n                ...getViewState(map),\n                layerFilter: canSyncWithMap ? this.props.layerFilter : HIDE_ALL_LAYERS\n            });\n            // deck.redraw();\n        }\n    }\n    return DeckOverlay;\n}\n", "// deck.gl-community\n// SPDX-License-Identifier: MIT\n// Copyright (c) vis.gl contributors\nimport getDeckOverlay from './deck-overlay';\nconst BING_MAPS_API_URL = 'https://www.bing.com/api/maps/mapcontrol?callback=__loadBingMaps';\nexport default function loadModule(moduleNames) {\n    return new Promise((resolve) => {\n        // Callback\n        window.__loadBingMaps = () => {\n            const namespace = window.Microsoft.Maps;\n            namespace.DeckOverlay = getDeckOverlay(namespace);\n            delete window.__loadBingMaps;\n            if (moduleNames) {\n                Promise.all(moduleNames.map((m) => awaitCallback(namespace.loadModule, m))).then(() => resolve(namespace));\n            }\n            else {\n                resolve(namespace);\n            }\n        };\n        const script = document.createElement('script');\n        script.type = 'text/javascript';\n        script.src = BING_MAPS_API_URL;\n        const head = document.querySelector('head');\n        head.appendChild(script);\n    });\n}\nfunction awaitCallback(func, ...args) {\n    return new Promise((resolve) => {\n        func(...args, resolve);\n    });\n}\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/index.d.ts

@@ -0,0 +1 @@
+export { default as loadModule } from './load-module';

package/dist/index.js

@@ -0,0 +1,4 @@
+// deck.gl-community
+// SPDX-License-Identifier: MIT
+// Copyright (c) vis.gl contributors
+export { default as loadModule } from './load-module';

package/dist/load-module.d.ts

@@ -0,0 +1,9 @@
+declare global {
+    interface Window {
+        __loadBingMaps: (() => void) | undefined;
+        Microsoft: {
+            Maps: any;
+        };
+    }
+}
+export default function loadModule(moduleNames?: string[]): Promise<unknown>;

package/dist/load-module.js

@@ -0,0 +1,31 @@
+// deck.gl-community
+// SPDX-License-Identifier: MIT
+// Copyright (c) vis.gl contributors
+import getDeckOverlay from './deck-overlay';
+const BING_MAPS_API_URL = 'https://www.bing.com/api/maps/mapcontrol?callback=__loadBingMaps';
+export default function loadModule(moduleNames) {
+    return new Promise((resolve) => {
+        // Callback
+        window.__loadBingMaps = () => {
+            const namespace = window.Microsoft.Maps;
+            namespace.DeckOverlay = getDeckOverlay(namespace);
+            delete window.__loadBingMaps;
+            if (moduleNames) {
+                Promise.all(moduleNames.map((m) => awaitCallback(namespace.loadModule, m))).then(() => resolve(namespace));
+            }
+            else {
+                resolve(namespace);
+            }
+        };
+        const script = document.createElement('script');
+        script.type = 'text/javascript';
+        script.src = BING_MAPS_API_URL;
+        const head = document.querySelector('head');
+        head.appendChild(script);
+    });
+}
+function awaitCallback(func, ...args) {
+    return new Promise((resolve) => {
+        func(...args, resolve);
+    });
+}

package/dist/utils.d.ts

@@ -0,0 +1,13 @@
+import { Deck } from '@deck.gl/core';
+export declare function createContainer(style: any): HTMLCanvasElement;
+export declare function createDeckInstance(map: any, overlay: any, props: any, Events: any): Deck<null>;
+export declare function getViewState(map: any): {
+    width: any;
+    height: any;
+    viewState: {
+        longitude: any;
+        latitude: any;
+        zoom: number;
+    };
+};
+export declare function destroyDeckInstance(deck: any, Events: any): void;

package/dist/utils.js

@@ -0,0 +1,106 @@
+// deck.gl-community
+// SPDX-License-Identifier: MIT
+// Copyright (c) vis.gl contributors
+import { Deck, MapView } from '@deck.gl/core';
+export function createContainer(style) {
+    const container = document.createElement('canvas');
+    Object.assign(container.style, {
+        position: 'absolute',
+        zIndex: 0,
+        // block deck.gl's own event listeners
+        pointerEvents: 'none',
+        left: 0,
+        top: 0
+    }, style);
+    return container;
+}
+const mouseEvents = ['click', 'dblclick', 'mousedown', 'mousemove', 'mouseout'];
+const redrawEvents = ['viewchange', 'mapresize', 'maptypechanged'];
+export function createDeckInstance(map, overlay, props, Events) {
+    const eventListeners = {};
+    const deck = new Deck({
+        ...props,
+        canvas: overlay.container,
+        views: new MapView({ repeat: true }),
+        ...getViewState(map),
+        controller: false,
+        userData: {
+            _map: map,
+            _eventListeners: eventListeners
+        },
+        onLoad: () => {
+            // TODO: .tooltip is protected, find another  way to set this.
+            // Bing Maps' label canvas has z-index of 20000
+            // deck.tooltip.el.style.zIndex = 30000;
+            if (props.onLoad) {
+                props.onLoad();
+            }
+        }
+    });
+    // Register event listeners
+    for (const eventType of mouseEvents) {
+        eventListeners[eventType] = Events.addHandler(map, eventType, (evt) => handleMouseEvent(deck, eventType, evt));
+    }
+    for (const eventType of redrawEvents) {
+        eventListeners[eventType] = Events.addHandler(map, eventType, () => overlay.redraw());
+    }
+    return deck;
+}
+export function getViewState(map) {
+    const zoom = map.getZoom();
+    const center = map.getCenter();
+    const width = map.getWidth();
+    const height = map.getHeight();
+    return {
+        width,
+        height,
+        viewState: {
+            longitude: center.longitude,
+            latitude: center.latitude,
+            zoom: zoom - 1
+        }
+    };
+}
+export function destroyDeckInstance(deck, Events) {
+    if (!deck)
+        return;
+    const eventListeners = deck.props.userData._eventListeners;
+    for (const eventType in eventListeners) {
+        Events.removeHandler(eventListeners[eventType]);
+    }
+    deck.finalize();
+}
+function handleMouseEvent(deck, type, event) {
+    const mockEvent = {
+        type,
+        offsetCenter: {
+            x: deck.props.width / 2 + event.getX(),
+            y: deck.props.height / 2 + event.getY()
+        },
+        srcEvent: event
+    };
+    switch (type) {
+        case 'mousedown':
+            deck._onPointerDown(mockEvent);
+            break;
+        case 'click':
+            mockEvent.tapCount = 1;
+            deck._onEvent(mockEvent);
+            break;
+        case 'dblclick':
+            mockEvent.type = 'click';
+            mockEvent.tapCount = 2;
+            deck._onEvent(mockEvent);
+            break;
+        case 'mousemove':
+            mockEvent.type = 'pointermove';
+            deck._onPointerMove(mockEvent);
+            break;
+        case 'mouseout':
+            mockEvent.type = 'pointerleave';
+            deck._onPointerMove(mockEvent);
+            break;
+        default:
+            return;
+    }
+}

package/package.json

@@ -0,0 +1,42 @@
+{
+  "name": "@deck.gl-community/bing-maps",
+  "description": "deck.gl integration with Bing Maps",
+  "license": "MIT",
+  "version": "9.0.1",
+  "publishConfig": {
+    "access": "public"
+  },
+  "keywords": [
+    "webgl",
+    "visualization",
+    "bing maps"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/visgl/deck.gl-community.gl.git"
+  },
+  "type": "module",
+  "sideEffects": false,
+  "types": "./dist/index.d.ts",
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.js",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "require": "./dist/index.cjs",
+      "import": "./dist/index.js"
+    }
+  },
+  "files": [
+    "dist",
+    "src"
+  ],
+  "scripts": {
+    "test": "vitest run",
+    "test-watch": "vitest"
+  },
+  "dependencies": {
+    "@deck.gl/core": "^9.0.12"
+  },
+  "gitHead": "646f8328d27d67d596f05c9154072051ec5cf4f0"
+}

package/src/deck-overlay.ts

@@ -0,0 +1,72 @@
+// deck.gl-community
+// SPDX-License-Identifier: MIT
+// Copyright (c) vis.gl contributors
+
+import {createContainer, createDeckInstance, destroyDeckInstance, getViewState} from './utils';
+
+const HIDE_ALL_LAYERS = () => false;
+
+export default function getDeckOverlay({CustomOverlay, Events, MapTypeId}) {
+  class DeckOverlay extends CustomOverlay {
+    constructor(props = {}) {
+      super();
+      this.props = props;
+    }
+
+    setProps(props) {
+      Object.assign(this.props, props);
+      if (this.deck) {
+        this.deck.setProps(props);
+      }
+    }
+
+    pickObject(params) {
+      return this.deck && this.deck.pickObject(params);
+    }
+
+    pickMultipleObjects(params) {
+      return this.deck && this.deck.pickMultipleObjects(params);
+    }
+
+    pickObjects(params) {
+      return this.deck && this.deck.pickObjects(params);
+    }
+
+    finalize() {
+      destroyDeckInstance(this.deck, Events);
+    }
+
+    // Set up DOM elements, and use setHtmlElement to bind it with the overlay.
+    onAdd() {
+      this.container = createContainer(this.props.style);
+      // Add the container to the overlay
+      this.setHtmlElement(this.container);
+    }
+
+    // Perform custom operations after adding the overlay to the map.
+    onLoad() {
+      const map = this.getMap();
+      this.deck = createDeckInstance(map, this, this.props, Events);
+    }
+
+    // Remove all event handlers from the map.
+    onRemove() {
+      destroyDeckInstance(this.deck, Events);
+      this.deck = null;
+    }
+
+    redraw() {
+      const map = this.getMap();
+      const {deck} = this;
+      const mapType = map.getMapTypeId();
+      const canSyncWithMap = mapType !== MapTypeId.streetside && mapType !== MapTypeId.birdseye;
+      deck.setProps({
+        ...getViewState(map),
+        layerFilter: canSyncWithMap ? this.props.layerFilter : HIDE_ALL_LAYERS
+      });
+      // deck.redraw();
+    }
+  }
+
+  return DeckOverlay;
+}

package/src/index.ts

@@ -0,0 +1,5 @@
+// deck.gl-community
+// SPDX-License-Identifier: MIT
+// Copyright (c) vis.gl contributors
+
+export {default as loadModule} from './load-module';

package/src/load-module.ts

@@ -0,0 +1,45 @@
+// deck.gl-community
+// SPDX-License-Identifier: MIT
+// Copyright (c) vis.gl contributors
+
+import getDeckOverlay from './deck-overlay';
+
+const BING_MAPS_API_URL = 'https://www.bing.com/api/maps/mapcontrol?callback=__loadBingMaps';
+
+declare global {
+  interface Window {
+    __loadBingMaps: (() => void) | undefined;
+    Microsoft: {Maps: any};
+  }
+}
+
+export default function loadModule(moduleNames?: string[]) {
+  return new Promise((resolve) => {
+    // Callback
+    window.__loadBingMaps = () => {
+      const namespace: any = window.Microsoft.Maps;
+      namespace.DeckOverlay = getDeckOverlay(namespace);
+      delete window.__loadBingMaps;
+
+      if (moduleNames) {
+        Promise.all(moduleNames.map((m) => awaitCallback(namespace.loadModule, m))).then(() =>
+          resolve(namespace)
+        );
+      } else {
+        resolve(namespace);
+      }
+    };
+
+    const script = document.createElement('script');
+    script.type = 'text/javascript';
+    script.src = BING_MAPS_API_URL;
+    const head = document.querySelector('head');
+    head.appendChild(script);
+  });
+}
+
+function awaitCallback(func: Function, ...args: unknown[]) {
+  return new Promise((resolve) => {
+    func(...args, resolve);
+  });
+}

package/src/utils.ts

@@ -0,0 +1,136 @@
+// deck.gl-community
+// SPDX-License-Identifier: MIT
+// Copyright (c) vis.gl contributors
+
+import {Deck, MapView} from '@deck.gl/core';
+
+export function createContainer(style) {
+  const container = document.createElement('canvas');
+  Object.assign(
+    container.style,
+    {
+      position: 'absolute',
+      zIndex: 0,
+      // block deck.gl's own event listeners
+      pointerEvents: 'none',
+      left: 0,
+      top: 0
+    },
+    style
+  );
+  return container;
+}
+
+const mouseEvents = ['click', 'dblclick', 'mousedown', 'mousemove', 'mouseout'];
+const redrawEvents = ['viewchange', 'mapresize', 'maptypechanged'];
+
+export function createDeckInstance(map, overlay, props, Events) {
+  const eventListeners = {};
+
+  const deck = new Deck({
+    ...props,
+    canvas: overlay.container,
+
+    views: new MapView({repeat: true}),
+    ...getViewState(map),
+    controller: false,
+    userData: {
+      _map: map,
+      _eventListeners: eventListeners
+    },
+    onLoad: () => {
+      // TODO: .tooltip is protected, find another  way to set this.
+      // Bing Maps' label canvas has z-index of 20000
+      // deck.tooltip.el.style.zIndex = 30000;
+      if (props.onLoad) {
+        props.onLoad();
+      }
+    }
+  });
+
+  // Register event listeners
+  for (const eventType of mouseEvents) {
+    eventListeners[eventType] = Events.addHandler(map, eventType, (evt) =>
+      handleMouseEvent(deck, eventType, evt)
+    );
+  }
+  for (const eventType of redrawEvents) {
+    eventListeners[eventType] = Events.addHandler(map, eventType, () => overlay.redraw());
+  }
+
+  return deck;
+}
+
+export function getViewState(map) {
+  const zoom = map.getZoom();
+  const center = map.getCenter();
+  const width = map.getWidth();
+  const height = map.getHeight();
+
+  return {
+    width,
+    height,
+    viewState: {
+      longitude: center.longitude,
+      latitude: center.latitude,
+      zoom: zoom - 1
+    }
+  };
+}
+
+export function destroyDeckInstance(deck, Events) {
+  if (!deck) return;
+  const eventListeners = deck.props.userData._eventListeners;
+  for (const eventType in eventListeners) {
+    Events.removeHandler(eventListeners[eventType]);
+  }
+  deck.finalize();
+}
+
+interface MockEvent {
+  type: string;
+  offsetCenter: {x: number; y: number};
+  srcEvent: unknown;
+  tapCount?: number;
+}
+
+function handleMouseEvent(deck, type, event) {
+  const mockEvent: MockEvent = {
+    type,
+    offsetCenter: {
+      x: deck.props.width / 2 + event.getX(),
+      y: deck.props.height / 2 + event.getY()
+    },
+    srcEvent: event
+  };
+
+  switch (type) {
+    case 'mousedown':
+      deck._onPointerDown(mockEvent);
+      break;
+
+    case 'click':
+      mockEvent.tapCount = 1;
+      deck._onEvent(mockEvent);
+      break;
+
+    case 'dblclick':
+      mockEvent.type = 'click';
+      mockEvent.tapCount = 2;
+      deck._onEvent(mockEvent);
+      break;
+
+    case 'mousemove':
+      mockEvent.type = 'pointermove';
+      deck._onPointerMove(mockEvent);
+      break;
+
+    case 'mouseout':
+      mockEvent.type = 'pointerleave';
+      deck._onPointerMove(mockEvent);
+      break;
+
+    default:
+      return;
+  }
+}