This commit is contained in:
徐旦 2025-06-15 16:27:09 +08:00
commit eabd121f31

View File

@ -156,8 +156,8 @@ export class EditorService extends Meta2d {
};
const { x: x1, y: y1 } = this.getPointRect(p1)!;
const { x: x2, y: y2 } = this.getPointRect(p2)!;
const cp1 = { x: x1 + (c1?.x ?? x2 - x1), y: y1 + (c1?.y ?? 0) };
const cp2 = { x: x2 + (c2?.x ?? 0), y: y2 + (c2?.y ?? y1 - y2) };
const cp1 = { x: x1 + (c1?.x ?? 0), y: y1 + (c1?.y ?? 0) };
const cp2 = { x: x2 + (c2?.x ?? 0), y: y2 + (c2?.y ?? 0) };
switch (type) {
case MapRouteType.线:
route.c1 = cp1;
@ -531,7 +531,7 @@ export class EditorService extends Meta2d {
const line = this.connectLine(p1, p2, undefined, undefined, false);
id ||= line.id!;
this.changePenId(line.id!, id);
const pen: MapPen = { tags: ['route'], route: { type }, lineWidth: 2, iconSize: 10 };
const pen: MapPen = { tags: ['route'], route: { type }, lineWidth: 1 };
this.setValue({ id, ...pen }, { render: false, history: false, doEvent: false });
this.updateLineType(line, type);
this.active(id);
@ -789,38 +789,38 @@ function anchorPoint(pen: MapPen): void {
function drawLine(ctx: CanvasRenderingContext2D, pen: MapPen): void {
const theme = sTheme.editor;
const { active, lineWidth: w = 2, iconSize: s = 10 } = pen.calculative ?? {};
const { active, lineWidth: s = 1 } = pen.calculative ?? {};
const [p1, p2] = pen.calculative?.worldAnchors ?? [];
const { x: x1 = 0, y: y1 = 0 } = p1 ?? {};
const { x: x2 = 0, y: y2 = 0 } = p2 ?? {};
const { type, direction = 1, pass = 0, c1, c2 } = pen.route ?? {};
const { x: dx1 = x2 - x1, y: dy1 = 0 } = c1 ?? {};
const { x: dx2 = 0, y: dy2 = y1 - y2 } = c2 ?? {};
const { x: dx1 = 0, y: dy1 = 0 } = c1 ?? {};
const { x: dx2 = 0, y: dy2 = 0 } = c2 ?? {};
ctx.save();
ctx.beginPath();
ctx.strokeStyle = get(theme, active ? 'route.strokeActive' : `route.stroke-${pass}`) ?? '';
ctx.lineWidth = active ? 1.5 * w : w;
ctx.lineWidth = active ? 3 * s : 2 * s;
ctx.moveTo(x1, y1);
switch (type) {
case MapRouteType.线:
ctx.lineTo(x2, y2);
break;
case MapRouteType.线:
ctx.quadraticCurveTo(x1 + dx1, y1 + dy1, x2, y2);
p1.next = { x: x1 + (2 / 3) * dx1, y: y1 + (2 / 3) * dy1 };
p2.prev = { x: x2 / 3 + (2 / 3) * (x1 + dx1), y: y2 / 3 + (2 / 3) * (y1 + dy1) };
ctx.quadraticCurveTo(x1 + dx1 * s, y1 + dy1 * s, x2, y2);
p1.next = { x: x1 + (2 / 3) * dx1 * s, y: y1 + (2 / 3) * dy1 * s };
p2.prev = { x: x2 / 3 + (2 / 3) * (x1 + dx1 * s), y: y2 / 3 + (2 / 3) * (y1 + dy1 * s) };
break;
case MapRouteType.线:
ctx.bezierCurveTo(x1 + dx1, y1 + dy1, x2 + dx2, y2 + dy2, x2, y2);
p1.next = { x: x1 + dx1, y: y1 + dy1 };
p2.prev = { x: x2 + dx2, y: y2 + dy2 };
ctx.bezierCurveTo(x1 + dx1 * s, y1 + dy1 * s, x2 + dx2 * s, y2 + dy2 * s, x2, y2);
p1.next = { x: x1 + dx1 * s, y: y1 + dy1 * s };
p2.prev = { x: x2 + dx2 * s, y: y2 + dy2 * s };
break;
default:
break;
}
if (pass === MapRoutePassType.) {
ctx.setLineDash([s / 2]);
ctx.setLineDash([s * 5]);
}
ctx.stroke();
ctx.beginPath();
@ -830,9 +830,9 @@ function drawLine(ctx: CanvasRenderingContext2D, pen: MapPen): void {
case MapRouteType.线:
return Math.atan2(y2 - y1, x2 - x1);
case MapRouteType.线:
return direction < 0 ? Math.atan2(dy1, dx1) : Math.atan2(y2 - y1 - dy1, x2 - x1 - dx1);
return direction < 0 ? Math.atan2(dy1 * s, dx1 * s) : Math.atan2(y2 - y1 - dy1 * s, x2 - x1 - dx1 * s);
case MapRouteType.线:
return direction < 0 ? Math.atan2(dy1, dx1) : Math.atan2(-dy2, -dx2);
return direction < 0 ? Math.atan2(dy1 * s, dx1 * s) : Math.atan2(-dy2 * s, -dx2 * s);
default:
return 0;
}
@ -843,9 +843,9 @@ function drawLine(ctx: CanvasRenderingContext2D, pen: MapPen): void {
ctx.translate(x2, y2);
r += Math.PI;
}
ctx.moveTo(Math.cos(r + Math.PI / 5) * s, Math.sin(r + Math.PI / 5) * s);
ctx.moveTo(Math.cos(r + Math.PI / 5) * s * 10, Math.sin(r + Math.PI / 5) * s * 10);
ctx.lineTo(0, 0);
ctx.lineTo(Math.cos(r - Math.PI / 5) * s, Math.sin(r - Math.PI / 5) * s);
ctx.lineTo(Math.cos(r - Math.PI / 5) * s * 10, Math.sin(r - Math.PI / 5) * s * 10);
ctx.stroke();
ctx.setTransform(1, 0, 0, 1, 0, 0);
ctx.restore();
@ -853,23 +853,25 @@ function drawLine(ctx: CanvasRenderingContext2D, pen: MapPen): void {
function lineBezier2(_: Meta2dStore, pen: MapPen): void {
if (pen.calculative?.worldAnchors?.length !== 2) return;
const { c1 } = pen.route ?? {};
const { lineWidth: s = 1 } = pen.calculative ?? {};
const [p1, p2] = pen.calculative?.worldAnchors ?? [];
const { x: x1 = 0, y: y1 = 0 } = p1 ?? {};
const { x: x2 = 0, y: y2 = 0 } = p2 ?? {};
const { x: dx = x2 - x1, y: dy = 0 } = c1 ?? {};
pen.calculative.worldAnchors[0].next = { x: x1 + (2 / 3) * dx, y: y1 + (2 / 3) * dy };
pen.calculative.worldAnchors[1].prev = { x: x2 / 3 + (2 / 3) * (x1 + dx), y: y2 / 3 + (2 / 3) * (y1 + dy) };
const { x: dx = 0, y: dy = 0 } = c1 ?? {};
pen.calculative.worldAnchors[0].next = { x: x1 + (2 / 3) * dx * s, y: y1 + (2 / 3) * dy * s };
pen.calculative.worldAnchors[1].prev = { x: x2 / 3 + (2 / 3) * (x1 + dx * s), y: y2 / 3 + (2 / 3) * (y1 + dy * s) };
}
function lineBezier3(_: Meta2dStore, pen: MapPen): void {
if (pen.calculative?.worldAnchors?.length !== 2) return;
const { c1, c2 } = pen.route ?? {};
const { lineWidth: s = 1 } = pen.calculative ?? {};
const [p1, p2] = pen.calculative?.worldAnchors ?? [];
const { x: x1 = 0, y: y1 = 0 } = p1 ?? {};
const { x: x2 = 0, y: y2 = 0 } = p2 ?? {};
const { x: dx1 = x2 - x1, y: dy1 = 0 } = c1 ?? {};
const { x: dx2 = 0, y: dy2 = y1 - y2 } = c2 ?? {};
pen.calculative.worldAnchors[0].next = { x: x1 + dx1, y: y1 + dy1 };
pen.calculative.worldAnchors[1].prev = { x: x2 + dx2, y: y2 + dy2 };
const { x: dx1 = 0, y: dy1 = 0 } = c1 ?? {};
const { x: dx2 = 0, y: dy2 = 0 } = c2 ?? {};
pen.calculative.worldAnchors[0].next = { x: x1 + dx1 * s, y: y1 + dy1 * s };
pen.calculative.worldAnchors[1].prev = { x: x2 + dx2 * s, y: y2 + dy2 * s };
}
function drawArea(ctx: CanvasRenderingContext2D, pen: MapPen): void {