Recently I've been diving into doing mods for Cities: Skylines 2, which been very interesting as it's one of the first games that is using ECS and that I also have a deep interest into. I've mainly used ECS via Bevy before, but this time it's Unity, but many things still work the same way.

In order to help myself and other modders to navigate the ECS Systems and Components from the decompiled code, I created this interactive D3 graph.

You can click on nodes to "navigate" to that system/component, and once you're zoomed in a particular System/Component, you get a sidebar with more details. Ctrl+click also removes nodes in case you want to temporarily filter something.

This is, in short, how it works:

1. A C# program extracts information from decompiled C# code: https://github.com/Captain-Of-Coit/cs2-ecs-explorer/blob/mas...

2. The program outputs that info as JSON: https://github.com/Captain-Of-Coit/cs2-ecs-explorer/blob/mas...

3. Render with D3.js: https://github.com/Captain-Of-Coit/cs2-ecs-explorer/blob/mas...

Basically it helps people to navigate the Systems and Components references for the game.

If you're feeling brave, you can also browse the full graph which has something like ~700 nodes and ~1200 links: https://captain-of-coit.github.io/cs2-ecs-explorer/ (it'll take a while to first load)

A big problem was to figure out how to make the D3 not too messy when there are large graphs, and I don't think I've succeeded very well with this, but everything I tried (link distance based on how many connections, clustering based on namespaces and so on) made it even worse.

Happy to hear what you think and what I could do better.