Ask HN: Anyone use a code to mindmap/flowchart tool?
Is there any really good code to mindmap tool? So that it can take a large codebase and split it into a mindmap?
48 comments
For Python, Pyreverse is a subproject of Pylint and it can help make diagrams: 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 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!
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 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!
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.
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.
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.
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...
https://www.jetbrains.com/help/idea/class-diagram.html#analy...
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...
https://www.jetbrains.com/help/idea/class-diagram.html#analy...
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 . 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?
You might be able to do it with 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.
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.
Understand from Scitools has nice graph generators, including a dependency graph generator that might be what you are looking for. Not free and not hobbyist-cheap, but relatively inexpensive as commercial static analysis tools go.
Scitools is amazing for looking through massive legacy codebases. I wish it was free or there was an open source alternative that was as good.
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
[1] https://news.ycombinator.com/item?id=35603022
I generally use Doxygen, turning on all possible graphs. It’s good because it can parse a variety of languages.
You don’t get really nice graphs, but enough to get started to understand the code base.
These links points to basically a (very simplified UML) class diagrams.
Decent documentation tools, such as Doxygen could do this for a codebase.
Decent documentation tools, such as Doxygen could do this for a codebase.
I’m working on this right now! The prototype for Python will be out in a few weeks. https://valla.ai
This is going to be really, really, really nice. Signed up for your waitlist. Cheers!
Really cool - keep at it.
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/
[1] https://mermaid.js.org/
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.
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
[2] https://github.com/chanhx/crabviz
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
[2] https://github.com/chanhx/crabviz
I originally wrote https://chatcraft.org to help me generate https://mermaid.js.org/ charts quickly. As an accident this resulted in ability to do funny charts like https://twitter.com/tarasglek/status/1656932246018748418
Just last week I discovered 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
Just last week I discovered 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
Your website completely broke my back button.
The first page load was OK, but clicking the drawer made the back button completely inoperable.
The first page load was OK, but clicking the drawer made the back button completely inoperable.
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/
ANother cool tool for stuff like this I rarely see is swimm.io for documentation.
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/
ANother cool tool for stuff like this I rarely see is swimm.io for documentation.
Would Mermaid[1] suffice?
[1]: https://mermaid.js.org/
[1]: https://mermaid.js.org/
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). Searching for the software on Google shows some screenshots.
The code is in an archived state (https://github.com/CoatiSoftware/Sourcetrail). Searching for the software on Google shows some screenshots.
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.
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
2: https://textik.com/
3: https://asciiflow.com
4: https://github.com/MrMarble/termsvg
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
2: https://textik.com/
3: https://asciiflow.com
4: https://github.com/MrMarble/termsvg
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.
This is a legacy codebase that isn't expected to change significantly.
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.
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.
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
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
Jetbrains IDEs can generate a diagram of your code...https://www.jetbrains.com/help/idea/class-diagram.html
I've never really understood the value of this, but it's there.
I've never really understood the value of this, but it's there.
markmap: markdown + mindmap: 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
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
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/...
viewflow supports BPMN: https://github.com/viewflow/viewflow 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 :
> 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 :
> 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
How many ways can a compiler generate a code graph from a code graph?
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/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 :
> 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 :
> 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
How many ways can a compiler generate a code graph from a code graph?
A non-conventional mention and I am not sure how up to date it is, but I remember looking into 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/
It's open-source.
You can read more about it here: http://agilevisualization.com/
I'd recommend you to check https://appmap.io/
a tool which creates diagrams from code execution or tests...
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.
BTW did Google signed you an NDA to protect that?
I just use excalidraw for free form drawings. Might not be what you need, but the performance and utilities is perfect for my workflow
https://flowchart.fun recently helped a lot with a project.
MindManager (https://www.mindmanager.com/)
You can try codetoflow.com, it doesn't support full codebase but is good enough for single code files.
It you have the data, it can be accomplished pretty easily with Graphviz, an open source graphing tool.
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.
Yikes.
[deleted]
[deleted]
why i cannot send ask
Sounds like AI’s killer app!