@aibee/owlly 1.0.25 → 1.0.29

package/lib/owlly/overlay/path-overlay2.js

@@ -0,0 +1,118 @@
+/* eslint-disable */
+import { Externals } from '../stage/externals';
+import { Overlay } from './overlay';
+import { MeshLine2D } from '../element';
+/**
+ * POI覆盖层, 画线用
+ * @example
+ * ```typescript
+ * const PathOverlay2 = new PathOverlay2();
+ * // 任意View
+ * view.addOverlay(PathOverlay2);
+ * ```
+ */
+class PathOverlay2 extends Overlay {
+    constructor() {
+        super();
+        this.pathMap = new Map();
+        this.renderThisFrame = true;
+        PathOverlay2.instanceId = 0;
+    }
+    init(parent) {
+        const { THREE } = Externals.getInstance();
+        this.parent = parent;
+        this.scene = new THREE.Scene();
+        this.camera = this.parent.camera;
+        this.renderer = this.parent.renderer;
+        this.pathMap = new Map();
+        this.enabled = true;
+        this.renderThisFrame = true;
+    }
+    update() {
+        let paths = [];
+        Array.from(this.pathMap).forEach(([name, pathGroup]) => {
+            paths = [...paths, ...Array.from(pathGroup)];
+        });
+        const pathNeedUpdate = paths.reduce((tf, e) => (this.handleElementUpdate(e.update()) || tf), false);
+        if (this.renderThisFrame || pathNeedUpdate) {
+            this.renderThisFrame = false;
+            return true;
+        }
+        return false;
+    }
+    handleElementUpdate(context) {
+        return context.needUpdate;
+    }
+    render() {
+        if (!this.enabled)
+            return;
+        this.resize(this.parent.getViewWidth(), this.parent.getViewHeight());
+        this.renderer.clearDepth();
+        this.renderer.render(this.scene, this.camera);
+    }
+    resize(containerWidth, containerHeight) {
+        this.pathMap.forEach((pathGroup) => {
+            for (let path of pathGroup) {
+                path.resize(containerWidth, containerHeight);
+            }
+        });
+    }
+    setEnabled(value) {
+        this.enabled = value;
+    }
+    createPath(points, options, ifClear = false) {
+        if (ifClear) {
+            this.clearPaths();
+        }
+        if (!this.scene)
+            throw Error('pathOverlay need bind a view, use view.addOverlay()');
+        const pathGroup = new Set();
+        this.renderThisFrame = true;
+        PathOverlay2.instanceId++;
+        if (options.strokeWidth && options.strokeColor) {
+            const borPath = new MeshLine2D(points, Object.assign(Object.assign({}, options), { strokeWidth: 0, width: (options.width + options.strokeWidth * 2), color: options.strokeColor, renderPixelLine: true }));
+            const borName = `border_${PathOverlay2.instanceId}`;
+            borPath.name = borName;
+            pathGroup.add(borPath);
+            this.scene.add(borPath);
+        }
+        const path = new MeshLine2D(points, Object.assign(Object.assign({}, options), { strokeWidth: 0, renderPixelLine: true }));
+        const pathId = PathOverlay2.instanceId;
+        const name = pathId + '';
+        path.name = name;
+        pathGroup.add(path);
+        this.scene.add(path);
+        // // console.log('path.testLines.', path.testLines)
+        // path.testLines.forEach((v: any) => {
+        //   this.scene.add(v);
+        // })
+        this.pathMap.set(name, pathGroup);
+        return pathGroup;
+    }
+    removePath(path) {
+        const name = path.name;
+        const curPathGroup = this.pathMap.get(name);
+        if (curPathGroup) {
+            for (let path of curPathGroup) {
+                this.scene.remove(path);
+                path.dispose();
+            }
+            this.pathMap.delete(name);
+            this.renderThisFrame = true;
+        }
+    }
+    clearPaths() {
+        this.pathMap.forEach((pathGroup) => {
+            for (let path of pathGroup) {
+                this.scene.remove(path);
+                path.dispose();
+            }
+        });
+        this.pathMap.clear();
+        this.renderThisFrame = true;
+    }
+    dispose() {
+        this.clearPaths();
+    }
+}
+export { PathOverlay2 };

package/lib/owlly/overlay/poi-overlay-3d.d.ts

