diff --git a/packages/element/src/binding.ts b/packages/element/src/binding.ts index f61c2b9f21..9ed5c439ec 100644 --- a/packages/element/src/binding.ts +++ b/packages/element/src/binding.ts @@ -340,11 +340,7 @@ const bindingStrategyForNewSimpleArrowEndpointDragging = ( element: otherElement, focusPoint: otherIsInsideBinding ? origin ?? pointFrom(arrow.x, arrow.y) - : snapToCenter( - otherElement, - elementsMap, - origin ?? pointFrom(arrow.x, arrow.y), - ), + : origin ?? pointFrom(arrow.x, arrow.y), }; // We are hovering another element with the end point @@ -358,10 +354,7 @@ const bindingStrategyForNewSimpleArrowEndpointDragging = ( current = { mode: isInsideBinding && !isNested ? "inside" : "orbit", element: hit, - focusPoint: - isInsideBinding || isNested - ? point - : snapToCenter(hit, elementsMap, point), + focusPoint: isInsideBinding || isNested ? point : point, }; } else { current = { mode: null }; @@ -481,7 +474,7 @@ const bindingStrategyForSimpleArrowEndpointDragging = ( current = { element: hit, mode: "orbit", - focusPoint: isNested ? point : snapToCenter(hit, elementsMap, point), + focusPoint: isNested ? point : point, }; } @@ -1090,35 +1083,6 @@ export const avoidRectangularCorner = ( return p; }; -export const snapToCenter = ( - element: ExcalidrawBindableElement, - elementsMap: ElementsMap, - p: GlobalPoint, -): GlobalPoint => { - const percent = 0.5; - - const center = elementCenterPoint(element, elementsMap); - - return pointDistance(center, p) < - (Math.min(element.width, element.height) / 2) * percent - ? center - : p; - - // const isPointDeepInside = isPointInElement( - // p, - // { - // ...element, - // x: element.x + (element.width * (1 - percent)) / 2, - // y: element.y + (element.height * (1 - percent)) / 2, - // width: element.width * percent, - // height: element.height * percent, - // }, - // elementsMap, - // ); - - // return isPointDeepInside ? elementCenterPoint(element, elementsMap) : p; -}; - const snapToMid = ( element: ExcalidrawBindableElement, elementsMap: ElementsMap, diff --git a/packages/excalidraw/renderer/interactiveScene.ts b/packages/excalidraw/renderer/interactiveScene.ts index 339ef7e81c..b17b2318c3 100644 --- a/packages/excalidraw/renderer/interactiveScene.ts +++ b/packages/excalidraw/renderer/interactiveScene.ts @@ -1,6 +1,5 @@ import { clamp, - pointDistance, pointFrom, pointsEqual, type GlobalPoint, @@ -16,7 +15,6 @@ import { invariant, THEME, throttleRAF, - viewportCoordsToSceneCoords, } from "@excalidraw/common"; import { @@ -356,47 +354,6 @@ const renderBindingHighlightForBindableElement = ( break; } - - const { x: cursorX, y: cursorY } = viewportCoordsToSceneCoords( - { - clientX: renderConfig.lastViewportPosition.x, - clientY: renderConfig.lastViewportPosition.y, - }, - appState, - ); - - // Draw center snap area - context.save(); - context.translate(element.x + appState.scrollX, element.y + appState.scrollY); - context.strokeStyle = "rgba(0, 0, 0, 0.2)"; - context.lineWidth = 1 / appState.zoom.value; - context.setLineDash([4 / appState.zoom.value, 4 / appState.zoom.value]); - context.lineDashOffset = 0; - - const radius = 0.5 * (Math.min(element.width, element.height) / 2); - const centerX = element.x + element.width / 2; - const centerY = element.y + element.height / 2; - - const isInsideEllipse = - pointDistance(pointFrom(cursorX, cursorY), pointFrom(centerX, centerY)) <= - radius; - - context.fillStyle = isInsideEllipse ? "rgba(0, 0, 0, 0.04)" : "transparent"; - - context.beginPath(); - context.ellipse( - element.width / 2, - element.height / 2, - radius, - radius, - 0, - 0, - 2 * Math.PI, - ); - context.stroke(); - context.fill(); - - context.restore(); }; type ElementSelectionBorder = {