@idraw/util 0.4.0-beta.4 → 0.4.0-beta.40

package/dist/esm/lib/view-calc.d.ts

@@ -1,4 +1,4 @@
-import { Point, PointSize, Data, ViewScaleInfo, ViewSizeInfo, Element, ElementType, ElementSize, ViewContext2D, ViewRectVertexes } from '@idraw/types';
+import { Point, PointSize, Data, ViewScaleInfo, ViewSizeInfo, Element, ElementType, ElementSize, ViewContext2D, ViewRectVertexes, ViewRectInfo } from '@idraw/types';
 export declare function calcViewScaleInfo(info: {
     scale: number;
     offsetX: number;
@@ -23,11 +23,9 @@ export declare function viewScroll(opts: {
 }): ViewScaleInfo;
 export declare function calcViewElementSize(size: ElementSize, opts: {
     viewScaleInfo: ViewScaleInfo;
-    viewSizeInfo: ViewSizeInfo;
 }): ElementSize;
 export declare function calcViewPointSize(size: PointSize, opts: {
     viewScaleInfo: ViewScaleInfo;
-    viewSizeInfo: ViewSizeInfo;
 }): PointSize;
 export declare function calcViewVertexes(vertexes: ViewRectVertexes, opts: {
     viewScaleInfo: ViewScaleInfo;
@@ -39,6 +37,12 @@ export declare function isViewPointInElement(p: Point, opts: {
     viewScaleInfo: ViewScaleInfo;
     viewSizeInfo: ViewSizeInfo;
 }): boolean;
+export declare function isViewPointInElementSize(p: Point, elemSize: ElementSize, opts?: {
+    includeBorder?: boolean;
+}): boolean;
+export declare function isViewPointInVertexes(p: Point, vertexes: ViewRectVertexes, opts?: {
+    includeBorder?: boolean;
+}): boolean;
 export declare function getViewPointAtElement(p: Point, opts: {
     context2d: ViewContext2D;
     data: Data;
@@ -54,3 +58,12 @@ export declare function isElementInView(elem: ElementSize, opts: {
     viewScaleInfo: ViewScaleInfo;
     viewSizeInfo: ViewSizeInfo;
 }): boolean;
+export declare function calcElementOriginRectInfo(elemSize: ElementSize, opts: {
+    groupQueue: Element<'group'>[];
+}): ViewRectInfo;
+export declare function originRectInfoToRangeRectInfo(originRectInfo: ViewRectInfo): ViewRectInfo;
+export declare function calcElementViewRectInfo(elemSize: ElementSize, opts: {
+    groupQueue: Element<'group'>[];
+    viewScaleInfo: ViewScaleInfo;
+    range?: boolean;
+}): ViewRectInfo;

package/dist/esm/lib/view-calc.js

@@ -1,5 +1,7 @@
 import { rotateElementVertexes } from './rotate';
 import { checkRectIntersect } from './rect';
+import { calcElementVertexesInGroup, calcElementVertexes } from './vertex';
+import { getCenterFromTwoPoints } from './point';
 export function calcViewScaleInfo(info, opts) {
     const { scale, offsetX, offsetY } = info;
     const { viewSizeInfo } = opts;
@@ -86,9 +88,9 @@ export function calcViewVertexes(vertexes, opts) {
     ];
 }
 export function isViewPointInElement(p, opts) {
-    const { context2d: ctx, element: elem, viewScaleInfo, viewSizeInfo } = opts;
+    const { context2d: ctx, element: elem, viewScaleInfo } = opts;
     const { angle = 0 } = elem;
-    const { x, y, w, h } = calcViewElementSize(elem, { viewScaleInfo, viewSizeInfo });
+    const { x, y, w, h } = calcViewElementSize(elem, { viewScaleInfo });
     const vertexes = rotateElementVertexes({ x, y, w, h, angle });
     if (vertexes.length >= 2) {
         ctx.beginPath();
@@ -103,6 +105,25 @@ export function isViewPointInElement(p, opts) {
     }
     return false;
 }
+export function isViewPointInElementSize(p, elemSize, opts) {
+    const vertexes = calcElementVertexes(elemSize);
+    return isViewPointInVertexes(p, vertexes, opts);
+}
+export function isViewPointInVertexes(p, vertexes, opts) {
+    const xList = [vertexes[0].x, vertexes[1].x, vertexes[2].x, vertexes[3].x];
+    const yList = [vertexes[0].y, vertexes[1].y, vertexes[2].y, vertexes[3].y];
+    const mixX = Math.min(...xList);
+    const maxX = Math.max(...xList);
+    const mixY = Math.min(...yList);
+    const maxY = Math.max(...yList);
+    if (p.x > mixX && p.x < maxX && p.y > mixY && p.y < maxY) {
+        return true;
+    }
+    if ((opts === null || opts === void 0 ? void 0 : opts.includeBorder) === true && (p.x === mixX || p.x === maxX || p.y === mixY || p.y === maxY)) {
+        return true;
+    }
+    return false;
+}
 export function getViewPointAtElement(p, opts) {
     var _a, _b, _c;
     const { context2d: ctx, data, viewScaleInfo, viewSizeInfo, groupQueue } = opts;
@@ -174,7 +195,7 @@ export function isElementInView(elem, opts) {
     const { viewSizeInfo, viewScaleInfo } = opts;
     const { width, height } = viewSizeInfo;
     const { angle } = elem;
-    const { x, y, w, h } = calcViewElementSize(elem, { viewScaleInfo, viewSizeInfo });
+    const { x, y, w, h } = calcViewElementSize(elem, { viewScaleInfo });
     const ves = rotateElementVertexes({ x, y, w, h, angle });
     const viewSize = { x: 0, y: 0, w: width, h: height };
     const elemStartX = Math.min(ves[0].x, ves[1].x, ves[2].x, ves[3].x);
@@ -184,3 +205,106 @@ export function isElementInView(elem, opts) {
     const elemSize = { x: elemStartX, y: elemStartY, w: elemEndX - elemStartX, h: elemEndY - elemStartY };
     return checkRectIntersect(viewSize, elemSize);
 }
+export function calcElementOriginRectInfo(elemSize, opts) {
+    const { groupQueue } = opts;
+    const vertexes = calcElementVertexesInGroup(elemSize, { groupQueue });
+    const top = getCenterFromTwoPoints(vertexes[0], vertexes[1]);
+    const right = getCenterFromTwoPoints(vertexes[1], vertexes[2]);
+    const bottom = getCenterFromTwoPoints(vertexes[2], vertexes[3]);
+    const left = getCenterFromTwoPoints(vertexes[3], vertexes[0]);
+    const topLeft = vertexes[0];
+    const topRight = vertexes[1];
+    const bottomRight = vertexes[2];
+    const bottomLeft = vertexes[3];
+    const maxX = Math.max(topLeft.x, topRight.x, bottomRight.x, bottomLeft.x);
+    const maxY = Math.max(topLeft.y, topRight.y, bottomRight.y, bottomLeft.y);
+    const minX = Math.min(topLeft.x, topRight.x, bottomRight.x, bottomLeft.x);
+    const minY = Math.min(topLeft.y, topRight.y, bottomRight.y, bottomLeft.y);
+    const center = {
+        x: (maxX + minX) / 2,
+        y: (maxY + minY) / 2
+    };
+    const rectInfo = {
+        center,
+        topLeft,
+        topRight,
+        bottomLeft,
+        bottomRight,
+        top,
+        right,
+        left,
+        bottom
+    };
+    return rectInfo;
+}
+export function originRectInfoToRangeRectInfo(originRectInfo) {
+    const rangeMaxX = Math.max(originRectInfo.topLeft.x, originRectInfo.topRight.x, originRectInfo.bottomRight.x, originRectInfo.bottomLeft.x);
+    const rangeMaxY = Math.max(originRectInfo.topLeft.y, originRectInfo.topRight.y, originRectInfo.bottomRight.y, originRectInfo.bottomLeft.y);
+    const rangeMinX = Math.min(originRectInfo.topLeft.x, originRectInfo.topRight.x, originRectInfo.bottomRight.x, originRectInfo.bottomLeft.x);
+    const rangeMinY = Math.min(originRectInfo.topLeft.y, originRectInfo.topRight.y, originRectInfo.bottomRight.y, originRectInfo.bottomLeft.y);
+    const rangeCenter = { x: originRectInfo.center.x, y: originRectInfo.center.y };
+    const rangeTopLeft = { x: rangeMinX, y: rangeMinY };
+    const rangeTopRight = { x: rangeMaxX, y: rangeMinY };
+    const rangeBottomRight = { x: rangeMaxX, y: rangeMaxY };
+    const rangeBottomLeft = { x: rangeMinX, y: rangeMaxY };
+    const rangeTop = getCenterFromTwoPoints(rangeTopLeft, rangeTopRight);
+    const rangeBottom = getCenterFromTwoPoints(rangeBottomLeft, rangeBottomRight);
+    const rangeLeft = getCenterFromTwoPoints(rangeTopLeft, rangeBottomLeft);
+    const rangeRight = getCenterFromTwoPoints(rangeTopRight, rangeBottomRight);
+    const rangeRectInfo = {
+        center: rangeCenter,
+        topLeft: rangeTopLeft,
+        topRight: rangeTopRight,
+        bottomLeft: rangeBottomLeft,
+        bottomRight: rangeBottomRight,
+        top: rangeTop,
+        right: rangeRight,
+        left: rangeLeft,
+        bottom: rangeBottom
+    };
+    return rangeRectInfo;
+}
+export function calcElementViewRectInfo(elemSize, opts) {
+    const { groupQueue, viewScaleInfo, range } = opts;
+    const originRectInfo = calcElementOriginRectInfo(elemSize, { groupQueue });
+    const { center, top, bottom, left, right, topLeft, topRight, bottomLeft, bottomRight } = originRectInfo;
+    const viewRectInfo = {
+        center: calcViewPointSize(center, { viewScaleInfo }),
+        topLeft: calcViewPointSize(topLeft, { viewScaleInfo }),
+        topRight: calcViewPointSize(topRight, { viewScaleInfo }),
+        bottomLeft: calcViewPointSize(bottomLeft, { viewScaleInfo }),
+        bottomRight: calcViewPointSize(bottomRight, { viewScaleInfo }),
+        top: calcViewPointSize(top, { viewScaleInfo }),
+        right: calcViewPointSize(right, { viewScaleInfo }),
+        left: calcViewPointSize(left, { viewScaleInfo }),
+        bottom: calcViewPointSize(bottom, { viewScaleInfo })
+    };
+    if (range === true) {
+        const viewMaxX = Math.max(viewRectInfo.topLeft.x, viewRectInfo.topRight.x, viewRectInfo.bottomRight.x, viewRectInfo.bottomLeft.x);
+        const viewMaxY = Math.max(viewRectInfo.topLeft.y, viewRectInfo.topRight.y, viewRectInfo.bottomRight.y, viewRectInfo.bottomLeft.y);
+        const viewMinX = Math.min(viewRectInfo.topLeft.x, viewRectInfo.topRight.x, viewRectInfo.bottomRight.x, viewRectInfo.bottomLeft.x);
+        const viewMinY = Math.min(viewRectInfo.topLeft.y, viewRectInfo.topRight.y, viewRectInfo.bottomRight.y, viewRectInfo.bottomLeft.y);
+        const rangeCenter = { x: viewRectInfo.center.x, y: viewRectInfo.center.y };
+        const rangeTopLeft = { x: viewMinX, y: viewMinY };
+        const rangeTopRight = { x: viewMaxX, y: viewMinY };
+        const rangeBottomRight = { x: viewMaxX, y: viewMaxY };
+        const rangeBottomLeft = { x: viewMinX, y: viewMaxY };
+        const rangeTop = getCenterFromTwoPoints(rangeTopLeft, rangeTopRight);
+        const rangeBottom = getCenterFromTwoPoints(rangeBottomLeft, rangeBottomRight);
+        const rangeLeft = getCenterFromTwoPoints(rangeTopLeft, rangeBottomLeft);
+        const rangeRight = getCenterFromTwoPoints(rangeTopRight, rangeBottomRight);
+        const rangeRectInfo = {
+            center: rangeCenter,
+            topLeft: rangeTopLeft,
+            topRight: rangeTopRight,
+            bottomLeft: rangeBottomLeft,
+            bottomRight: rangeBottomRight,
+            top: rangeTop,
+            right: rangeRight,
+            left: rangeLeft,
+            bottom: rangeBottom
+        };
+        return rangeRectInfo;
+    }
+    return viewRectInfo;
+}

package/dist/esm/lib/view-content.d.ts

@@ -0,0 +1,14 @@
+import type { Data, ViewSizeInfo, ViewScaleInfo, PointSize } from '@idraw/types';
+interface ViewCenterContentResult {
+    offsetX: number;
+    offsetY: number;
+    scale: number;
+}
+export declare function calcViewCenterContent(data: Data, opts: {
+    viewSizeInfo: ViewSizeInfo;
+}): ViewCenterContentResult;
+export declare function calcViewCenter(opts?: {
+    viewScaleInfo: ViewScaleInfo;
+    viewSizeInfo: ViewSizeInfo;
+}): PointSize;
+export {};

package/dist/esm/lib/view-content.js

@@ -0,0 +1,88 @@
+import { rotateElementVertexes } from './rotate';
+import { formatNumber } from './number';
+import { is } from './is';
+export function calcViewCenterContent(data, opts) {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
+    let offsetX = 0;
+    let offsetY = 0;
+    let scale = 1;
+    let contentX = ((_b = (_a = data === null || data === void 0 ? void 0 : data.elements) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.x) || 0;
+    let contentY = ((_d = (_c = data === null || data === void 0 ? void 0 : data.elements) === null || _c === void 0 ? void 0 : _c[0]) === null || _d === void 0 ? void 0 : _d.y) || 0;
+    let contentW = ((_f = (_e = data === null || data === void 0 ? void 0 : data.elements) === null || _e === void 0 ? void 0 : _e[0]) === null || _f === void 0 ? void 0 : _f.w) || 0;
+    let contentH = ((_h = (_g = data === null || data === void 0 ? void 0 : data.elements) === null || _g === void 0 ? void 0 : _g[0]) === null || _h === void 0 ? void 0 : _h.h) || 0;
+    const { width, height } = opts.viewSizeInfo;
+    if (data.layout && ((_k = (_j = data.layout) === null || _j === void 0 ? void 0 : _j.detail) === null || _k === void 0 ? void 0 : _k.overflow) === 'hidden') {
+        contentX = 0;
+        contentY = 0;
+        contentW = data.layout.w || 0;
+        contentH = data.layout.h || 0;
+    }
+    else {
+        data.elements.forEach((elem) => {
+            const elemSize = {
+                x: elem.x,
+                y: elem.y,
+                w: elem.w,
+                h: elem.h,
+                angle: elem.angle
+            };
+            if (elemSize.angle && (elemSize.angle > 0 || elemSize.angle < 0)) {
+                const ves = rotateElementVertexes(elemSize);
+                if (ves.length === 4) {
+                    const xList = [ves[0].x, ves[1].x, ves[2].x, ves[3].x];
+                    const yList = [ves[0].y, ves[1].y, ves[2].y, ves[3].y];
+                    elemSize.x = Math.min(...xList);
+                    elemSize.y = Math.min(...yList);
+                    elemSize.w = Math.abs(Math.max(...xList) - Math.min(...xList));
+                    elemSize.h = Math.abs(Math.max(...yList) - Math.min(...yList));
+                }
+            }
+            const areaStartX = Math.min(elemSize.x, contentX);
+            const areaStartY = Math.min(elemSize.y, contentY);
+            const areaEndX = Math.max(elemSize.x + elemSize.w, contentX + contentW);
+            const areaEndY = Math.max(elemSize.y + elemSize.h, contentY + contentH);
+            contentX = areaStartX;
+            contentY = areaStartY;
+            contentW = Math.abs(areaEndX - areaStartX);
+            contentH = Math.abs(areaEndY - areaStartY);
+        });
+    }
+    if (data.layout) {
+        const { x, y, w, h } = data.layout;
+        if (is.x(x) && is.y(y) && is.w(w) && is.h(h)) {
+            contentX = Math.min(contentX, x);
+            contentY = Math.min(contentY, y);
+            contentW = Math.max(contentW, w);
+            contentH = Math.max(contentH, h);
+        }
+    }
+    if (contentW > 0 && contentH > 0) {
+        const scaleW = formatNumber(width / contentW, { decimalPlaces: 4 });
+        const scaleH = formatNumber(height / contentH, { decimalPlaces: 4 });
+        scale = Math.min(scaleW, scaleH, 1);
+        offsetX = (contentW * scale - width) / 2 / scale + contentX;
+        offsetY = (contentH * scale - height) / 2 / scale + contentY;
+    }
+    const result = {
+        offsetX: formatNumber(offsetX, { decimalPlaces: 0 }),
+        offsetY: formatNumber(offsetY, { decimalPlaces: 0 }),
+        scale
+    };
+    return result;
+}
+export function calcViewCenter(opts) {
+    let x = 0;
+    let y = 0;
+    if (opts) {
+        const { viewScaleInfo, viewSizeInfo } = opts;
+        const { offsetLeft, offsetTop, scale } = viewScaleInfo;
+        const { width, height } = viewSizeInfo;
+        x = 0 - offsetLeft + width / scale / 2;
+        y = 0 - offsetTop + height / scale / 2;
+    }
+    const p = {
+        x,
+        y
+    };
+    return p;
+}