7 ms·

Ask HN: Anyone use a code to mindmap/flowchart tool?

103 points by Exorust 3y ago

Is there any really good code to mindmap tool? So that it can take a large codebase and split it into a mindmap?

Michelle99 3y ago
[dead]
a1o 3y ago
Not sure, I have used for non-continuous use the NDepend extension for visual studio to grasp a C++ code base in the past and then exported manually to inkscape to manually rearrange things in a readable way to come up with a single page codebase cheatsheet for easing the onboarding of new devs to a specific code base at work. This is a legacy codebase that isn't expected to change significantly.
wheelinsupial 3y ago
What do you mean by mind map? What's the objective of this exercise? You may have better luck by searching for code to UML diagram generator. There are probably too many UML diagrams, but there are some ways to generate diagrams from the code. Once you have a diagram or two, you can probably simplify it into a mind map that you want to make.
Zolomon 3y ago
Would Mermaid[1] suffice? [1]: https://mermaid.js.org/ https://mermaid.js.org/
solardev 3y ago
Jetbrains IDEs can generate a diagram of your code...https://www.jetbrains.com/help/idea/class-diagram.html https://www.jetbrains.com/help/idea/class-diagram.html I've never really understood the value of this, but it's there.
Towaway69 3y ago
I use Node-Red to create my mind map. It's a flow based programming environment, so my mind map is actually executable. All flows are just very large json files (array of objects), so it's easy enough to generate working flows that can be imported into Node-Red. https://nodered.org https://nodered.org
rib3ye 3y ago
Sounds like AI’s killer app!
westurner 3y ago
markmap: markdown + mindmap: https://markmap.js.org/ https://markmap.js.org/ On why code LLMs should be trained on the edges between tests and the code that they test, that could be visualized as a mindmap DAG with cycles
- westurner 3y ago
  django_extensions/utils/dia2django.py: https://github.com/django-extensions/django-extensions/blob/main/django_extensions/utils/dia2django.py https://github.com/django-extensions/django-extensions/blob/... django_extensions/management/modelviz.py: https://github.com/django-extensions/django-extensions/blob/main/django_extensions/management/modelviz.py https://github.com/django-extensions/django-extensions/blob/... viewflow supports BPMN: https://github.com/viewflow/viewflow https://github.com/viewflow/viewflow https://github.com/viewflow/cookbook/blob/main/guardian_perms/bills/flows.py https://github.com/viewflow/cookbook/blob/main/guardian_perm... Wikipedia mentions security concerns with low-code and no-code apps; and it's rare to impossible for a tool to support round-trip from code -> diagram UI -> code. And the test for isomorphism or functional equivalenve after normalization. https://news.ycombinator.com/item?id=39139198 https://news.ycombinator.com/item?id=39139198 : > All program evolution algorithms tend to produce bloated, convoluted, redundant programs ("spaghetti code"). To avoid this, MOSES performs reduction at each stage, to bring the program into normal form. The specific normalization used is based on Holman's "elegant normal form", which mixes alternate layers of linear and non-linear operators. The resulting form is far more compact than, say, for example, boolean disjunctive normal form. Normalization eliminates redundant terms, and tends to make the resulting code both more human-readable, and faster to execute. "Elements of an expert system for determining the satisfiability of general Boolean expressions" (1990) https://dl.acm.org/doi/10.5555/100095 https://dl.acm.org/doi/10.5555/100095 : > Neither the constraint calculus nor the satisfiability-determination (SD) algorithm require that an expression be in either Conjunctive or Disjunctive Normal Form. IR: Intermediate Representation: https://en.wikipedia.org/wiki/Intermediate_representation https://en.wikipedia.org/wiki/Intermediate_representation How many ways can a compiler generate a code graph from a code graph?
alunchbox 3y ago
I just use excalidraw for free form drawings. Might not be what you need, but the performance and utilities is perfect for my workflow
supershobu 3y ago
You can try codetoflow.com, it doesn't support full codebase but is good enough for single code files.
itpcc 3y ago
I use Mermaid[1]. I used to use Visual Paradigm but it seems excessive (to me at least). Good enough for me, especially with integration into Markdown. [1] https://mermaid.js.org/ https://mermaid.js.org/
- rpmisms 3y ago
  I do too, but there's no codebase to mindmap conversion, which I think was the point of the OP's question. I think he's looking for a code visualization tool.
