Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Bug in XConnector Bounding Box Calculation #2

Open
usamshen opened this issue Jul 12, 2024 · 2 comments
Open

Bug in XConnector Bounding Box Calculation #2

usamshen opened this issue Jul 12, 2024 · 2 comments
Assignees

Comments

@usamshen
Copy link

usamshen commented Jul 12, 2024

Description:

There is an issue with the XConnector class when calculating the bounding box. The XConnector class, which extends from fabric.Path, has four primary data points: fromPoint, toPoint, controlPoint1, and controlPoint2. The path is calculated based on these points. However, after the path is calculated, using it to calculate the bounding box results in incorrect dimensions.

Steps to Reproduce:
Create an instance of XConnector with two XRectNotes,
Move the ControlPoints of XConnector
Call the method to calculate the path based on these points.
Use the calculated path to compute the bounding box.(_calcDimensions and related methods from Path)

Expected Behavior:
The bounding box should accurately reflect the dimensions of the path created by the fromPoint, toPoint, controlPoint1, and controlPoint2.

Actual Behavior:
The calculated bounding box does not correctly encompass the path, leading to visual and functional inaccuracies.

Additional Information:
The issue appears to stem from the _calcDimensions method.
The problem persists in both curved modes of the XConnector.

Environment:
Fabric.js version: V6.0.1
Browser: Chrome
OS: Mac

Possible Solution:
Review and correct the _calcDimensions method to ensure the bounding box calculation accurately reflects the path created by fromPoint, toPoint, controlPoint1, and controlPoint2.

@asturur
Copy link
Collaborator

asturur commented Jul 14, 2024

started to look at this, and the basic stuff gets complicated quickly because the controls need to be defined in a particular way.
I had in the backlog to do proper controls for Path in fabricJS and today i did this:
fabricjs#9998

This sits in a single file with fabricJS imports and so i should be able to reuse it in your setup without going to update fabric fully.

I ll test it asap

@usamshen
Copy link
Author

usamshen commented Jul 15, 2024

looks great! I open the codeSandbox, but didn't see the prototype yet, how i can run the example?

Two curved lines can connect smoothly if the two control points are on the same line?

image

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants