@meta2d/core 1.0.56 → 1.0.57

package/src/diagrams/line/curve.ts

@@ -1,260 +0,0 @@
-import { Direction } from '../../data';
-import { facePen, getToAnchor, Pen } from '../../pen';
-import { distance, Point, PrevNextType, rotatePoint } from '../../point';
-import { Meta2dStore } from '../../store';
-import { s8 } from '../../utils';
-
-export function curve(store: Meta2dStore, pen: Pen, mousedwon?: Point) {
-  if (!pen.calculative.worldAnchors) {
-    pen.calculative.worldAnchors = [];
-  }
-
-  if (mousedwon) {
-    if (pen.calculative.activeAnchor) {
-      pen.calculative.activeAnchor.next = {
-        penId: pen.id,
-        x: mousedwon.x,
-        y: mousedwon.y,
-      };
-      if (
-        distance(
-          pen.calculative.activeAnchor.next,
-          pen.calculative.activeAnchor
-        ) < 5
-      ) {
-        pen.calculative.activeAnchor.next = undefined;
-      } else {
-        pen.calculative.activeAnchor.prev = {
-          ...pen.calculative.activeAnchor.next,
-        };
-        rotatePoint(
-          pen.calculative.activeAnchor.prev,
-          180,
-          pen.calculative.activeAnchor
-        );
-      }
-    }
-  } else {
-    const from = pen.calculative.worldAnchors[0];
-    if (!from.next) {
-      const fromFace = facePen(from, store.pens[from.connectTo]);
-      calcCurveCP(from, fromFace, 50);
-      from.prev = undefined;
-    }
-
-    const to =
-      pen.calculative.worldAnchors[pen.calculative.worldAnchors.length - 1];
-    if (to && to !== from && !to.prev) {
-      const toFace = facePen(to, store.pens[to.connectTo]);
-      calcCurveCP(to, toFace, -50);
-      to.next = undefined;
-    }
-  }
-}
-
-function calcCurveCP(pt: Point, d: Direction, dis: number) {
-  switch (d) {
-    case Direction.Up:
-      pt.prev = {
-        penId: pt.penId,
-        x: pt.x,
-        y: pt.y + dis,
-      };
-      pt.next = {
-        penId: pt.penId,
-        x: pt.x,
-        y: pt.y - dis,
-      };
-      break;
-    case Direction.Right:
-      pt.prev = {
-        penId: pt.penId,
-        x: pt.x - dis,
-        y: pt.y,
-      };
-      pt.next = {
-        penId: pt.penId,
-        x: pt.x + dis,
-        y: pt.y,
-      };
-      break;
-    case Direction.Bottom:
-      pt.prev = {
-        penId: pt.penId,
-        x: pt.x,
-        y: pt.y - dis,
-      };
-      pt.next = {
-        penId: pt.penId,
-        x: pt.x,
-        y: pt.y + dis,
-      };
-      break;
-    case Direction.Left:
-      pt.prev = {
-        penId: pt.penId,
-        x: pt.x + dis,
-        y: pt.y,
-      };
-      pt.next = {
-        penId: pt.penId,
-        x: pt.x - dis,
-        y: pt.y,
-      };
-      break;
-  }
-}
-
-// Get a point in quadratic.
-// pos - The position of point in quadratic. It is expressed as a percentage(0 - 1).
-export function getQuadraticPoint(
-  step: number,
-  from: Point,
-  cp: Point,
-  to: Point
-) {
-  const pos = 1 - step;
-  const x = pos * pos * from.x + 2 * pos * step * cp.x + step * step * to.x;
-  const y = pos * pos * from.y + 2 * pos * step * cp.y + step * step * to.y;
-  return { x, y, step };
-}
-
-// Get a point in bezier.
-// pos - The position of point in bezier. It is expressed as a percentage(0 - 1).
-export function getBezierPoint(
-  step: number,
-  from: Point,
-  cp1: Point,
-  cp2: Point,
-  to: Point
-) {
-  const { x: x1, y: y1 } = from;
-  const { x: x2, y: y2 } = to;
-  const { x: cx1, y: cy1 } = cp1;
-  const { x: cx2, y: cy2 } = cp2;
-
-  const pos = 1 - step;
-  const x =
-    x1 * pos * pos * pos +
-    3 * cx1 * step * pos * pos +
-    3 * cx2 * step * step * pos +
-    x2 * step * step * step;
-  const y =
-    y1 * pos * pos * pos +
-    3 * cy1 * step * pos * pos +
-    3 * cy2 * step * step * pos +
-    y2 * step * step * step;
-  return { x, y, step };
-}
-
-function lerp(pt1: Point, pt2: Point, t: number) {
-  return {
-    x: pt1.x + t * (pt2.x - pt1.x),
-    y: pt1.y + t * (pt2.y - pt1.y),
-  };
-}
-
-export function getSplitAnchor(pen: Pen, pt: Point, index: number) {
-  let from = pen.calculative.worldAnchors[index];
-  let to = pen.calculative.worldAnchors[index + 1];
-  if(!to && pen.close){
-    to = pen.calculative.worldAnchors[0];
-  }
-  const t = pt.step;
-  let anchor: Point;
-  if (from.next && to.prev) {
-    const p0 = from;
-    const p1 = from.next;
-    const p2 = to.prev;
-    const p3 = to;
-    const p4 = lerp(p0, p1, t);
-    const p5 = lerp(p1, p2, t);
-    const p6 = lerp(p2, p3, t);
-    const p7: Point = lerp(p4, p5, t);
-    const p8: Point = lerp(p5, p6, t);
-    anchor = lerp(p7, p8, t);
-    p7.penId = pen.id;
-    anchor.prev = p7;
-    p8.penId = pen.id;
-    anchor.next = p8;
-    from.next.x = p4.x;
-    from.next.y = p4.y;
-    to.prev.x = p6.x;
-    to.prev.y = p6.y;
-  } else if (from.next || to.prev) {
-    const p0 = from;
-    const p1 = from.next || to.prev;
-    const p2 = to;
-    const p3: Point = lerp(p0, p1, t);
-    const p4: Point = lerp(p1, p2, t);
-    anchor = pt;
-    p3.penId = pen.id;
-    p4.penId = pen.id;
-    anchor.prev = p3;
-    anchor.next = p4;
-    from.next = undefined;
-    to.prev = undefined;
-  } else {
-    // 并非贝塞尔点，即 from 和 to 之间是一条直线
-    anchor = pt;
-  }
-
-  anchor.penId = pen.id;
-  anchor.id = s8();
-  anchor.prevNextType = PrevNextType.Bilateral;
-  return anchor;
-}
-
-export function mind(store: Meta2dStore, pen: Pen, mousedwon?: Point) {
-  if (!pen.calculative.worldAnchors) {
-    pen.calculative.worldAnchors = [];
-  }
-
-  if (pen.calculative.worldAnchors.length < 2) {
-    return;
-  }
-
-  let from = pen.calculative.activeAnchor;
-  let to = mousedwon || getToAnchor(pen);
-  if (!from || !to) {
-    return;
-  }
-
-  const dis = 20;
-
-  const fromPen = store.pens[from.connectTo];
-  let fromFace = facePen(from, fromPen);
-  if (fromFace === Direction.None) {
-    if (to.x > from.x) {
-      fromFace = Direction.Right;
-    } else {
-      fromFace = Direction.Left;
-    }
-  }
-  from.next = {
-    id: s8(),
-    penId: pen.id,
-    x: from.x,
-    y: from.y,
-    prevNextType: 2,
-  };
-  to.prev = { id: s8(), penId: pen.id, x: to.x, y: to.y, prevNextType: 2 };
-  switch (fromFace) {
-    case Direction.Up:
-      from.next.y -= dis;
-      to.prev.y = from.y;
-      break;
-    case Direction.Bottom:
-      from.next.y += dis;
-      to.prev.y = from.y;
-      break;
-    case Direction.Left:
-      from.next.x -= dis;
-      to.prev.x = from.x;
-      break;
-    default:
-      from.next.x += dis;
-      to.prev.x = from.x;
-      break;
-  }
-}