swozey 3y ago
I use UML quite a bit but it's never really what I'm after, somnething more modern and fluid and gui driven that more people can use where I don't have to manually input every single thing and it can pull in far more complex information like github repos and things of that nature. Icepanel [1] looks really cool but I haven't tested it and I'm not sure it really fits my use case. It seems like it's mostly for api driven rpc/grpc/rest services when I kind of want to use it to visualize backend/infra/terraform sort of things in maybe a C4 style. A lot less microservices involved. Might be interesting to you. [1] - https://icepanel.io/ https://icepanel.io/ ANother cool tool for stuff like this I rarely see is swimm.io for documentation.
xz18r 3y ago
MindManager (https://www.mindmanager.com/ https://www.mindmanager.com/)
tarasglek 3y ago
I originally wrote https://chatcraft.org https://chatcraft.org to help me generate https://mermaid.js.org/ https://mermaid.js.org/ charts quickly. As an accident this resulted in ability to do funny charts like https://twitter.com/tarasglek/status/1656932246018748418 https://twitter.com/tarasglek/status/1656932246018748418 Just last week I discovered https://github.com/skanaar/nomnoml https://github.com/skanaar/nomnoml which llms also seem to know too. It seems like a better mermaid for UML type stuff, intend to integrate it into chatcraft too
- arcanemachiner 3y ago
  Your website completely broke my back button. The first page load was OK, but clicking the drawer made the back button completely inoperable.
sandreas 3y ago
I usually use mermaid.js... From time to time I use svgbob[1]. Sometimes paired with textik[2] or asciiflow[3]. Together with markdown and termsvg[4] these also can be handy for documentation purposes. 1: https://ivanceras.github.io/svgbob-editor https://ivanceras.github.io/svgbob-editor 2: https://textik.com/ https://textik.com/ 3: https://asciiflow.com https://asciiflow.com 4: https://github.com/MrMarble/termsvg https://github.com/MrMarble/termsvg
deleted 3y ago
[deleted]
Exorust 3y ago
I think my question was misunderstood (probably due to my poor explanantion). I was looking for a tool that could convert a codebase into a mindmap. Sort of like: https://resources.jetbrains.com/help/img/idea/2023.3/diagram_editor.png https://resources.jetbrains.com/help/img/idea/2023.3/diagram... https://www.jetbrains.com/help/idea/class-diagram.html#analyze_class https://www.jetbrains.com/help/idea/class-diagram.html#analy...
- geor9e 3y ago
  I'm still not understanding what you want to visualize. I get that you want to create a graph (or tree, the strictly hierarchal subset of graphs). That's what a mindmap is. The rabbit hole goes deep on theory https://en.wikipedia.org/wiki/Graph_theory https://en.wikipedia.org/wiki/Graph_theory . But a lot of different things have that data structure. Do you want to visualize files in folders? You linked to a Java class diagram - so you want the tool to interpret the code? Is it Java? Is it an object-oriented language (i.e. a language with hierarchal class structure)? Are you asking for an automated tool, or do you want to draw the mindmap yourself manually?
- OJFord 3y ago
  You might be able to do it with https://github.com/IBM/tree-sitter-codeviews https://github.com/IBM/tree-sitter-codeviews - though the screenshot in the readme is in much more granular detail than class/ER diagram. I'd be surprised if there isn't a nice way to do this with tree-sitter or LSP, not to mention some language-(..theist?! Not language-agnostic) ways.
- Nezteb 3y ago
  I've asked a similar question in the past [1], perhaps we're both asking about similar things? :D [1] https://news.ycombinator.com/item?id=35603022 https://news.ycombinator.com/item?id=35603022
- Arech 3y ago
  These links points to basically a (very simplified UML) class diagrams. Decent documentation tools, such as Doxygen could do this for a codebase.
- 3y ago
sprine 3y ago
I wish something existed in this space. I used Coati Software's Sourcetrail for a couple of years. Unfortunately it was discontinued. It was a wonderful piece of software that indexed a code repository, and exposed an interface to explore it interactively. At least for me, it significantly improved the understanding and legibility of code. The code is in an archived state (https://github.com/CoatiSoftware/Sourcetrail https://github.com/CoatiSoftware/Sourcetrail). Searching for the software on Google shows some screenshots.
- dannas 3y ago
  I'm still using Sourcetrail daily for inspecting C++ codebases. Works great. I paid for the first beta and was very sad that the company was not profitable. It really is a great product.
deleted 3y ago
[deleted]
mouratoglou 3y ago
I'd recommend you to check https://appmap.io/ https://appmap.io/ a tool which creates diagrams from code execution or tests...
elesiuta 3y ago
Are you looking for something like a call graph? There's pyan3 [1] which although doesn't support python 3.7+, I've still had luck with v1.0.4 which works better for me than its most recent version with python 3.11, but there can be some weird issues though depending on your code style. A quick search also turned up crabviz [2] which has support for more languages than just python. [1] https://github.com/Technologicat/pyan https://github.com/Technologicat/pyan [2] https://github.com/chanhx/crabviz https://github.com/chanhx/crabviz
luke-stanley 3y ago
For Python, Pyreverse is a subproject of Pylint and it can help make diagrams: https://pylint.readthedocs.io/en/latest/pyreverse.html https://pylint.readthedocs.io/en/latest/pyreverse.html It makes class diagrams, it can even output Mermaid diagrams. Also I saw that Aider.chat makes a text "repo map" for GPT-4 to use using some tree-sitters. In the past, I ended up using the Python AST module with LLM's to help me filter for what I was looking for. I was happy to find out recently that there is a way to make Mermaid diagrams WYSIWYG / drag and drop editable that the open source https://excalidraw.com https://excalidraw.com has and did I mention it's open source!? With a LLM, you can go full loop back to Mermaid again after a few rounds of manual editing. "What a time to be alive!" But what I would quite like is bi-directional syncing of code and diagrams. Just as looking at black and white code with no syntax highlighting is not so common, I think there are lots more visual cues and contexts we can integrate in clever ways that use our visual system better. There is a whole wide spectrum of augmentation possible within bidirectional visual programming languages, from auto-generating high level code maps with Mermaid diagrams with LLM generated high level summaries and emojis linking to different sub-systems, to being optionally able to have an X,Y position for a function, perhaps moved somewhere more visually convenient as part of a map. You could probably ask Aider to make Markdown of code actually. I'm not affiliated, I just saw it on here recently. Cool stuff's happening!
- luke-stanley 3y ago
  I meant to say: you could probably ask Aider to make Mermaid diagrams of code actually (which are great saved as Markdown files when you've got a decent Mermaid renderer sorted out), there are VS Code extensions that support Mermaid in Markdown.
- cssanchez 3y ago
  Excalidraw looks like an absolutely amazing tool even on mobile after dome doodling. Thank you so much, I’ve been looking for a good tool to replace Visio with but Draw.io and lucidchart were not to my liking.
cashcache 3y ago
I’m working on this right now! The prototype for Python will be out in a few weeks. https://valla.ai https://valla.ai
- joshelgar 3y ago
  Really cool - keep at it.
- brianjking 3y ago
  This is going to be really, really, really nice. Signed up for your waitlist. Cheers!
tmaly 3y ago
It you have the data, it can be accomplished pretty easily with Graphviz, an open source graphing tool.
aaron695 3y ago
[dead]
brendongeils 3y ago
https://athenaintelligence.ai https://athenaintelligence.ai our product renders mermaid markdown, which has mind map, ERD, flow diagram and other high level components. since we run everything through an agent/llm it’s become an interesting way to literately brainstorm.
- ryapric 3y ago
  Yikes.
smusamashah 3y ago
https://flowchart.fun https://flowchart.fun recently helped a lot with a project.
vanxv 3y ago
why i cannot send ask
vunderba 3y ago
With the significantly larger context window of Gemini, it would be utterly unsurprising to me if you could paste in your entire repository, and ask it to generate mermaid UML.
- sebastianconcpt 3y ago
  BTW did Google signed you an NDA to protect that?
Williams565 3y ago
[dead]
rlupi 3y ago
A non-conventional mention and I am not sure how up to date it is, but I remember looking into https://moosetechnology.org/ https://moosetechnology.org/ a few years ago and it can do far more that you asked. It's open-source. You can read more about it here: http://agilevisualization.com/ http://agilevisualization.com/

103 points by Exorust 3y ago

Is there any really good code to mindmap tool? So that it can take a large codebase and split it into a mindmap?

Michelle99 3y ago

[dead]

a1o 3y ago

Not sure, I have used for non-continuous use the NDepend extension for visual studio to grasp a C++ code base in the past and then exported manually to inkscape to manually rearrange things in a readable way to come up with a single page codebase cheatsheet for easing the onboarding of new devs to a specific code base at work. This is a legacy codebase that isn't expected to change significantly.

wheelinsupial 3y ago

What do you mean by mind map? What's the objective of this exercise? You may have better luck by searching for code to UML diagram generator. There are probably too many UML diagrams, but there are some ways to generate diagrams from the code. Once you have a diagram or two, you can probably simplify it into a mind map that you want to make.

Zolomon 3y ago

Would Mermaid[1] suffice? [1]: https://mermaid.js.org/ https://mermaid.js.org/

solardev 3y ago

Jetbrains IDEs can generate a diagram of your code...https://www.jetbrains.com/help/idea/class-diagram.html https://www.jetbrains.com/help/idea/class-diagram.html I've never really understood the value of this, but it's there.

Towaway69 3y ago

I use Node-Red to create my mind map. It's a flow based programming environment, so my mind map is actually executable. All flows are just very large json files (array of objects), so it's easy enough to generate working flows that can be imported into Node-Red. https://nodered.org https://nodered.org

rib3ye 3y ago

Sounds like AI’s killer app!

westurner 3y ago

markmap: markdown + mindmap: https://markmap.js.org/ https://markmap.js.org/ On why code LLMs should be trained on the edges between tests and the code that they test, that could be visualized as a mindmap DAG with cycles

westurner 3y ago
django_extensions/utils/dia2django.py: https://github.com/django-extensions/django-extensions/blob/main/django_extensions/utils/dia2django.py https://github.com/django-extensions/django-extensions/blob/... django_extensions/management/modelviz.py: https://github.com/django-extensions/django-extensions/blob/main/django_extensions/management/modelviz.py https://github.com/django-extensions/django-extensions/blob/... viewflow supports BPMN: https://github.com/viewflow/viewflow https://github.com/viewflow/viewflow https://github.com/viewflow/cookbook/blob/main/guardian_perms/bills/flows.py https://github.com/viewflow/cookbook/blob/main/guardian_perm... Wikipedia mentions security concerns with low-code and no-code apps; and it's rare to impossible for a tool to support round-trip from code -> diagram UI -> code. And the test for isomorphism or functional equivalenve after normalization. https://news.ycombinator.com/item?id=39139198 https://news.ycombinator.com/item?id=39139198 : > All program evolution algorithms tend to produce bloated, convoluted, redundant programs ("spaghetti code"). To avoid this, MOSES performs reduction at each stage, to bring the program into normal form. The specific normalization used is based on Holman's "elegant normal form", which mixes alternate layers of linear and non-linear operators. The resulting form is far more compact than, say, for example, boolean disjunctive normal form. Normalization eliminates redundant terms, and tends to make the resulting code both more human-readable, and faster to execute. "Elements of an expert system for determining the satisfiability of general Boolean expressions" (1990) https://dl.acm.org/doi/10.5555/100095 https://dl.acm.org/doi/10.5555/100095 : > Neither the constraint calculus nor the satisfiability-determination (SD) algorithm require that an expression be in either Conjunctive or Disjunctive Normal Form. IR: Intermediate Representation: https://en.wikipedia.org/wiki/Intermediate_representation https://en.wikipedia.org/wiki/Intermediate_representation How many ways can a compiler generate a code graph from a code graph?

alunchbox 3y ago

I just use excalidraw for free form drawings. Might not be what you need, but the performance and utilities is perfect for my workflow

supershobu 3y ago

You can try codetoflow.com, it doesn't support full codebase but is good enough for single code files.

itpcc 3y ago

I use Mermaid[1]. I used to use Visual Paradigm but it seems excessive (to me at least). Good enough for me, especially with integration into Markdown. [1] https://mermaid.js.org/ https://mermaid.js.org/

rpmisms 3y ago
I do too, but there's no codebase to mindmap conversion, which I think was the point of the OP's question. I think he's looking for a code visualization tool.

swozey 3y ago

I use UML quite a bit but it's never really what I'm after, somnething more modern and fluid and gui driven that more people can use where I don't have to manually input every single thing and it can pull in far more complex information like github repos and things of that nature. Icepanel [1] looks really cool but I haven't tested it and I'm not sure it really fits my use case. It seems like it's mostly for api driven rpc/grpc/rest services when I kind of want to use it to visualize backend/infra/terraform sort of things in maybe a C4 style. A lot less microservices involved. Might be interesting to you. [1] - https://icepanel.io/ https://icepanel.io/ ANother cool tool for stuff like this I rarely see is swimm.io for documentation.

xz18r 3y ago

MindManager (https://www.mindmanager.com/ https://www.mindmanager.com/)

tarasglek 3y ago

I originally wrote https://chatcraft.org https://chatcraft.org to help me generate https://mermaid.js.org/ https://mermaid.js.org/ charts quickly. As an accident this resulted in ability to do funny charts like https://twitter.com/tarasglek/status/1656932246018748418 https://twitter.com/tarasglek/status/1656932246018748418 Just last week I discovered https://github.com/skanaar/nomnoml https://github.com/skanaar/nomnoml which llms also seem to know too. It seems like a better mermaid for UML type stuff, intend to integrate it into chatcraft too

arcanemachiner 3y ago
Your website completely broke my back button. The first page load was OK, but clicking the drawer made the back button completely inoperable.

sandreas 3y ago

I usually use mermaid.js... From time to time I use svgbob[1]. Sometimes paired with textik[2] or asciiflow[3]. Together with markdown and termsvg[4] these also can be handy for documentation purposes. 1: https://ivanceras.github.io/svgbob-editor https://ivanceras.github.io/svgbob-editor 2: https://textik.com/ https://textik.com/ 3: https://asciiflow.com https://asciiflow.com 4: https://github.com/MrMarble/termsvg https://github.com/MrMarble/termsvg

deleted 3y ago

[deleted]

Exorust 3y ago

I think my question was misunderstood (probably due to my poor explanantion). I was looking for a tool that could convert a codebase into a mindmap. Sort of like: https://resources.jetbrains.com/help/img/idea/2023.3/diagram_editor.png https://resources.jetbrains.com/help/img/idea/2023.3/diagram... https://www.jetbrains.com/help/idea/class-diagram.html#analyze_class https://www.jetbrains.com/help/idea/class-diagram.html#analy...

geor9e 3y ago
I'm still not understanding what you want to visualize. I get that you want to create a graph (or tree, the strictly hierarchal subset of graphs). That's what a mindmap is. The rabbit hole goes deep on theory https://en.wikipedia.org/wiki/Graph_theory https://en.wikipedia.org/wiki/Graph_theory . But a lot of different things have that data structure. Do you want to visualize files in folders? You linked to a Java class diagram - so you want the tool to interpret the code? Is it Java? Is it an object-oriented language (i.e. a language with hierarchal class structure)? Are you asking for an automated tool, or do you want to draw the mindmap yourself manually?
OJFord 3y ago
You might be able to do it with https://github.com/IBM/tree-sitter-codeviews https://github.com/IBM/tree-sitter-codeviews - though the screenshot in the readme is in much more granular detail than class/ER diagram. I'd be surprised if there isn't a nice way to do this with tree-sitter or LSP, not to mention some language-(..theist?! Not language-agnostic) ways.
Nezteb 3y ago
I've asked a similar question in the past [1], perhaps we're both asking about similar things? :D [1] https://news.ycombinator.com/item?id=35603022 https://news.ycombinator.com/item?id=35603022
Arech 3y ago
These links points to basically a (very simplified UML) class diagrams. Decent documentation tools, such as Doxygen could do this for a codebase.
3y ago

sprine 3y ago

I wish something existed in this space. I used Coati Software's Sourcetrail for a couple of years. Unfortunately it was discontinued. It was a wonderful piece of software that indexed a code repository, and exposed an interface to explore it interactively. At least for me, it significantly improved the understanding and legibility of code. The code is in an archived state (https://github.com/CoatiSoftware/Sourcetrail https://github.com/CoatiSoftware/Sourcetrail). Searching for the software on Google shows some screenshots.

dannas 3y ago
I'm still using Sourcetrail daily for inspecting C++ codebases. Works great. I paid for the first beta and was very sad that the company was not profitable. It really is a great product.

deleted 3y ago

[deleted]

mouratoglou 3y ago

I'd recommend you to check https://appmap.io/ https://appmap.io/ a tool which creates diagrams from code execution or tests...

elesiuta 3y ago

Are you looking for something like a call graph? There's pyan3 [1] which although doesn't support python 3.7+, I've still had luck with v1.0.4 which works better for me than its most recent version with python 3.11, but there can be some weird issues though depending on your code style. A quick search also turned up crabviz [2] which has support for more languages than just python. [1] https://github.com/Technologicat/pyan https://github.com/Technologicat/pyan [2] https://github.com/chanhx/crabviz https://github.com/chanhx/crabviz

luke-stanley 3y ago

For Python, Pyreverse is a subproject of Pylint and it can help make diagrams: https://pylint.readthedocs.io/en/latest/pyreverse.html https://pylint.readthedocs.io/en/latest/pyreverse.html It makes class diagrams, it can even output Mermaid diagrams. Also I saw that Aider.chat makes a text "repo map" for GPT-4 to use using some tree-sitters. In the past, I ended up using the Python AST module with LLM's to help me filter for what I was looking for. I was happy to find out recently that there is a way to make Mermaid diagrams WYSIWYG / drag and drop editable that the open source https://excalidraw.com https://excalidraw.com has and did I mention it's open source!? With a LLM, you can go full loop back to Mermaid again after a few rounds of manual editing. "What a time to be alive!" But what I would quite like is bi-directional syncing of code and diagrams. Just as looking at black and white code with no syntax highlighting is not so common, I think there are lots more visual cues and contexts we can integrate in clever ways that use our visual system better. There is a whole wide spectrum of augmentation possible within bidirectional visual programming languages, from auto-generating high level code maps with Mermaid diagrams with LLM generated high level summaries and emojis linking to different sub-systems, to being optionally able to have an X,Y position for a function, perhaps moved somewhere more visually convenient as part of a map. You could probably ask Aider to make Markdown of code actually. I'm not affiliated, I just saw it on here recently. Cool stuff's happening!

luke-stanley 3y ago
I meant to say: you could probably ask Aider to make Mermaid diagrams of code actually (which are great saved as Markdown files when you've got a decent Mermaid renderer sorted out), there are VS Code extensions that support Mermaid in Markdown.
cssanchez 3y ago
Excalidraw looks like an absolutely amazing tool even on mobile after dome doodling. Thank you so much, I’ve been looking for a good tool to replace Visio with but Draw.io and lucidchart were not to my liking.

cashcache 3y ago

I’m working on this right now! The prototype for Python will be out in a few weeks. https://valla.ai https://valla.ai

joshelgar 3y ago
Really cool - keep at it.
brianjking 3y ago
This is going to be really, really, really nice. Signed up for your waitlist. Cheers!

tmaly 3y ago

It you have the data, it can be accomplished pretty easily with Graphviz, an open source graphing tool.

aaron695 3y ago

[dead]

brendongeils 3y ago

https://athenaintelligence.ai https://athenaintelligence.ai our product renders mermaid markdown, which has mind map, ERD, flow diagram and other high level components. since we run everything through an agent/llm it’s become an interesting way to literately brainstorm.

ryapric 3y ago
Yikes.

smusamashah 3y ago

https://flowchart.fun https://flowchart.fun recently helped a lot with a project.

vanxv 3y ago

why i cannot send ask

vunderba 3y ago

With the significantly larger context window of Gemini, it would be utterly unsurprising to me if you could paste in your entire repository, and ask it to generate mermaid UML.

sebastianconcpt 3y ago
BTW did Google signed you an NDA to protect that?

Williams565 3y ago

[dead]

rlupi 3y ago

A non-conventional mention and I am not sure how up to date it is, but I remember looking into https://moosetechnology.org/ https://moosetechnology.org/ a few years ago and it can do far more that you asked. It's open-source. You can read more about it here: http://agilevisualization.com/ http://agilevisualization.com/