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

Better control over flowchart shape sizes, title text for charts #1250

Closed
jrcharney opened this issue Feb 11, 2020 · 6 comments
Closed

Better control over flowchart shape sizes, title text for charts #1250

jrcharney opened this issue Feb 11, 2020 · 6 comments

Comments

@jrcharney
Copy link

jrcharney commented Feb 11, 2020

I've been using Mermaid in Typora for a couple of months now as well on the live editor to see if there is something in Typora that is not working yet.

After taking a look at the source code for the Flow Chart shapes, one of the most vexing issues is how decisions ("questions"?) are rendered in diamonds.

Often I feel like they get too big, even when using <br> for line breaks to wrap the text.

Part of the issue is that diamonds are drawn as diagonal squares rather than rhombuses (rhombii?)

Rendering such a shape shouldn't be that hard, just allow the user better control over the width and height of the shape. I honestly won't mind it that much if the text overflows outside the shape just a little bit. (Though, it might be a good idea to allow the ability to adjust the text size, which I think might already be implemented.)

Is there a way to add some width and height features for shape nodes?

I also noticed that we can create titles for pie charts, but why not for other diagrams like class charts, flow charts, etc.?

@jrcharney jrcharney added Status: Triage Needs to be verified, categorized, etc Type: Enhancement New feature or request labels Feb 11, 2020
@GDFaber
Copy link
Member

GDFaber commented Feb 11, 2020

Adding titles for flowchart diagrams relates to #556.

@jrcharney
Copy link
Author

Good to know. Add it to documentation.

Now there's just the request for better shape size controls to deal with.

@knsv
Copy link
Collaborator

knsv commented Feb 12, 2020

I would suggest usage of the hexagon shape:
https://mermaid-js.github.io/mermaid/#/flowchart?id=a-hexagon-node

Its not strictly a rectangle but I thing it is more practical:
image

@jrcharney
Copy link
Author

jrcharney commented Feb 18, 2020

While that is a resourceful idea, that is not what the elongated hexagons are used for.

This guide shows what each of the flowchart symbols are used for. And while it states that IBM (who developed the flowchart shapes) now discourages the use of the elongated hexagon since it wasn't used that much by them, another program called Flowgorithm, presents a better use for this shape: loops.

There are a couple of shapes that Mermaid doesn't seem to recreate that seem to be pretty important still. The symbols for documents, for starters.
image

(Those two shapes were not made in Flowgorithm, but they were in a flow chart that I saw in a class I'm taking.)

There are some symbols that are part of Mermaid that don't seem to be recognized, but I think that has to do with the version of the particular Markdown editor I'm using, an issue I will need to take up with them.

@jernejp21
Copy link

I would appreciate to be able to import custom shapes via SVG image.

I'm working in Japanese company and we have special flow chart (Japanese really, really love Word and Excel hence the special shapes). I would like to modernise flow chart drawing procedure but leave shapes they are already using.

Tried with graphviz but very painful Windows installation because of Cairo lib. Not able to convert custom SVG images to PDF.

@jgreywolf
Copy link
Contributor

Closing this issue in favor of #1500

@jgreywolf jgreywolf added DUPE and removed Type: Enhancement New feature or request Status: Triage Needs to be verified, categorized, etc labels Mar 7, 2023
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

5 participants