package/src/diagrams/line/line.ts

@@ -1,409 +0,0 @@
-import { deleteTempAnchor, getFromAnchor, getGradientAnimatePath, getToAnchor, Pen } from '../../pen';
-import { hitPoint, Point } from '../../point';
-import { getRectOfPoints, pointInSimpleRect, Rect } from '../../rect';
-import { Meta2dStore } from '../../store';
-import { getBezierPoint, getQuadraticPoint } from './curve';
-
-export function line(
-  pen: Pen,
-  ctx?: CanvasRenderingContext2D | Path2D
-): Path2D {
-  const path = !ctx ? new Path2D() : ctx;
-  if (pen.lineName === 'line' || pen.lineName === 'polyline') {
-    if (pen.calculative.lineSmooth) {
-      let _path = getGradientAnimatePath(pen);
-      (path as Path2D).addPath(_path);
-      if (path instanceof Path2D) return path;
-    }
-  }
-  const worldAnchors = pen.calculative.worldAnchors;
-  if (worldAnchors.length > 1) {
-    let from: Point; // 上一个点
-    worldAnchors.forEach((pt: Point) => {
-      if (from) {
-        draw(path, from, pt);
-      } else {
-        pt.start = true;
-      }
-      from = pt;
-    });
-    if (pen.close) {
-      draw(path, from, worldAnchors[0]);
-    }
-  }
-  if (path instanceof Path2D) return path;
-}
-
-export function lineSegment(store: Meta2dStore, pen: Pen, mousedwon?: Point) {
-  if (!pen.calculative.worldAnchors) {
-    pen.calculative.worldAnchors = [];
-  }
-
-  if (pen.calculative.worldAnchors.length < 2 || pen.anchors?.length > 1) {
-    return;
-  }
-
-  const from = getFromAnchor(pen);
-  const to = getToAnchor(pen);
-  if (!from || !to || !to.id || from === to) {
-    return;
-  }
-  from.next = undefined;
-  deleteTempAnchor(pen);
-  to.prev = undefined;
-  pen.calculative.worldAnchors.push(to);
-}
-
-function draw(path: CanvasRenderingContext2D | Path2D, from: Point, to: Point) {
-  if (!to || to.isTemp) {
-    return;
-  }
-  from.start && path.moveTo(from.x, from.y);
-  if (from.next) {
-    if (to.prev) {
-      path.bezierCurveTo(
-        from.next.x,
-        from.next.y,
-        to.prev.x,
-        to.prev.y,
-        to.x,
-        to.y
-      );
-    } else {
-      path.quadraticCurveTo(from.next.x, from.next.y, to.x, to.y);
-    }
-  } else {
-    if (to.prev) {
-      path.quadraticCurveTo(to.prev.x, to.prev.y, to.x, to.y);
-    } else {
-      path.lineTo(to.x, to.y);
-    }
-  }
-}
-
-export function getLineRect(pen: Pen) {
-  getLineLength(pen);
-  return getRectOfPoints(getLinePoints(pen));
-}
-
-/**
- * 获取连线的 points ，并非 worldAnchors ，worldAnchors 之前的路径点也会记录
- */
-export function getLinePoints(pen: Pen) {
-  const pts: Point[] = [];
-  let from: Point; // 上一个点
-  pen.calculative.worldAnchors.forEach((pt: Point) => {
-    pts.push(pt);
-    from && pts.push(...getPoints(from, pt, pen));
-    from = pt;
-  });
-  if (pen.close && pen.calculative.worldAnchors.length > 1) {
-    pts.push(...getPoints(from, pen.calculative.worldAnchors[0], pen));
-  }
-  return pts;
-}
-
-export function getLineR(pen: Pen) {
-  return pen?.lineWidth ? pen.lineWidth / 2 + 4 : 4;
-}
-
-export function getPoints(from: Point, to: Point, pen?: Pen) {
-  const pts: Point[] = [];
-  if (!to) {
-    return pts;
-  }
-
-  let step = 0.02;
-  if (from.lineLength) {
-    const r = getLineR(pen);
-    step = r / from.lineLength;
-  }
-  if (from.next) {
-    if (to.prev) {
-      for (let i = step; i < 1; i += step) {
-        pts.push(getBezierPoint(i, from, from.next, to.prev, to));
-      }
-    } else {
-      for (let i = step; i < 1; i += step) {
-        pts.push(getQuadraticPoint(i, from, from.next, to));
-      }
-    }
-  } else {
-    if (to.prev) {
-      for (let i = step; i < 1; i += step) {
-        pts.push(getQuadraticPoint(i, from, to.prev, to));
-      }
-    } else {
-      pts.push({ x: to.x, y: to.y });
-    }
-  }
-  if (pts.length > 1) {
-    from.curvePoints = pts;
-  }
-
-  return pts;
-}
-
-export function pointInLine(pt: Point, pen: Pen) {
-  const r = getLineR(pen);
-
-  let i = 0;
-  let from: Point; // 上一个点
-  let point: Point;
-  for (const anchor of pen.calculative.worldAnchors) {
-    if (from) {
-      point = pointInLineSegment(pt, from, anchor, r);
-      if (point) {
-        return {
-          i,
-          point,
-        };
-      }
-      ++i;
-    }
-    from = anchor;
-  }
-  if (
-    pen.close &&
-    pen.calculative.worldAnchors.length > 1 &&
-    (point = pointInLineSegment(pt, from, pen.calculative.worldAnchors[0], r))
-  ) {
-    return {
-      i,
-      point,
-    };
-  }
-}
-export function pointInLineSegment(pt: Point, pt1: Point, pt2: Point, r = 4) {
-  if (!pt1.next && !pt2.prev) {
-    const { x: x1, y: y1 } = pt1;
-    const { x: x2, y: y2 } = pt2;
-    const minX = Math.min(x1, x2);
-    const maxX = Math.max(x1, x2);
-    const minY = Math.min(y1, y2);
-    const maxY = Math.max(y1, y2);
-    if (
-      !(
-        pt.x >= minX - r &&
-        pt.x <= maxX + r &&
-        pt.y >= minY - r &&
-        pt.y <= maxY + r
-      )
-    ) {
-      return;
-    }
-    return pointToLine(pt, pt1, pt2, r);
-  } else if (pt1.curvePoints) {
-    for (const point of pt1.curvePoints) {
-      if (hitPoint(pt, point, r)) {
-        return point;
-      }
-    }
-  }
-}
-
-export function pointToLine(pt: Point, pt1: Point, pt2: Point, r = 4) {
-  // 竖线
-  if (pt1.x === pt2.x) {
-    const len = Math.abs(pt.x - pt1.x);
-    if (len <= r) {
-      return {
-        x: pt1.x,
-        y: pt.y,
-      };
-    }
-  } else {
-    const A = (pt1.y - pt2.y) / (pt1.x - pt2.x);
-    const B = pt1.y - A * pt1.x;
-    const len = Math.abs((A * pt.x + B - pt.y) / Math.sqrt(A * A + 1));
-    if (len <= r) {
-      const m = pt.x + A * pt.y;
-      const x = (m - A * B) / (A * A + 1);
-      return {
-        x,
-        y: A * x + B,
-      };
-    }
-  }
-}
-
-function lineLen(from: Point, cp1?: Point, cp2?: Point, to?: Point): number {
-  if (!cp1 && !cp2) {
-    return (
-      Math.sqrt(
-        Math.pow(Math.abs(from.x - to.x), 2) +
-          Math.pow(Math.abs(from.y - to.y), 2)
-      ) || 0
-    );
-  }
-
-  const path = document.createElementNS('http://www.w3.org/2000/svg', 'path');
-  if (cp1 && cp2) {
-    path.setAttribute(
-      'd',
-      `M${from.x} ${from.y} C${cp1.x} ${cp1.y} ${cp2.x} ${cp2.y} ${to.x} ${to.y}`
-    );
-  } else if (cp1) {
-    path.setAttribute(
-      'd',
-      `M${from.x} ${from.y} Q${cp1.x} ${cp1.y} ${to.x} ${to.y}`
-    );
-  } else {
-    path.setAttribute(
-      'd',
-      `M${from.x} ${from.y} Q${cp2.x} ${cp2.y} ${to.x} ${to.y}`
-    );
-  }
-  return path.getTotalLength() || 0;
-}
-
-export function getLineLength(pen: Pen): number {
-  if (pen.calculative.worldAnchors.length < 2) {
-    return 0;
-  }
-
-  let len = 0;
-  let from: Point; // 上一个点
-  pen.calculative.worldAnchors.forEach((pt: Point) => {
-    if (from) {
-      from.lineLength = lineLen(from, from.next, pt.prev, pt);
-      len += from.lineLength;
-    }
-    from = pt;
-  });
-  if (pen.close) {
-    // pen.close ，下一个点即第一个点
-    const to = getFromAnchor(pen);
-    from.lineLength = lineLen(from, from.next, to.prev, to);
-    len += from.lineLength;
-  }
-  if (pen.calculative.animatePos) {
-    pen.calculative.animatePos =
-      (len / pen.length) * pen.calculative.animatePos;
-  }
-  pen.length = len;
-  return len;
-}
-
-/**
- * 连线在 rect 内， 连线与 rect 相交
- */
-export function lineInRect(line: Pen, rect: Rect) {
-  // 判断是直线还是贝塞尔
-  const worldAnchors = line.calculative.worldAnchors;
-  for (let index = 0; index < worldAnchors.length - 1; index++) {
-    const current = worldAnchors[index];
-    const next = worldAnchors[index + 1];
-    if (!current.next && !next.prev) {
-      // 线段
-      if (isLineIntersectRectangle(current, next, rect)) {
-        return true;
-      }
-    } else {
-      // 贝塞尔
-      if (isBezierIntersectRectangle(current, next, rect)) {
-        return true;
-      }
-    }
-  }
-  return false;
-}
-
-/**
- * 线段与矩形是否相交
- * @param rect 矩形
- */
-export function isLineIntersectRectangle(pt1: Point, pt2: Point, rect: Rect) {
-  if (pointInSimpleRect(pt1, rect) || pointInSimpleRect(pt2, rect)) {
-    // 存在一个点在矩形内部
-    return true;
-  }
-  const linePointX1 = pt1.x;
-  const linePointY1 = pt1.y;
-  const linePointX2 = pt2.x;
-  const linePointY2 = pt2.y;
-
-  let rectangleLeftTopX = rect.x;
-  let rectangleLeftTopY = rect.y;
-  let rectangleRightBottomX = rect.ex;
-  let rectangleRightBottomY = rect.ey;
-
-  const lineHeight = linePointY1 - linePointY2;
-  const lineWidth = linePointX2 - linePointX1; // 计算叉乘
-  const c = linePointX1 * linePointY2 - linePointX2 * linePointY1;
-  if (
-    (lineHeight * rectangleLeftTopX + lineWidth * rectangleLeftTopY + c >= 0 &&
-      lineHeight * rectangleRightBottomX +
-        lineWidth * rectangleRightBottomY +
-        c <=
-        0) ||
-    (lineHeight * rectangleLeftTopX + lineWidth * rectangleLeftTopY + c <= 0 &&
-      lineHeight * rectangleRightBottomX +
-        lineWidth * rectangleRightBottomY +
-        c >=
-        0) ||
-    (lineHeight * rectangleLeftTopX + lineWidth * rectangleRightBottomY + c >=
-      0 &&
-      lineHeight * rectangleRightBottomX + lineWidth * rectangleLeftTopY + c <=
-        0) ||
-    (lineHeight * rectangleLeftTopX + lineWidth * rectangleRightBottomY + c <=
-      0 &&
-      lineHeight * rectangleRightBottomX + lineWidth * rectangleLeftTopY + c >=
-        0)
-  ) {
-    if (rectangleLeftTopX > rectangleRightBottomX) {
-      const temp = rectangleLeftTopX;
-      rectangleLeftTopX = rectangleRightBottomX;
-      rectangleRightBottomX = temp;
-    }
-    if (rectangleLeftTopY < rectangleRightBottomY) {
-      const temp1 = rectangleLeftTopY;
-      rectangleLeftTopY = rectangleRightBottomY;
-      rectangleRightBottomY = temp1;
-    }
-    if (
-      (linePointX1 < rectangleLeftTopX && linePointX2 < rectangleLeftTopX) ||
-      (linePointX1 > rectangleRightBottomX &&
-        linePointX2 > rectangleRightBottomX) ||
-      (linePointY1 > rectangleLeftTopY && linePointY2 > rectangleLeftTopY) ||
-      (linePointY1 < rectangleRightBottomY &&
-        linePointY2 < rectangleRightBottomY)
-    ) {
-      return false;
-    } else {
-      return true;
-    }
-  } else {
-    return false;
-  }
-}
-
-/**
- * 贝塞尔曲线与矩形是否相交
- * @param from 前点
- * @param to 后点
- * @param rect 矩形
- */
-export function isBezierIntersectRectangle(from: Point, to: Point, rect: Rect) {
-  const step = 0.02;
-  if (!from.next && !to.prev) {
-    // 直线
-    return isLineIntersectRectangle(from, to, rect);
-  } else if (from.next && to.prev) {
-    for (let i = step; i < 1; i += step) {
-      const point = getBezierPoint(i, from, from.next, to.prev, to);
-      if (pointInSimpleRect(point, rect)) {
-        return true;
-      }
-    }
-  } else if (from.next || to.prev) {
-    for (let i = step; i < 1; i += step) {
-      const point = getQuadraticPoint(i, from, from.next || to.prev, to);
-      if (pointInSimpleRect(point, rect)) {
-        return true;
-      }
-    }
-  }
-
-  return false;
-}