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

Add syntax for double headed arrows #123

Closed
knsv opened this issue Feb 28, 2015 · 31 comments
Closed

Add syntax for double headed arrows #123

knsv opened this issue Feb 28, 2015 · 31 comments
Labels
Milestone

Comments

@knsv
Copy link
Collaborator

knsv commented Feb 28, 2015

This can make diagrams less cluttered.

The obvious syntax: <--> wont work is it will be interpreted as an odd tag by the browser.

Maybe:

*-->

Am open for suggestions and better ideas.

@knsv knsv added the Type: Enhancement New feature or request label Feb 28, 2015
@davidmarkclements
Copy link

Switch the arrows around?

a >--< b

Although that might still cause problems, not sure would need to be explored and cross browser tested.

Bit of a leap, but the duality of the plus-minus could be considered "two way",

a -±> b

That's easy on a mac keyboard (top left under esc), Win and Linux users would need to use key combos by default

The third option is to simply render codependent entities as a single double-headed arrow,

a --> b
b --> a

As far as I can see the meaning is the same, but the visual is improved.
You could always add an option to render arrows separately in the event of
an unforeseen use case.

@knsv knsv added this to the 0.5.3 milestone Oct 4, 2015
@agladysh
Copy link

a ->> b?

Anyway, I'd like to see this feature too

@knsv
Copy link
Collaborator Author

knsv commented Oct 7, 2016

We should support this. I would happily add contributions in this area.
The ->> syntax is a little to close a regular arrow I think.

The >--< option is intuitive in one way but odd in another way. My favorite, but strong opionions are appreviated.

The third option is the obvious one and if nothing else, this has to work. Regardless of any shorter syntax agreed upon:

a --> b
b --> a

@agladysh
Copy link

agladysh commented Oct 7, 2016

How should one force two separate arrows (i.e. the current behavior) when using two entries? This is sometimes needed for readability.

@CyborgMaster
Copy link

I like either >--< or *-->

@yieme
Copy link

yieme commented Aug 30, 2017

I like *--> or maybe even --* for both ways

@zegal-cn
Copy link

zegal-cn commented Oct 9, 2017

*-*

@axgkl
Copy link

axgkl commented Nov 14, 2017

When at this one I would highly appreciate to be able to just reverse the direction of single headed arrow as well.

Rationale: In a TD diag the arrangement on the screen heavily depends on entities left or right. And so I'm often in the conflict of having EITHER a good arrangement but then with logically wrong or no arrow heads OR the right arrow direction.

Should I open a new one for this? Since I think it can be done within the work for this one...

@yxliang01
Copy link

Would be appreciated if this can be implemented soon since it has been 3 years.

@KoalaBear84
Copy link

I just wanted a line with on both sides an arrow, looks like it is not possible

@snowyu
Copy link

snowyu commented Jul 4, 2018

Use the unicode Char(LONG LEFT RIGHT ARROW): “⟷” to be more intuitive.

@CyborgMaster
Copy link

@snowyu, the main argument against a unicode character is Mermaid's inspiration by Markdown. One of the main advantages is the ability for developers to easily type these files with a standard text editor. That becomes much more difficult if the characters used are not found on a standard keyboard.

I still advocate for a syntax using normal ASCII characters. Possibly *-->.

@snowyu
Copy link

snowyu commented Jul 5, 2018

I have been using markdown too. You can copy-paste in the graphic env easily.

Even in the terminal env, for instance, in the Vim text-editor you could enter insert mode and press Ctrl + V + U and then the code-point number as a 4-digit hexadecimal number (pad with zeros if necessary). So you would type Ctrl + V + U 2 7 f 7.

I think this is not a conflict with the using ASCII characters. It could be supported both way.
But It seems to find a proper ASCII characters hardly. So the unicode way could be supported first.

@adavidzh
Copy link

adavidzh commented Dec 5, 2018

Would be appreciated if this can be implemented soon since it has been 3 years.

I agree. What's needed?

@FDiskas
Copy link

FDiskas commented Apr 18, 2019

Simple <-->

@davidmarkclements
Copy link

Read the very first comment.

@knsv
Copy link
Collaborator Author

knsv commented Jun 28, 2019

This one is implemented with the syntax <-->

@knsv knsv closed this as completed Jun 28, 2019
@KoalaBear84
Copy link

But it does not work? Any guidance? (Or is the live editor not updated)
https://mermaidjs.github.io/mermaid-live-editor/

@phuongnd08
Copy link

phuongnd08 commented Sep 2, 2019

@knsv As of 8.2.6, double headed arrow is still not rendered. It is accepted by the processor though.

This

      graph TD
      A[Christmas] <-->|Get money| B(Go shopping)
      B --> C{Let me thinksssssx<br/>sssssssssssssssssssuuu<br />tttsssssssssssssssssssssss}
      C -->|One| D[Laptop]
      C -->|Two| E[iPhone]
      C -->|Three| F[Car]

get rendered to this
image

@yieme
Copy link

yieme commented Sep 2, 2019

@knsv thank you for the double arrow support. This is awesome! I've been able to confirm what @phuongnd08 is seeing with the mermaid live editor.

It also looks like the live editor is using version, 8.2.6, as: https://mermaidjs.github.io/mermaid-live-editor/src.95fd6b94.js contains: module.exports={name:"mermaid-live-editor",version:"0.2.0", ... ,mermaid:"^8.2.6", ...

@heavysixer
Copy link

heavysixer commented Dec 4, 2019

@knsv, thanks for all the work you've provided for this lib. I just pulled master and built it from source and was unable to get the double arrows to render correctly. I see that there are specs (which pass) but when trying it in an editor the double arrow is ignored though no error occurs. Just and FYI. I am happy to help debug this further but since this is day one of me looking at the source i'm still trying to get my bearings. Please let me know where i can be of service.

@tamvm
Copy link

tamvm commented Dec 30, 2019

@phuongnd08 you can "hack" double headed arrows with classDiagram as this example: https://mermaid-js.github.io/mermaid/#/?id=class-diagram-experimental

@qchenevier
Copy link

@heavysixer @yieme @phuongnd08 I could get the double arrow using the flowchart type diagram instead of the default graph one.

Just begin your graph definition with flowchart instead of graph.

Example here in the live editor

@davesatt
Copy link

I see that double arrows were added to flowcharts, but sequence diagrams are the place I most want double arrows. For things such as bidirectional media in SIP Call Flows.
sip_calling_fig1

@nagashi
Copy link

nagashi commented Feb 20, 2022

How does one have an arrow point to the left if it's at all possible?

@vallamost
Copy link

vallamost commented Aug 23, 2023

Why isn't this supported in Sequence diagrams on here? https://mermaid-js.github.io

No arrows are rendered, it's just a line when using syntax like: A1<-->B1

@ynagarjuna2012
Copy link

Support for Sequence diagrams is needed for both side arrows.

@Justin-Garey
Copy link
Contributor

Can you point to where in the code the syntax for sequence diagrams is parsed? I think syntax with A->>B could be extended to A->*B for arrow in "all" (both) directions.

@tulisachin
Copy link

tulisachin commented Dec 6, 2023

Any Solution for the both sided arrow in sequence diagrams?

@Jinwook94
Copy link

Please add both side arrows in sequence diagrams. Thanks.

@Justin-Garey
Copy link
Contributor

For anyone looking at this in the future, the bidirectional arrows were added today in #5209.

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