(RTL) Schematic view

[Nic30]

Using modified ELKjs + D3.js I am able to generate simple graphs from HDL languages. (SVG/ELK json/MxGraph for draw.io)

It seem to be very promising. (But I have enormous amount of work, thats why it is not done yet.) Screenshots are drawn by simple code https://github.com/Nic30/hwtIde/blob/master/hwtIde/templates/hls/connections_elk.html

It seems to be a good choice to use elk json https://www.eclipse.org/elk/documentation/tooldevelopers/graphdatastructure/jsonformat.html format for schematic representation.

My question is, should I write "schematic visualizer" in hwtIde repo and then join it or I should put it there and develop it there? From my point of view it will be best if I create for example NPM package and we will just install it in hwd-ide.

[Nic30]

update

[eine]

It looks really promising, congratulations!

My question is, should I write "schematic visualizer" in hwtIde repo and then join it or I should put it there and develop it there? From my point of view it will be best if I create for example NPM package and we will just install it in hwd-ide.

I agree. I think that this repo will be a mess if we try to develop everything here. It is cleaner to keep each part/module on a separate repo, but provide some process to use it externally. Then, here we can discuss, comment and share how easy/hard it is to integrate those separately developed modules together. Indeed, this can be the place for integration tests.

For example, although I have not uploaded it yet, I've been trying Golang and Vue.js with WaveDrom and Codemirror:

To build the app I use yarn and webpack. Therefore, if you provide a package.json as in an NPM package, I can directly import it. No need to actually push it to the npm registry, because yarn allows to get it directly from the git repo.

Let me know what you think about this experiment:

• Add two text boxes and SVG to a tab.
• Load the example full_adder.vhd in one of the text boxes, and allow edition.
• Generate the JSON representation and show it in the second text box (not editable).
• From the JSON, generate a schematic which is shown in the SVG.

Do you already have a VHDL to JSON parser/converter in JS or does it require python? If so, I should 'intercept' those queries, since the backend I am using is written in golang. Then, I would catch the queries, execute you python script(s) in the backend, and return the output.

[eine]

nturley/netlistsvg seems to use the same underlying algorithm, but the visualization is not done with D3.js, but with custom JS. I think that D3.js should have useful features to aid in customizing the visualization (skins), so I would keep using it. However, I think that we should note some features:

• Split/Join Wires
• Hiding port names on simple elements, such as gates.

[Nic30]

About performance of ELKjs and D3.js.

I am 100% sure that elkjs can not handle 100k nodes in any form. Layout alg. takes second+ for cca 5K nodes (drawing takes less than noticeable time). (I can deploy an app on accessible server for everyone to see.)

To overcome this problem I am trying to render simplified processes in subcomponets, remove useless assignments (just connections) etc.. Also I merged signals of interfaces to just one wire (if it possible) to minimize count of connections. Nodes looks ugly, but it can be fixed very easily. Problem which I am solving now is dynamic expanding of hierarchy.

[eine]

Is this the code you are talking about? https://github.com/Nic30/hwtIde/tree/master/hwtIde/fromHwtToElk Or is there any other version which you have not uploaded yet?

[Nic30]

Yes, the link is pointing on my current work (backend part). Code works but it not finished ( I will work on it this weekend, plan is to finish

• custom shapes for operators etc, label inside component body, ...
• finally merge logic surrounding statements (processes) into statements
• layouter based on evolutionary alg. and elkjs. ).

[Nic30]

Hello, after so long time I am back. I have tool which automatically generates documentations with schematics. (It is made of packages which I have there on github.) And it is online hwtLib doc.

(It may be a living proof that my grammar is disaster.)

Some components are complicated.

Bitonic sorter is one of most simple.

Crc5 looks nice.

You can take a look and give me feedback If you have a time. (It is far from finish, but it is starts to looking like finished... and it is running in non cached mode that means it is much much slower than it has to be, whole graph is parsed and routed every time in javascript, I would recommend to use chrome, but you are potential users.) (I was really busy last 3 months because of NXP, but I am partially back.)

[Nic30]

And also JS is not minified, which means that you have to download cca 5M of on first run... If you run profiling in browser rendering and roung takes only ~100ms even for cuckooHashTable, but there are redundant check and operations which will be removed or already are removed in newer versions.