fix: points not being normalized on single-elem resize (#5581)
This commit is contained in:
parent
27cf5ed17e
commit
ad0c4c4c78
@ -495,6 +495,7 @@ export const getResizedElementAbsoluteCoords = (
|
|||||||
element: ExcalidrawElement,
|
element: ExcalidrawElement,
|
||||||
nextWidth: number,
|
nextWidth: number,
|
||||||
nextHeight: number,
|
nextHeight: number,
|
||||||
|
normalizePoints: boolean,
|
||||||
): [number, number, number, number] => {
|
): [number, number, number, number] => {
|
||||||
if (!(isLinearElement(element) || isFreeDrawElement(element))) {
|
if (!(isLinearElement(element) || isFreeDrawElement(element))) {
|
||||||
return [
|
return [
|
||||||
@ -508,7 +509,8 @@ export const getResizedElementAbsoluteCoords = (
|
|||||||
const points = rescalePoints(
|
const points = rescalePoints(
|
||||||
0,
|
0,
|
||||||
nextWidth,
|
nextWidth,
|
||||||
rescalePoints(1, nextHeight, element.points),
|
rescalePoints(1, nextHeight, element.points, normalizePoints),
|
||||||
|
normalizePoints,
|
||||||
);
|
);
|
||||||
|
|
||||||
let bounds: [number, number, number, number];
|
let bounds: [number, number, number, number];
|
||||||
|
@ -198,6 +198,7 @@ const getAdjustedDimensions = (
|
|||||||
element,
|
element,
|
||||||
nextWidth,
|
nextWidth,
|
||||||
nextHeight,
|
nextHeight,
|
||||||
|
false,
|
||||||
);
|
);
|
||||||
const deltaX1 = (x1 - nextX1) / 2;
|
const deltaX1 = (x1 - nextX1) / 2;
|
||||||
const deltaY1 = (y1 - nextY1) / 2;
|
const deltaY1 = (y1 - nextY1) / 2;
|
||||||
|
@ -264,13 +264,15 @@ const rescalePointsInElement = (
|
|||||||
element: NonDeletedExcalidrawElement,
|
element: NonDeletedExcalidrawElement,
|
||||||
width: number,
|
width: number,
|
||||||
height: number,
|
height: number,
|
||||||
|
normalizePoints: boolean,
|
||||||
) =>
|
) =>
|
||||||
isLinearElement(element) || isFreeDrawElement(element)
|
isLinearElement(element) || isFreeDrawElement(element)
|
||||||
? {
|
? {
|
||||||
points: rescalePoints(
|
points: rescalePoints(
|
||||||
0,
|
0,
|
||||||
width,
|
width,
|
||||||
rescalePoints(1, height, element.points),
|
rescalePoints(1, height, element.points, normalizePoints),
|
||||||
|
normalizePoints,
|
||||||
),
|
),
|
||||||
}
|
}
|
||||||
: {};
|
: {};
|
||||||
@ -374,6 +376,7 @@ const resizeSingleTextElement = (
|
|||||||
element,
|
element,
|
||||||
nextWidth,
|
nextWidth,
|
||||||
nextHeight,
|
nextHeight,
|
||||||
|
false,
|
||||||
);
|
);
|
||||||
const deltaX1 = (x1 - nextX1) / 2;
|
const deltaX1 = (x1 - nextX1) / 2;
|
||||||
const deltaY1 = (y1 - nextY1) / 2;
|
const deltaY1 = (y1 - nextY1) / 2;
|
||||||
@ -415,6 +418,7 @@ export const resizeSingleElement = (
|
|||||||
stateAtResizeStart,
|
stateAtResizeStart,
|
||||||
stateAtResizeStart.width,
|
stateAtResizeStart.width,
|
||||||
stateAtResizeStart.height,
|
stateAtResizeStart.height,
|
||||||
|
true,
|
||||||
);
|
);
|
||||||
const startTopLeft: Point = [x1, y1];
|
const startTopLeft: Point = [x1, y1];
|
||||||
const startBottomRight: Point = [x2, y2];
|
const startBottomRight: Point = [x2, y2];
|
||||||
@ -432,6 +436,7 @@ export const resizeSingleElement = (
|
|||||||
element,
|
element,
|
||||||
element.width,
|
element.width,
|
||||||
element.height,
|
element.height,
|
||||||
|
true,
|
||||||
);
|
);
|
||||||
|
|
||||||
const boundsCurrentWidth = esx2 - esx1;
|
const boundsCurrentWidth = esx2 - esx1;
|
||||||
@ -525,6 +530,7 @@ export const resizeSingleElement = (
|
|||||||
stateAtResizeStart,
|
stateAtResizeStart,
|
||||||
eleNewWidth,
|
eleNewWidth,
|
||||||
eleNewHeight,
|
eleNewHeight,
|
||||||
|
true,
|
||||||
);
|
);
|
||||||
const newBoundsWidth = newBoundsX2 - newBoundsX1;
|
const newBoundsWidth = newBoundsX2 - newBoundsX1;
|
||||||
const newBoundsHeight = newBoundsY2 - newBoundsY1;
|
const newBoundsHeight = newBoundsY2 - newBoundsY1;
|
||||||
@ -595,6 +601,7 @@ export const resizeSingleElement = (
|
|||||||
stateAtResizeStart,
|
stateAtResizeStart,
|
||||||
eleNewWidth,
|
eleNewWidth,
|
||||||
eleNewHeight,
|
eleNewHeight,
|
||||||
|
true,
|
||||||
);
|
);
|
||||||
// For linear elements (x,y) are the coordinates of the first drawn point not the top-left corner
|
// For linear elements (x,y) are the coordinates of the first drawn point not the top-left corner
|
||||||
// So we need to readjust (x,y) to be where the first point should be
|
// So we need to readjust (x,y) to be where the first point should be
|
||||||
@ -725,7 +732,12 @@ const resizeMultipleElements = (
|
|||||||
const y = anchorY + (element.orig.y - anchorY) * scale;
|
const y = anchorY + (element.orig.y - anchorY) * scale;
|
||||||
|
|
||||||
// readjust points for linear & free draw elements
|
// readjust points for linear & free draw elements
|
||||||
const rescaledPoints = rescalePointsInElement(element.orig, width, height);
|
const rescaledPoints = rescalePointsInElement(
|
||||||
|
element.orig,
|
||||||
|
width,
|
||||||
|
height,
|
||||||
|
false,
|
||||||
|
);
|
||||||
|
|
||||||
const update: {
|
const update: {
|
||||||
width: number;
|
width: number;
|
||||||
|
@ -14,6 +14,7 @@ export const rescalePoints = (
|
|||||||
dimension: 0 | 1,
|
dimension: 0 | 1,
|
||||||
newSize: number,
|
newSize: number,
|
||||||
points: readonly Point[],
|
points: readonly Point[],
|
||||||
|
normalize: boolean,
|
||||||
): Point[] => {
|
): Point[] => {
|
||||||
const coordinates = points.map((point) => point[dimension]);
|
const coordinates = points.map((point) => point[dimension]);
|
||||||
const maxCoordinate = Math.max(...coordinates);
|
const maxCoordinate = Math.max(...coordinates);
|
||||||
@ -21,10 +22,35 @@ export const rescalePoints = (
|
|||||||
const size = maxCoordinate - minCoordinate;
|
const size = maxCoordinate - minCoordinate;
|
||||||
const scale = size === 0 ? 1 : newSize / size;
|
const scale = size === 0 ? 1 : newSize / size;
|
||||||
|
|
||||||
return points.map((point): Point => {
|
let nextMinCoordinate = Infinity;
|
||||||
|
|
||||||
|
const scaledPoints = points.map((point): Point => {
|
||||||
const newCoordinate = point[dimension] * scale;
|
const newCoordinate = point[dimension] * scale;
|
||||||
const newPoint = [...point];
|
const newPoint = [...point];
|
||||||
newPoint[dimension] = newCoordinate;
|
newPoint[dimension] = newCoordinate;
|
||||||
|
if (newCoordinate < nextMinCoordinate) {
|
||||||
|
nextMinCoordinate = newCoordinate;
|
||||||
|
}
|
||||||
return newPoint as unknown as Point;
|
return newPoint as unknown as Point;
|
||||||
});
|
});
|
||||||
|
|
||||||
|
if (!normalize) {
|
||||||
|
return scaledPoints;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (scaledPoints.length === 2) {
|
||||||
|
// we don't translate two-point lines
|
||||||
|
return scaledPoints;
|
||||||
|
}
|
||||||
|
|
||||||
|
const translation = minCoordinate - nextMinCoordinate;
|
||||||
|
|
||||||
|
const nextPoints = scaledPoints.map(
|
||||||
|
(scaledPoint) =>
|
||||||
|
scaledPoint.map((value, currentDimension) => {
|
||||||
|
return currentDimension === dimension ? value + translation : value;
|
||||||
|
}) as [number, number],
|
||||||
|
);
|
||||||
|
|
||||||
|
return nextPoints;
|
||||||
};
|
};
|
||||||
|
Loading…
x
Reference in New Issue
Block a user