Structured text > PEGjs > D3js > Diagrams


Hi all,
I discovered Atom yesterday, I wanted to say: wow.

So, I have this idea. Why would you use a text editor? Because you’re working on structured texts, obviously. Hence there could be a package allowing visualization of structured data: XML, ontology, algorithm, whatever.

Authors create visual interpreters with PEGjs. Visual interpreters can be searched and downloaded from a list, like packages and themes. D3js renders diagrams inside Atom. Straight.

I’m not sure I have skills to do this on my own, but I can learn. For now I only want to collect feedback about this idea.

How does it sound?


Sounds like an interesting idea. Can you give an example of a scenario and what sort of visual representation you’re proposing?

If I’m understanding your idea correctly, I believe this kind of thing has been done before. Just look at Microsoft FrontPage or Adobe Dream Weaver. The problem with these kinds of tools is that they generally create excess cruft in the generated text output. This makes it so that everyone has to use the tool to easily edit the generated output. Plain text has the benefit that it is easier for anyone to read and update no matter what tool they’re using. How would you prevent this issue?


WYSIWYG editors generate structured text from visual objects manipulation.

The idea here is the opposite process: it’s about generating visual representations from structured text.

The aim is not to generate text, but rather to analyse it. Say you have an ontology in RDF/Turtle syntax. The file that contains it can be huge and hard to explore. Now if you can download a visual interpreter to generate diagrams out of it, this ontology would be easier to understand with help of visual representation. Or, if you have a C++ class, you could have a several visual interpreters to analyse different aspects of this class.

I’m trying very hard to be clear, sorry but english is not my mother tongue.


You’re being clear. I didn’t understand that you were only talking about reading rather than reading and writing. To a basic extent, Atom already has abilities like you’re mentioning, either built-in or in third-party packages:

But more is always better! :grinning:


What I would like to see - and I’m not sure if it’s possible, it may just be super difficult - is a dependency diagram of a project’s code.
You know, automatically generate a flow chart of sorts that links all my modules, functions and globals etc, and generates some visually pleasing diagram, output onto a second pane and exportable into SVG.

I’m sure D3 is the thing to use, and perhaps someone has done it for one type of opinionated project or another. But if you have it one type, you could expose a service and let others keep adding it for other types of projects and frameworks.

That would be delicious.


Yes, dependency diagramming and regex-railroad are exactly what I’m talking about. Dependency diagram should be possible, since we have access to everything in Atom, including the project treeview.

There’s a lot of visual helpers we could think of, and before it grows wildly in the package system (and I believe this is inevitable if we do nothing), they should all be unified in a single package dedicated to searching and downloading visual interpreters. The whole thing should be carefully designed. Let’s not dash in.

[ EDIT ]

I imagine that when the user right clicks on a file in treeview, the context menu would show a “Visualize >” entry, which contains visual interpreters to apply to this file. This would open a new pane containing the diagram.

For dependency diagrams, it would probably be two steps: first build a text file containing the data structure (with another tool), then apply a visual interpreter to this text file.

I’m already in love with Atom. First I’ll make another Electron project, to get used to it, then I’ll get back to this one.