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.

Sign up for GitHub

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

Jump to bottom

Positioning is broken #5706

Open
Reabstraction opened this issue Aug 9, 2024 · 4 comments · May be fixed by #6119
Open

Positioning is broken #5706

Reabstraction opened this issue Aug 9, 2024 · 4 comments · May be fixed by #6119
Labels
Status: Triage Needs to be verified, categorized, etc Type: Bug / Error Something isn't working or is incorrect

Comments

@Reabstraction
Copy link

Reabstraction commented Aug 9, 2024 •
edited
Loading

Description

When I use a block of a width greater than 3, positioning gets incredibly strange and the renderer seems to miscount items (They aren't correct width, and aren't offset by the correct amount)

Steps to reproduce

  • Put the code sample into the live editor
  • Witness overlapping and strangely sized items

Screenshots

Image of issue

Code Sample

block-beta
    columns 4

    block:0_0:4
        columns 6
            Example:2
        space:2
        ExampleOther:2
        ExampleOther:1
        block:0_0_0:6
            a b c d e f g h
        end
    end

Setup

  • Mermaid version: v10.9.1
  • Browser and Version: Firefox 129.0
    Firefox about screen

Suggested Solutions

The parser seems to miscalculate the widths somehow?
Using just two columns in the top-level block and graph fixes it somehow

Additional Context

No response
@Reabstraction Reabstraction added Status: Triage Needs to be verified, categorized, etc Type: Bug / Error Something isn't working or is incorrect labels Aug 9, 2024
@NealGooch
Copy link

Hi, I've been having problems with nested blocks where different column widths are applied. I think I've found the issue and solved it.

After applying my fix you layout becomes:
image

is this correct?

If so the line in error is

mermaid/packages/mermaid/src/diagrams/block/layout.ts

Line 64 in df636c6

maxWidth = width / (block.widthInColumns ?? 1);

It should read:
maxWidth = width / (child.widthInColumns ?? 1);

Would be grateful if you can confirm - if so I will submit a pull request with the fix.
Neal

@stickgrinder
Copy link

I have this issue as well and I think this is the PR by @NealGooch that fixes the problem: #6119

(@NealGooch just to mention that you references the wrong issue id in the PR description, just in case you want to fix it for backtracking)

I would really appreciate a revision of that PR, since it seems to fix this problem.
Thanks

@NealGooch
Copy link

Ooops...do the hard bit of fixing the code and then mess up the PR!!

Will happily correct and rebase to latest as I suspect that will help with the automated testing that flagged lots issues that I don't believe are at all related.

Neal

@NealGooch
Copy link

@stickgrinder have you tried my fix and did it work for you?

@NealGooch NealGooch linked a pull request Jan 12, 2025 that will close this issue
Open
4 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
Status: Triage Needs to be verified, categorized, etc Type: Bug / Error Something isn't working or is incorrect
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

Fix 5706 Block Positioning when nesting and blocks span columns NealGooch/mermaid
3 participants
@stickgrinder @NealGooch @Reabstraction