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

Image width with mermaid.go is too small when running headless #409

Open
ralph089 opened this issue Jan 18, 2024 · 0 comments
Open

Image width with mermaid.go is too small when running headless #409

ralph089 opened this issue Jan 18, 2024 · 0 comments
Labels

Comments

@ralph089
Copy link

ralph089 commented Jan 18, 2024

What happened?
When using mermaid with mermaid.go in a headless environment the produced image width is too small. The image width is 784 px. Therefore only one shape fits in each row and they are all placed below each other.

8c910226964824ef26e801cf7d5e533839f006a559c4b95f6165155f8d3f794e

What did you expect to happen?
The created image is being produced using more width, so it looks like in the IntelliJ markdown preview or the image in GitHub. The images are displayed there as I would expect them to look like (even if there are differences).

GitHub

C4Context
      title Test Title
      Enterprise_Boundary(b0, "Test") {
          System_Ext(Test, "Test", "Allows customers to view information about their bank accounts, and make payments.")
  
          System_Boundary(b1, "Boundary") {
              
                  System(Test2, "Test2", "Allows customers to view information about their bank accounts, and make payments.")
                  System(Test3, "Test3", "Allows customers to view information about their bank accounts, and make payments.")
                  System(Test4, "Test4", "Allows customers to view information about their bank accounts, and make payments.")
            }

          System_Ext(Test5, "Test5", "Allows customers to view information about their bank accounts, and make payments.")
          SystemQueue_Ext(Test6, "MQ")
      }

      Rel(Test, Test2, "Sample Text", "HTTP")

    Rel(Test3, Test2, "Sample Text", "HTTP")

    UpdateLayoutConfig($c4ShapeInRow="3", $c4BoundaryInRow="1")
Loading

IntelliJ Markdown Viewer:

image

How can we reproduce the behavior you experienced?
Steps to reproduce the behavior:

  1. Create a Markdown file which contains a mermaid diagram with multiple shapes which should be placed next to each other
  2. Run mark using mermaid.go
  3. Compare the image with the one from GitHub

In case this is related to specific markdown, please provide a minimal markdown example here.

```mermaid
C4Context
      title Test Title
      Enterprise_Boundary(b0, "Test") {
          System_Ext(Test, "Test", "Allows customers to view information about their bank accounts, and make payments.")
  
          System_Boundary(b1, "Boundary") {
              
                  System(Test2, "Test2", "Allows customers to view information about their bank accounts, and make payments.")
                  System(Test3, "Test3", "Allows customers to view information about their bank accounts, and make payments.")
                  System(Test4, "Test4", "Allows customers to view information about their bank accounts, and make payments.")
            }

          System_Ext(Test5, "Test5", "Allows customers to view information about their bank accounts, and make payments.")
          SystemQueue_Ext(Test6, "MQ")
      }

      Rel(Test, Test2, "Sample Text", "HTTP")

    Rel(Test3, Test2, "Sample Text", "HTTP")

    UpdateLayoutConfig($c4ShapeInRow="3", $c4BoundaryInRow="1")

Information (please complete the following information)

  • Mark Version (mark --version): 9.11.1
  • Mark Parameters: --debug --mermaid-provider mermaid-go --drop-h1
  • Confluence Hosting: Server
  • Confluence Version: 8.5.4
  • Environment specific Information: running in GitHub Actions using the mark Docker Image
@ralph089 ralph089 added the bug label Jan 18, 2024
@ralph089 ralph089 changed the title Image width with mermaid.go is too small Image width with mermaid.go is too small when running headless Feb 10, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

1 participant