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

Long labels truncated when exported as SVG #4918

Open
oryx-it opened this issue Oct 6, 2023 · 5 comments
Open

Long labels truncated when exported as SVG #4918

oryx-it opened this issue Oct 6, 2023 · 5 comments
Labels
Status: Triage Needs to be verified, categorized, etc Type: Bug / Error Something isn't working or is incorrect

Comments

@oryx-it
Copy link

oryx-it commented Oct 6, 2023

Description

When I manage to export anything the labels of longer steps are unfortunately being cut off.

Steps to reproduce

Export as svg and open

Screenshots

image

Code Sample

No response

Setup

  • Mermaid version: Latest and greatest
  • Browser and Version: 16.6 (18615.3.12.11.2)

Suggested Solutions

No response

Additional Context

No response

@oryx-it oryx-it added Status: Triage Needs to be verified, categorized, etc Type: Bug / Error Something isn't working or is incorrect labels Oct 6, 2023
@sarthak15sharma
Copy link

I was unable to reproduce the problem using the live editor. Seems to be working fine

@oryx-it
Copy link
Author

oryx-it commented Oct 8, 2023

Would it make sense that you share what and how you tested?

graph TD A[Start] --> B[Optionale Benachrichtigung für bestimmte Personen über neuen verfügbaren Unterweisungstermin]

image image

@sarthak15sharma
Copy link

Tried the same in the live editor and downloaded the SVG.
image
image

@oryx-it
Copy link
Author

oryx-it commented Oct 9, 2023 via email

@oryx-it
Copy link
Author

oryx-it commented Oct 9, 2023

To add on why we were having different outputs. I did further investigation and the following are the conclusions that I incurred.

Free version
For the free version long texts are not being cut and that applies for every platform. However the short texts are being cut as shown in the sample video below

Sample video for free version
https://github.com/mermaid-js/mermaid/assets/111514654/573c238b-2bba-4e77-9b14-6decf189fcb0

Pro version on macOS

Pro version on windows

On windows the platform portrays the same problems as in macOS whereby the words are still being cut off.
As in the following video is a sample ran on microsoft edge.
https://github.com/mermaid-js/mermaid/assets/111514654/b2bb8065-e95d-4b84-9e72-2ddffc54f56a

End Note
Based on the stated problems it can be seen that the pro version and the free version appear to show the outputs differently.
Henceforth this may also need a solution.

@jgreywolf jgreywolf added include roadmap items to add to roadmap for auto workflow and removed include roadmap items to add to roadmap for auto workflow labels Nov 16, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Status: Triage Needs to be verified, categorized, etc Type: Bug / Error Something isn't working or is incorrect
Projects
None yet
Development

No branches or pull requests

3 participants