@deck.gl/widgets 9.1.12 → 9.2.0-alpha.1

package/dist/gimbal-widget.js

@@ -0,0 +1,116 @@
+import { jsx as _jsx, jsxs as _jsxs } from "preact/jsx-runtime";
+// deck.gl
+// SPDX-License-Identifier: MIT
+// Copyright (c) vis.gl contributors
+import { Widget, LinearInterpolator } from '@deck.gl/core';
+import { render } from 'preact';
+export class GimbalWidget extends Widget {
+    constructor(props = {}) {
+        super(props, GimbalWidget.defaultProps);
+        this.className = 'deck-widget-gimbal';
+        this.placement = 'top-left';
+        this.viewId = null;
+        this.setProps(this.props);
+    }
+    setProps(props) {
+        this.placement = props.placement ?? this.placement;
+        this.viewId = props.viewId ?? this.viewId;
+        super.setProps(props);
+    }
+    onRenderHTML(rootElement) {
+        const { rotationOrbit, rotationX } = this.getNormalizedRotation();
+        // Note - we use CSS 3D transforms instead of SVG 2D transforms
+        const ui = (_jsx("div", { className: "deck-widget-button", style: { perspective: 100, pointerEvents: 'auto' }, children: _jsxs("button", { type: "button", onClick: () => {
+                    this.resetOrbitView();
+                }, title: this.props.label, style: { position: 'relative', width: 26, height: 26 }, children: [_jsx("svg", { className: "gimbal-outer-ring", width: "100%", height: "100%", viewBox: "0 0 26 26", style: {
+                            position: 'absolute',
+                            top: 0,
+                            left: 0,
+                            transform: `rotateY(${rotationOrbit}deg)`
+                        }, children: _jsx("circle", { cx: "13", cy: "13", r: "10", stroke: "var(--icon-gimbal-outer-color, rgb(68, 92, 204))", strokeWidth: this.props.strokeWidth, fill: "none" }) }), _jsx("svg", { className: "gimbal-inner-ring", width: "100%", height: "100%", viewBox: "0 0 26 26", style: {
+                            position: 'absolute',
+                            top: 0,
+                            left: 0,
+                            transform: `rotateX(${rotationX}deg)`
+                        }, children: _jsx("circle", { cx: "13", cy: "13", r: "7", stroke: "var(--icon-gimbal-inner-color, rgb(240, 92, 68))", strokeWidth: this.props.strokeWidth, fill: "none" }) })] }) }));
+        render(ui, rootElement);
+    }
+    onViewportChange(viewport) {
+        this.updateHTML();
+    }
+    resetOrbitView() {
+        const viewId = this.getViewId();
+        const viewState = this.getViewState(viewId);
+        if ('rotationOrbit' in viewState || 'rotationX' in viewState) {
+            const nextViewState = {
+                ...viewState,
+                rotationOrbit: 0,
+                rotationX: 0,
+                transitionDuration: this.props.transitionDuration,
+                transitionInterpolator: new LinearInterpolator({
+                    transitionProps: ['rotationOrbit', 'rotationX']
+                })
+            };
+            // @ts-ignore Using private method temporary until there's a public one
+            this.deck._onViewStateChange({ viewId, viewState: nextViewState, interactionState: {} });
+        }
+    }
+    getNormalizedRotation() {
+        const viewState = this.getViewState(this.getViewId());
+        const [rz, rx] = this.getRotation(viewState);
+        const rotationOrbit = normalizeAndClampAngle(rz);
+        const rotationX = normalizeAndClampAngle(rx);
+        return { rotationOrbit, rotationX };
+    }
+    getRotation(viewState) {
+        if (viewState && ('rotationOrbit' in viewState || 'rotationX' in viewState)) {
+            return [-(viewState.rotationOrbit || 0), viewState.rotationX || 0];
+        }
+        return [0, 0];
+    }
+    // Move to Widget/WidgetManager?
+    getViewId() {
+        const viewId = this.viewId || 'OrbitView';
+        return viewId;
+    }
+    getViewState(viewId) {
+        const viewManager = this.getViewManager();
+        const viewState = (viewId && viewManager.getViewState(viewId)) || viewManager.viewState;
+        return viewState;
+    }
+    getViewManager() {
+        // @ts-expect-error protected
+        const viewManager = this.deck?.viewManager;
+        if (!viewManager) {
+            throw new Error('wigdet must be added to a deck instance');
+        }
+        return viewManager;
+    }
+}
+GimbalWidget.defaultProps = {
+    ...Widget.defaultProps,
+    id: 'gimbal',
+    placement: 'top-left',
+    viewId: undefined,
+    label: 'Gimbal',
+    strokeWidth: 1.5,
+    transitionDuration: 200
+};
+function normalizeAndClampAngle(angle) {
+    // Bring angle into [-180, 180]
+    let normalized = ((((angle + 180) % 360) + 360) % 360) - 180;
+    // Avoid rotating the gimbal rings to close to 90 degrees as they will visually disappear
+    const AVOID_ANGLE_DELTA = 10;
+    const distanceFrom90 = normalized - 90;
+    if (Math.abs(distanceFrom90) < AVOID_ANGLE_DELTA) {
+        if (distanceFrom90 < AVOID_ANGLE_DELTA) {
+            normalized = 90 + AVOID_ANGLE_DELTA;
+        }
+        else if (distanceFrom90 > -AVOID_ANGLE_DELTA) {
+            normalized = 90 - AVOID_ANGLE_DELTA;
+        }
+    }
+    // Clamp to [-80, 80]
+    return normalized; // Math.max(-80, Math.min(80, normalized));
+}
+//# sourceMappingURL=gimbal-widget.js.map

package/dist/gimbal-widget.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"gimbal-widget.js","sourceRoot":"","sources":["../src/gimbal-widget.tsx"],"names":[],"mappings":"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"}