revert: linear elements unstable bounds

This reverts commit 22ae9b02c4.
This commit is contained in:
Alex Kim 2023-02-27 14:51:49 +03:00
parent 22ae9b02c4
commit 0ba1a1a00b
No known key found for this signature in database
GPG key ID: CEE74CFA44D238D7
2 changed files with 24 additions and 37 deletions

View file

@ -24,11 +24,6 @@ import { rescalePoints } from "../points";
import { getBoundTextElement, getContainerElement } from "./textElement"; import { getBoundTextElement, getContainerElement } from "./textElement";
import { LinearElementEditor } from "./linearElementEditor"; import { LinearElementEditor } from "./linearElementEditor";
const linearShapeCache = new WeakMap<
ExcalidrawLinearElement,
Drawable | null
>();
// x and y position of top left corner, x and y position of bottom right corner // x and y position of top left corner, x and y position of bottom right corner
export type Bounds = readonly [number, number, number, number]; export type Bounds = readonly [number, number, number, number];
type MaybeQuadraticSolution = [number | null, number | null] | false; type MaybeQuadraticSolution = [number | null, number | null] | false;
@ -376,18 +371,11 @@ export const getArrowheadPoints = (
return [x2, y2, x3, y3, x4, y4]; return [x2, y2, x3, y3, x4, y4];
}; };
export const getLinearShapeWith0Roughness = ( const generateLinearElementShape = (
element: ExcalidrawLinearElement, element: ExcalidrawLinearElement,
): Drawable => { ): Drawable => {
const cachedShape = linearShapeCache.get(element);
if (cachedShape) {
return cachedShape;
}
const generator = rough.generator(); const generator = rough.generator();
const options = generateRoughOptions(element); const options = generateRoughOptions(element);
options.roughness = 0;
const method = (() => { const method = (() => {
if (element.roundness) { if (element.roundness) {
@ -399,9 +387,7 @@ export const getLinearShapeWith0Roughness = (
return "linearPath"; return "linearPath";
})(); })();
const shape = generator[method](element.points as Mutable<Point>[], options); return generator[method](element.points as Mutable<Point>[], options);
linearShapeCache.set(element, shape);
return shape;
}; };
const getLinearElementRotatedBounds = ( const getLinearElementRotatedBounds = (
@ -438,7 +424,8 @@ const getLinearElementRotatedBounds = (
} }
// first element is always the curve // first element is always the curve
const shape = getLinearShapeWith0Roughness(element); const cachedShape = getShapeForElement(element)?.[0];
const shape = cachedShape ?? generateLinearElementShape(element);
const ops = getCurvePathOps(shape); const ops = getCurvePathOps(shape);
const transformXY = (x: number, y: number) => const transformXY = (x: number, y: number) =>
rotate(element.x + x, element.y + y, cx, cy, element.angle); rotate(element.x + x, element.y + y, cx, cy, element.angle);
@ -573,14 +560,15 @@ export const getResizedElementAbsoluteCoords = (
bounds = getBoundsFromPoints(points); bounds = getBoundsFromPoints(points);
} else { } else {
// Line // Line
// const gen = rough.generator(); const gen = rough.generator();
// const options = generateRoughOptions(element); const curve = !element.roundness
// options.roughness = 0; ? gen.linearPath(
// const curve = !element.roundness points as [number, number][],
// ? gen.linearPath(points as [number, number][], options) generateRoughOptions(element),
// : gen.curve(points as [number, number][], options); )
const shape = getLinearShapeWith0Roughness(element); : gen.curve(points as [number, number][], generateRoughOptions(element));
const ops = getCurvePathOps(shape);
const ops = getCurvePathOps(curve);
bounds = getMinMaxXYFromCurvePathOps(ops); bounds = getMinMaxXYFromCurvePathOps(ops);
} }
@ -598,15 +586,15 @@ export const getElementPointsCoords = (
points: readonly (readonly [number, number])[], points: readonly (readonly [number, number])[],
): [number, number, number, number] => { ): [number, number, number, number] => {
// This might be computationally heavey // This might be computationally heavey
// const gen = rough.generator(); const gen = rough.generator();
// const options = generateRoughOptions(element); const curve =
// options.roughness = 0; element.roundness == null
// const curve = ? gen.linearPath(
// element.roundness == null points as [number, number][],
// ? gen.linearPath(points as [number, number][], options) generateRoughOptions(element),
// : gen.curve(points as [number, number][], options); )
const shape = getLinearShapeWith0Roughness(element); : gen.curve(points as [number, number][], generateRoughOptions(element));
const ops = getCurvePathOps(shape); const ops = getCurvePathOps(curve);
const [minX, minY, maxX, maxY] = getMinMaxXYFromCurvePathOps(ops); const [minX, minY, maxX, maxY] = getMinMaxXYFromCurvePathOps(ops);
return [ return [
minX + element.x, minX + element.x,

View file

@ -21,7 +21,6 @@ import {
} from "../math"; } from "../math";
import { getElementAbsoluteCoords, getLockedLinearCursorAlignSize } from "."; import { getElementAbsoluteCoords, getLockedLinearCursorAlignSize } from ".";
import { import {
getLinearShapeWith0Roughness,
getCurvePathOps, getCurvePathOps,
getElementPointsCoords, getElementPointsCoords,
getMinMaxXYFromCurvePathOps, getMinMaxXYFromCurvePathOps,
@ -1437,10 +1436,10 @@ export class LinearElementEditor {
x2 = maxX + element.x; x2 = maxX + element.x;
y2 = maxY + element.y; y2 = maxY + element.y;
} else { } else {
const shape = getLinearShapeWith0Roughness(element); const shape = getShapeForElement(element)!;
// first element is always the curve // first element is always the curve
const ops = getCurvePathOps(shape); const ops = getCurvePathOps(shape[0]);
const [minX, minY, maxX, maxY] = getMinMaxXYFromCurvePathOps(ops); const [minX, minY, maxX, maxY] = getMinMaxXYFromCurvePathOps(ops);
x1 = minX + element.x; x1 = minX + element.x;