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

Increase condition right to top length #186

Open
Emins opened this issue Oct 10, 2019 · 6 comments
Open

Increase condition right to top length #186

Emins opened this issue Oct 10, 2019 · 6 comments
Labels
Hacktoberfest https://hacktoberfest.digitalocean.com/

Comments

@Emins
Copy link

Emins commented Oct 10, 2019

Hello and thank you for best flowchart solution i found

In vertical structure condition line set right "No" back to the top. Line from right too short, just 3-4px. How to increase it?

@adrai
Copy link
Owner

adrai commented Oct 10, 2019

Can you paste an example?

@Emins
Copy link
Author

Emins commented Oct 11, 2019

Capture

@Emins
Copy link
Author

Emins commented Oct 11, 2019

I found the place in the code. Not checked with other options, for official update require to test in the many cases.
Diff:

> diff -r flowchart.js flowchart_diff.js
> 283c283
> <             var line, x = this.getCenter().x, y = this.getCenter().y, right = this.getRight(), bottom = this.getBottom(), top = this.getTop(), left = this.getLeft(), symbolX = symbol.getCenter().x, symbolY = symbol.getCenter().y, symbolTop = symbol.getTop(), symbolRight = symbol.getRight(), symbolLeft = symbol.getLeft(), isOnSameColumn = x === symbolX, isOnSameLine = y === symbolY, isUnder = y < symbolY, isUpper = y > symbolY || this === symbol, isLeft = x > symbolX, isRight = x < symbolX, maxX = 0, lineLength = this.getAttr("line-length"), lineWith = this.getAttr("line-width");
> >             var line, x = this.getCenter().x, y = this.getCenter().y, right = this.getRight(), bottom = this.getBottom(), top = this.getTop(), left = this.getLeft(), symbolX = symbol.getCenter().x, symbolY = symbol.getCenter().y, symbolTop = symbol.getTop(), symbolRight = symbol.getRight(), symbolLeft = symbol.getLeft(), isOnSameColumn = x === symbolX, isOnSameLine = y === symbolY, isUnder = y < symbolY, isUpper = y > symbolY || this === symbol, isLeft = x > symbolX, isRight = x < symbolX, maxX = 0, lineLength = this.getAttr("line-length"), lineWith = this.getAttr("line-width"), maxWidth = this.getAttr("maxWidth");
> 414c414
> <                 x: right.x + lineLength / 2,
> >                 x: right.x + lineLength + (maxWidth / 2) / 2,
> 417c417
> <                 x: right.x + lineLength / 2,
> >                 x: right.x + lineLength + (maxWidth / 2) / 2,

@psychemedia
Copy link

I have another example of this, where the chart is horizontal aligned a decision return path cuts through the decision box.

image

@adrai
Copy link
Owner

adrai commented Jun 18, 2020

Feel free to provide a PR.

@psychemedia
Copy link

I'm not really familiar with js coding in general or this package in particular, although as a user I do find it very useful.

Trying to think through the immediate issues:

  • in the vertical layout example, the routing line needs to extend past an x- co-ordinate greater than the largest x value for the side of any element with a y value between the y_min and y_max of the routing line (assuming y increases up the screen).;
  • in the horizontal layout, the y value of the routing line needs to be grater than the height of every object with an x co-ordinate between the min_x and max_x of the routing line.

@adrai adrai added the Hacktoberfest https://hacktoberfest.digitalocean.com/ label Oct 2, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Hacktoberfest https://hacktoberfest.digitalocean.com/
Projects
None yet
Development

No branches or pull requests

3 participants