Would it be possible to generate a block diagram as scratch in mermaid?

[ghost]

Hi all. I would like to know if it is possible to generate this diagram with mermaid-js.

When you are programming there are things like 'scratch-language' which is block programming. Would it be possible to generate a block diagram with mermaid?

[dwhelan]

I think that would be possible if you were up to writing support for a new diagram type say scratch (parser, shape code etc.). The shapes, layout etc would be new d3js code that would leverage pre-existing mermaid code.

I'm curious how you would use this and what it would give you that the scratch online editor does not.

[ghost]

Hi dwhelan.

I'm curious how you would use this and what it would give you that the scratch online editor does not.

• I like mermaid-js and I want to use it for all possible cases from building algorithms to organizational management. I find it easier to create a text file and then generate a diagrammed image over this. So... mermaid-js has been an excellent project compared to existing tools, I don't say that mermaid is better as if the existing tools are bad.
• I say it's better, because my experience of using it has been constant and great with mermaid-js. In this sense, I'm currently studying about planning and teaching programming with scratch... and I thought if there was a way to structure scratch in mermaid-js.

[dwhelan]

Very cool ... I am new to mermaid and I'm drawn to it for similar reasons :). I really see it as a game changer for visual documentation.

I am creating a mermaid Causal Loop Diagram (one of my favourite tools with organizational management) and I learned a lot along the way. So what you are suggesting IMO is very doable. I essentially copied the flowchart diagram code into a new causal folder and started adjusting it to fit my needs. I mention this because if you wanted to see what the code might look like I would suggest looking at https://github.com/mermaid-js/mermaid/tree/develop/src/diagrams/user-journey.