@aibee/owlly 1.0.25 → 1.0.29

package/lib/owlly/element/map-kit/shape.js

@@ -0,0 +1,189 @@
+import UUID from 'uuid-js';
+import Bezier from 'bezier-js';
+import { GeometryUtils } from '../../utils/geometry-utils';
+/**
+ * PathCommand
+ * @ignore
+ */
+var PathCommand;
+(function (PathCommand) {
+    PathCommand["MOVE"] = "m";
+    PathCommand["LINE"] = "l";
+    PathCommand["CURVE"] = "c";
+})(PathCommand || (PathCommand = {}));
+class ShapeUtils {
+    static GenerateStepsFromPath(path) {
+        const commands = path.match(/([MLCmlc](?:(?:-?\d+(?:\.\d+)?(?:[eE]\d+)?)(?:,-?\d+(?:\.\d+)?(?:[eE]\d+)?)+))/g);
+        if (!commands)
+            return [];
+        const steps = commands.map((command) => {
+            const c = command[0].toLowerCase();
+            const coordStrings = command.slice(1).split(',');
+            const coordCount = coordStrings.length;
+            const coords = [];
+            for (let i = 0; i < coordCount; i += 2) {
+                coords.push([
+                    parseFloat(coordStrings[i]),
+                    parseFloat(coordStrings[i + 1]),
+                ]);
+            }
+            return { command: c, coords };
+        });
+        for (let i = 1; i < steps.length; i++) {
+            const q = steps[i - 1];
+            const h = steps[i];
+            if (q.command === h.command && q.coords[0] === h.coords[0] && q.coords[1] === h.coords[i]) {
+                steps.splice(i, 1);
+                i--;
+            }
+        }
+        return steps;
+    }
+    static GeneratePathFromSteps(steps) {
+        return steps.map(({ command, coords }) => (`${command}${coords.flat(2).join(',')}`)).join('');
+    }
+    static ParseHollows(hollowString) {
+        const result = [];
+        const indices = hollowString.split(',');
+        const l = indices.length;
+        for (let i = 0; i < l; i += 2) {
+            if (indices[i].length && indices[i + 1].length) {
+                result.push([parseInt(indices[i], 10), parseInt(indices[i + 1], 10)]);
+            }
+        }
+        return result;
+    }
+    static UnparseHollows(hollows) {
+        return hollows.flat(2).join(',');
+    }
+    static PolyonOfPathStep(pathSteps) {
+        const ret = [];
+        let loop = [];
+        pathSteps.forEach((pathStep) => {
+            if (pathStep.command === PathCommand.MOVE) {
+                if (loop && loop.length > 0) {
+                    if (loop.length > 2)
+                        loop.push(loop[0]);
+                    ret.push(loop);
+                }
+                loop = [...pathStep.coords];
+            }
+            else if (pathStep.command === PathCommand.LINE) {
+                loop.push(...pathStep.coords);
+            }
+            else if (pathStep.command === PathCommand.CURVE) {
+                const coords = [];
+                pathStep.coords.forEach((coord) => {
+                    coords.push(...coord);
+                });
+                const bezier = new Bezier(coords);
+                const points = bezier.getLUT(10);
+                // console.info(points);
+                points.forEach((point) => {
+                    loop.push([point.x, point.y]);
+                });
+                // loop.push(pathStep.coords[0]);
+                // loop.push(pathStep.coords[pathStep.coords.length - 1]);
+            }
+        });
+        if (loop && loop.length > 0) {
+            if (loop.length > 2)
+                loop.push(loop[0]);
+            ret.push(loop);
+        }
+        return ret;
+    }
+    static PolygonOfShape(shape) {
+        const pathSteps = shape.getSteps();
+        return ShapeUtils.PolyonOfPathStep(pathSteps);
+    }
+}
+/**
+ * 图形, 用作地图图形描述
+ * @noInheritDoc
+ */
+class Shape {
+    /**
+     * @param data 基于ShapeData结构的描述.
+     * @param autoCalculateCentroid 自动计算图形的视觉中心.
+     * @example
+     * ```typescript
+     * // 将svg解析为Shape对象数组
+     * const shapes = await SvgUtils.parseSVG(
+     *   <svg url>,
+     *   [0.02, 0, 0, 0, 0, -0.02, 0, 0, 0, 0, 0, 0, -40, 40, 0, 1], // 对齐矩阵
+     * );
+     * // 也可以直接传入配置生成shape
+     * const shape = new Shape({ path: 'm0,0l1,0l1,1l0,1' }); // 正方形
+     * // 或
+     * shape.updateData({ fill: '#ff0000' });
+     * ```
+     */
+    constructor(data, autoCalculateCentroid = true) {
+        this.data = {
+            id: UUID.create().toString(),
+            x: 0,
+            y: 0,
+            radius: 0,
+            zIndex: 0,
+            centroid: [0, 0],
+            height: 1,
+            shapeType: 'point',
+            path: '',
+            hollows: '',
+            fill: '#ffffff',
+            stroke: '#444444',
+            strokeWidth: 1,
+            opacity: 1,
+            fillOpacity: 1.0,
+            strokeOpacity: 0.2,
+            scale: [0, 0, 0],
+            rotation: [0, 0, 0, 1],
+            tag: '',
+            parentName: '',
+        };
+        if (data)
+            this.updateData(data, autoCalculateCentroid);
+    }
+    /**
+     * 更新图形数据
+     * @param data 基于ShapeData结构的描述
+     */
+    updateData(data, autoCalculateCentroid = false) {
+        Object.assign(this.data, data);
+        this.steps = ShapeUtils.GenerateStepsFromPath(this.data.path);
+        if (this.data.shapeType === 'shape')
+            this.hollows = ShapeUtils.ParseHollows(this.data.hollows);
+        if (this.steps.length <= 2 || !autoCalculateCentroid)
+            return;
+        const polygon = ShapeUtils.PolygonOfShape(this);
+        if (polygon && polygon.length > 2) {
+            this.data.centroid = GeometryUtils.CentroidForPOI(polygon);
+            // this.data.centroid = GeometryUtils.Centroid(polygon[0]);
+        }
+    }
+    updatePathFromSelfSteps() {
+        if (this.data.shapeType === 'point')
+            return;
+        this.data.path = this.steps.map((step) => (`${step.command}${step.coords.join(',')}`)).join('');
+    }
+    /**
+     * 获得图形数据
+     */
+    getData() {
+        return this.data;
+    }
+    /** @ignore */
+    getHollows() {
+        return this.hollows;
+    }
+    /** @ignore */
+    getSteps() {
+        return this.steps;
+    }
+    /** 获得图形类型 */
+    getShapeType() {
+        return this.data.shapeType;
+    }
+}
+export { Shape, PathCommand, ShapeUtils, };

