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 images to flowchart boxes / connections #4

Open
stefan123t opened this issue Apr 6, 2022 · 0 comments
Open

Add images to flowchart boxes / connections #4

stefan123t opened this issue Apr 6, 2022 · 0 comments

Comments

@stefan123t
Copy link

stefan123t commented Apr 6, 2022

Many thanks for this great addition to markdown in general which allows to render PDF just fine!

I would like to use either ![alt desc](img/image.fmt) or some flowchart style option to add images to flowchart boxes / connections.
I already tried default markdown syntax and also background-image: url("img/image.fmt"); css style of an otherwise scaled box.

```mermaid
flowchart TD
    step1("Step 1. ![alt desc](img/image-step1.fmt)") 
    step2("Step 2. ![alt desc](img/image-step2.fmt)") 

    step1 -->|"1.-2. ![alt desc](img/image-step1-2.fmt)"| step2

    style step1 fill:#f9f,stroke:#333,stroke-width:4px,background-image: url("img/image.fmt")
    linkStyle "1.-2. ![alt desc](img/image-step1-2.fmt)" step1 fill:#f9f,stroke:#333,stroke-width:4px,background-image: url("img/image.fmt")
\```

I have tried both and neither of the two methods works for me:

  1. the box descriptions are interpreted / remain literal
  2. the linkStyle and style properties remain ignored

You should remove the \ to have a working example.

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

1 participant