@@ -0,0 +1,278 @@
+import { Euler } from 'three';
+import { NS_THREE } from '../stage/externals';
+import { Overlay } from './overlay';
+import { View } from '../view/view';
+/**
+ * POI元素, 包含一个图标与一段文字
+ * @example
+ * ```typescript
+ * const poiOverlay = new PoiOverlay();
+ * const poi = poiOverlay.createPoi(new Vector3(0, 0, 0));
+ * ```
+ */
+interface Rect {
+    xMin: number;
+    xMax: number;
+    yMin: number;
+    yMax: number;
+}
+/**
+ * POI覆盖层, 可以展示POI图标与文字, 存在图标时以图标中心为中心, 否则为文字中心
+ * @example
+ * ```typescript
+ * const poiOverlay = new PoiOverlay();
+ * // 任意View
+ * view.addOverlay(poiOverlay);
+ * ```
+ */
+declare class Poi3DOverlay extends Overlay {
+    static canvas: HTMLCanvasElement;
+    static ctx: CanvasRenderingContext2D;
+    private parent;
+    private rectMap;
+    private pois;
+    private mouseState;
+    private mousePositionBuffer;
+    private eventTarget;
+    private enabled;
+    private renderThisFrame;
+    private visible;
+    camera: NS_THREE.Camera;
+    scene: NS_THREE.Scene;
+    renderCamera: NS_THREE.OrthographicCamera;
+    renderer: NS_THREE.WebGL1Renderer;
+    orderPois: Function;
+    prevPosition: NS_THREE.Vector3 | null;
+    prevQuaternion: NS_THREE.Quaternion | null;
+    prevZoom: any;
+    private needRender;
+    private listeners;
+    constructor(canvas?: HTMLCanvasElement);
+    init(parent: View): void;
+    update(): boolean;
+    forceRenderInThisFrame(): void;
+    render(): void;
+    orderPoisByLevel(): void;
+    recalculateVisibilities(pois: Poi3D[]): void;
+    checkUpdate(): void;
+    dispose(): void;
+    private onPointerDown;
+    private onPointerUp;
+    private onTouchStart;
+    private onTouchEnd;
+    private onNodePointerDown;
+    /**
+     * 新建POI
+     * @param position POI在3D空间中的位置
+     */
+    createPoi(position: NS_THREE.Vector3): Poi3D;
+    setRectMap(rect: Rect, ele: Poi3D): void;
+    /**
+     * 删除POI
+     * @param poi 待删除的POI
+     */
+    removePoi(poi: Poi3D): void;
+    clearPoi(): void;
+    /**
+     * 设置覆盖层可见性 兼容旧poi
+     * @param visible 覆盖层是否可见
+     */
+    setVisibility(visible: boolean): void;
+    setEnabled(value: boolean): void;
+    resize(viewWidth: number, viewHeight: number): void;
+    private updateCameraAspect;
+}
+declare class Poi3D {
+    static ImageMaterialMap: Map<any, any>;
+    private position;
+    private screenPosition;
+    private visible;
+    private hide;
+    private parent;
+    private subHide;
+    private textVisibility;
+    private iconVisibility;
+    private animationEnabled;
+    isInFrustum: boolean;
+    private textPosInfo;
+    private iconPosInfo;
+    private autoRotation;
+    private rotation;
+    collision: boolean;
+    private boundingBox;
+    private overlapArea;
+    collisionMode: string;
+    private withBoundingBox;
+    private subAreaOpacity;
+    private abandonedAreaOpacity;
+    private visiblePartWhenCollision;
+    private boundingRect;
+    private outerRect;
+    private iconCircleOptions;
+    private iconInCircle;
+    private iconRect;
+    private textRect;
+    private visibilityAnimation;
+    private textWidth;
+    private textHeight;
+    private iconSize;
+    private textMaterial;
+    private iconMaterial;
+    private iconCircleMaterial;
+    private rectMaterial;
+    private text;
+    private icon;
+    group: NS_THREE.Group | null;
+    poiId: number;
+    private iconOptions;
+    private labelOptions;
+    private rectOptions;
+    private withRect;
+    private rect;
+    private level;
+    private dpr;
+    private isFlipY;
+    private _renderThisFrame;
+    private labelOpacity;
+    private iconOpacity;
+    private set renderThisFrame(value);
+    private get renderThisFrame();
+    constructor(position?: NS_THREE.Vector3);
+    dispose(): void;
+    setParent(parent: Poi3DOverlay): void;
+    setPosition(position: NS_THREE.Vector3, tolerance?: number): void;
+    setOpacity(labelOpacity?: number, iconOpacity?: number): void;
+    /**
+     * 设置旋转角度
+     * @param rotation 旋转角度
+     */
+    setRotation(rotation: number, tolerance?: number): void;
+    /**
+     * 设置是否碰撞
+     * @param collision 是否碰撞
+     */
+    setCollision(collision: boolean): void;
+    /**
+     * 设置碰撞模式
+     * @param mode 碰撞模式 label || icon || outer(默认)
+     */
+    setCollisionMode(mode: string): void;
+    setLabelVisibility(visible: boolean): void;
+    setIconVisiblity(visible: boolean): void;
+    setHideModeWhenCollision(mode: string): void;
+    setVisiblePartWhenCollision(part: string): void;
+    setCollisionOverlap(x: number, y: number): void;
+    /**
+       * 设置POI层级
+       * @param level 层级
+       */
+    setLevel(level: number, forceOrder?: boolean): void;
+    /**
+       * 获取POI层级
+       */
+    getLevel(): number;
+    /**
+       * 设置POI可见性
+       * @param visible 可见性
+       */
+    setVisibility(visible: boolean): void;
+    /**
+       * 设置POI是否暂时隐藏
+       * @param hide true 全部隐藏 false: 根据 hideModeWhenCollision 做显隐判断
+       */
+    setHidden(hide: boolean, subHide?: boolean): void;
+    /**
+       * 设置Rect是否可见
+       * @param withRect 可见性
+       */
+    setRect(withRect: boolean): void;
+    /**
+       * 设置Rect默认宽高 未废弃, 不发挥作用
+       * @param withRect 可见性
+       */
+    private setRectDefSize;
+    /**
+       * 设置Rect背景色 未废弃, 不发挥作用
+       * @param color
+       */
+    setRectFill(color: number | string): void;
+    /**
+       * 设置Rect偏移 未废弃, 不发挥作用
+       * @param x
+       * @param y
+       */
+    setRectOffset(x?: number, y?: number): void;
+    setIconImage(src: string): void;
+    setIconSize(width: number, height: number): void;
+    /**
+     * 设置POI中icon的显示
+     */
+    setIconShowInCircle(lineWidth: number, lineColor: string): void;
+    drawIcon(): void;
+    private clearIcon;
+    /**
+       * 设置图标相对(0,0)的位置
+       * @param  direction: x / y  value: + / - 表示方向
+       * x = 2 的时候, 表示label 中心 和 icon 中心 同一条y轴, label 右边框 距离 icon 左边框2个单位
+       */
+    setIconAnchor(anchor: 'center' | 'left' | 'right' | 'top' | 'bottom' | 'topleft' | 'topright' | 'bottomleft' | 'bottomright'): void;
+    /**
+     * 设置图标反转
+     */
+    setIconFlipY(flipY: boolean): void;
+    setIconOffset(x: number, y: number): void;
+    /**
+       * 设置文字字体大小
+       * @param fontSize 字号, 单位为px
+       */
+    setFontSize(fontSize: number): void;
+    setFontPadding(fPadding: number): void;
+    setLabelText(text: string): void;
+    drawText(): void;
+    recalcOffset(width: number, height: number, anchor: string, anchorOffsetX: number, anchorOffsetY: number): {
+        offsetX: number;
+        offsetY: number;
+    };
+    /**
+       * 设置POI文字相对(0,0)的位置。在有icon 和 无icon时锚点不同
+       * @param  direction: x / y  value: + / - 表示方向
+       * x = 2 的时候, 表示label 中心 和 icon 中心 同一条y轴, label 右边框 距离 icon 左边框2个单位
+       */
+    setLabelAnchor(anchor: 'center' | 'left' | 'right' | 'top' | 'bottom' | 'topleft' | 'topright' | 'bottomleft' | 'bottomright'): void;
+    setLabelOffset(x: number, y: number): void;
+    getLabelAnchor(): 'center' | 'left' | 'right' | 'top' | 'bottom' | 'topleft' | 'topright' | 'bottomleft' | 'bottomright';
+    getLabelOffset(): {
+        x: number;
+        y: number;
+    };
+    calcBoundingSize(): void;
+    private drawRect;
+    private drawBoundingBox;
+    setBoundingBox(): void;
+    /** @ignore */
+    getBoundingRect(): {
+        xMin: number;
+        yMin: number;
+        xMax: number;
+        yMax: number;
+    };
+    /** @ignore */
+    getOuterRect(): {
+        xMin: number;
+        yMin: number;
+        xMax: number;
+        yMax: number;
+    };
+    setAnimationEnabled(value: boolean): void;
+    private calcPoiRotation;
+    getVisibility(): boolean;
+    calcPosAndSize(frustum: NS_THREE.Frustum, widthHalf: number, heightHalf: number): {
+        isInFrustum: boolean;
+    };
+    draw(): void;
+    updatePosition(// 根据已计算出的position, offset, visible 等更新渲染位置, 显隐
+    euler: Euler, zoom: number): void;
+    update(): boolean;
+    setPoiId(poiId: number): void;
+}
+export { Poi3DOverlay, Poi3D };