package/lib/owlly/element/mesh-element.d.ts

@@ -0,0 +1,22 @@
+import { NS_THREE } from '../stage/externals';
+import { Element, ElementFrameContext } from './element';
+import { View } from '../view/view';
+/**
+ * Mesh 元素, 需要顶点信息以渲染
+ */
+declare class MeshElement extends Element {
+    private initialized;
+    private loaded;
+    private group;
+    private eventListeners;
+    constructor(vertices: NS_THREE.Vector3[], triangles: number[], optionalParams?: {
+        material?: NS_THREE.Material;
+        fillColor?: NS_THREE.Color | string | number;
+        opacity?: number;
+        transparent?: boolean;
+    });
+    setOnCurrentViewChanged(func: (view: View) => void): void;
+    update(): ElementFrameContext;
+    dispose(): void;
+}
+export { MeshElement };

package/lib/owlly/element/mesh-element.js

@@ -0,0 +1,63 @@
+import { Externals } from '../stage/externals';
+import { Element, ElementFrameContext } from './element';
+import { BasicTools } from '../utils/basic-tools';
+/**
+ * Mesh 元素, 需要顶点信息以渲染
+ */
+class MeshElement extends Element {
+    constructor(vertices, triangles, optionalParams) {
+        super();
+        const { THREE } = Externals.getInstance();
+        const options = optionalParams || {};
+        this.group = new THREE.Group();
+        this.add(this.group);
+        const material = options.material || new THREE.MeshBasicMaterial({
+            color: options.fillColor ? options.fillColor : 0x00ff00,
+            transparent: options.transparent !== undefined ? options.transparent : false,
+            opacity: options.opacity !== undefined ? options.opacity : 1,
+            side: THREE.DoubleSide,
+            depthWrite: true,
+        });
+        const plainVertices = [];
+        vertices.forEach((vertex) => { plainVertices.push(vertex.x, vertex.y, vertex.z); });
+        const vertexBuffer = new Float32Array(plainVertices);
+        const bufferGeometry = new THREE.BufferGeometry();
+        bufferGeometry.setAttribute('position', new THREE.BufferAttribute(vertexBuffer, 3));
+        bufferGeometry.setIndex(triangles);
+        const mesh = new THREE.Mesh(bufferGeometry, material);
+        mesh.renderOrder = 1000;
+        this.group.add(mesh);
+        this.initialized = false;
+        this.loaded = true;
+    }
+    setOnCurrentViewChanged(func) {
+        // if (this.eventListeners && this.eventListeners.onCurrentViewChanged) {
+        //   EventHub.off(OwllyEvents.RENDERING_VIEW_CHANGED, this.eventListeners.onCurrentViewChanged);
+        // }
+        this.eventListeners = {
+            onCurrentViewChanged: func,
+        };
+        // EventHub.on(OwllyEvents.RENDERING_VIEW_CHANGED, this.eventListeners.onCurrentViewChanged);
+    }
+    // renderingViewChanged(view: View): void {
+    //   if (this.eventListeners && this.eventListeners.onCurrentViewChanged) {
+    //     this.eventListeners.onCurrentViewChanged(view);
+    //   }
+    // }
+    update() {
+        const frameContext = new ElementFrameContext(this);
+        if (!this.initialized && this.loaded) {
+            this.initialized = true;
+            frameContext.needUpdate = true;
+        }
+        if (this.initialized && !this.parent) {
+            frameContext.shouldPlaceElement = true;
+        }
+        return frameContext;
+    }
+    dispose() {
+        super.dispose();
+        BasicTools.dispose(this, true);
+    }
+}
+export { MeshElement };

