TheCloud/excalidraw
1
0
Fork 0
mirror of https://github.com/excalidraw/excalidraw.git synced 2025-09-10 13:26:11 -04:00
Code Issues Packages Projects Releases Wiki Activity

Fix jiggly arrows

Browse Source
This commit is contained in:
Mark Tolmacs 2025-07-31 14:56:51 +02:00
parent f9a66527ef
commit 8f1b46a798
No known key found for this signature in database
1 changed files with 30 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

59
packages/element/src/binding.ts
View File

@ -1114,40 +1114,33 @@ export const bindPointToSnapToElementOutline = (
customIntersector?: LineSegment<GlobalPoint>, customIntersector?: LineSegment<GlobalPoint>,
): GlobalPoint => { ): GlobalPoint => {
const aabb = aabbForElement(bindableElement, elementsMap); const aabb = aabbForElement(bindableElement, elementsMap);
const localP = const point = LinearElementEditor.getPointAtIndexGlobalCoordinates(
linearElement.points[ linearElement,
startOrEnd === "start" ? 0 : linearElement.points.length - 1 startOrEnd === "start" ? 0 : -1,
]; elementsMap,
const globalP = pointFrom<GlobalPoint>(
linearElement.x + localP[0],
linearElement.y + localP[1],
); );
if (linearElement.points.length < 2) { if (linearElement.points.length < 2) {
// New arrow creation, so no snapping // New arrow creation, so no snapping
return globalP; return point;
} }
const edgePoint = isRectanguloidElement(bindableElement) const edgePoint = isRectanguloidElement(bindableElement)
? avoidRectangularCorner(bindableElement, elementsMap, globalP) ? avoidRectangularCorner(bindableElement, elementsMap, point)
: globalP; : point;
const elbowed = isElbowArrow(linearElement); const elbowed = isElbowArrow(linearElement);
const center = getCenterForBounds(aabb); const center = getCenterForBounds(aabb);
const adjacentPointIdx = const adjacentPointIdx = startOrEnd === "start" ? 1 : -2;
startOrEnd === "start" ? 1 : linearElement.points.length - 2; const adjacentPoint = LinearElementEditor.getPointAtIndexGlobalCoordinates(
const adjacentPoint = pointRotateRads( linearElement,
pointFrom<GlobalPoint>( adjacentPointIdx,
linearElement.x + linearElement.points[adjacentPointIdx][0], elementsMap,
linearElement.y + linearElement.points[adjacentPointIdx][1],
),
center,
linearElement.angle ?? 0,
); );
let intersection: GlobalPoint | null = null; let intersection: GlobalPoint | null = null;
if (elbowed) { if (elbowed) {
const isHorizontal = headingIsHorizontal( const isHorizontal = headingIsHorizontal(
headingForPointFromElement(bindableElement, aabb, globalP), headingForPointFromElement(bindableElement, aabb, point),
); );
const snapPoint = snapToMid(bindableElement, elementsMap, edgePoint); const snapPoint = snapToMid(bindableElement, elementsMap, edgePoint);
const otherPoint = pointFrom<GlobalPoint>( const otherPoint = pointFrom<GlobalPoint>(
@ -1217,22 +1210,26 @@ export const getOutlineAvoidingPoint = (
customIntersector?: LineSegment<GlobalPoint>, customIntersector?: LineSegment<GlobalPoint>,
): GlobalPoint => { ): GlobalPoint => {
if (hoveredElement) { if (hoveredElement) {
const nextPoint = LinearElementEditor.pointFromAbsoluteCoords(
element,
coords,
elementsMap,
);
return bindPointToSnapToElementOutline( return bindPointToSnapToElementOutline(
{ {
...element, ...element,
...LinearElementEditor.getNormalizeElementPointsAndCoords({ x: pointIndex === 0 ? coords[0] : element.x,
...element, y: pointIndex === 0 ? coords[1] : element.y,
points: points:
pointIndex === 0 pointIndex === 0
? [nextPoint, ...element.points.slice(1)] ? element.points.map((p) =>
: [...element.points.slice(0, -1), nextPoint], pointFrom<LocalPoint>(
}), p[0] - (coords[0] - element.x),
p[1] - (coords[1] - element.y),
),
)
: [
...element.points.slice(0, -1),
pointFrom<LocalPoint>(
coords[0] - element.x,
coords[1] - element.y,
),
],
}, },
hoveredElement, hoveredElement,
pointIndex === 0 ? "start" : "end", pointIndex === 0 ? "start" : "end",