package/lib/owlly/element/mesh-line-2d.d.ts

@@ -0,0 +1,82 @@
+import Color from 'color';
+import { NS_THREE } from '../stage/externals';
+import { Element, ElementFrameContext } from './element';
+import { PathOverlay2 } from '../overlay/path-overlay2';
+declare class MeshLine2D extends Element {
+    tailArrow: NS_THREE.Mesh;
+    private initialized;
+    private ready;
+    renderPixelLine: boolean;
+    private needsUpdate;
+    private points;
+    orgedPoints: {
+        point: [number, number, number];
+        normal: number[];
+        scale: number;
+    }[];
+    private distances;
+    private mesh;
+    private bufferGeometry;
+    private material;
+    private currentMoveIndex;
+    private parentOverlay;
+    private viewWidth;
+    private viewHeight;
+    private options;
+    private uniforms;
+    private static VertexShader;
+    private static FragmentShader;
+    constructor(points: [number, number, number][], options?: {
+        renderPixelLine?: boolean;
+        fillOpacity?: number;
+        textureUrl?: string;
+        textureMode?: string;
+        textureSize?: [number, number];
+        color?: Color | number | string;
+        viewDistance?: number;
+        gradientDistance?: number;
+        current?: number;
+        gradientEnabled?: boolean;
+        width?: number;
+        strokeWidth?: number;
+        strokeColor?: Color | number | string;
+        animateEnabled?: boolean;
+        animateSpeed?: number;
+    });
+    calcPoints(points: [number, number, number][], scale?: number): number[][];
+    createTailArrow(): void;
+    orgPoints(points: [number, number, number][], nScale?: number): {
+        point: [number, number, number];
+        normal: number[];
+        scale: number;
+    }[];
+    private init;
+    setContainer(container: HTMLElement): void;
+    resize(containerWidth: number, containerHeight: number): void;
+    getBestView(currentPoint: NS_THREE.Vector3, fromDistance: number, toDistance: number): number;
+    getPointOnDistance(distance: number): {
+        point: NS_THREE.Vector3;
+        index: number;
+    };
+    getNearestPoint(position: NS_THREE.Vector3, startDistance?: number): {
+        point: NS_THREE.Vector3;
+        distance: number;
+        index: number;
+    };
+    getPathWithScope(startDistance: number, endDistance: number): [number, number, number][];
+    getPathBaseStartPoint(distance: number): [number, number, number][];
+    update(): ElementFrameContext;
+    dispose(): void;
+    setCurrent(current: number): void;
+    getLength(): number;
+    setCurrentIndex(currentIndex: number): void;
+    getCurrent(): number;
+    getCurrentIndex(): number;
+    setViewDistance(value: number): void;
+    updateTailArrowPos(distance: number): void;
+    setWidth(width: number): void;
+    setColor(color: number | string): void;
+    getViewDistance(): number;
+    setParentOverlay(parent: PathOverlay2): void;
+}
+export { MeshLine2D };