Format JSON For Cytoscape.js

[connollyst]

Hi there,

The new support for a JSON format has a lot of potential but I haven't found any rendering libraries that support the format out of the box (are you aware of any?). A popular JavaScript network rendering library is Cytoscape.js which has a very very similar JSON structure:

{
    "nodes": [
            { "data": {"id": "a", "label": "A"} },
            { "data": {"id": "b", "label": "B"} }
    ],
    "edges": [
            { "data": {"id": "ab", "source": "a", "target": "b" } }
    ]
}

For reference, the depgraph JSON is structured like so:

{
      "graphName" : "module-1",
      "artifacts" : [
        {
          "id" : "com.github.ferstl:module-1:1.0.0-SNAPSHOT:jar:",
          "numericId" : 1,
          "groupId" : "com.github.ferstl",
          "artifactId" : "module-1",
          "version" : "1.0.0-SNAPSHOT",
          "scopes" : [ "compile" ],
          "types" : [ "jar" ]
        }, {
          "id" : "commons-codec:commons-codec:1.10:jar:",
          "numericId" : 2,
          "groupId" : "commons-codec",
          "artifactId" : "commons-codec",
          "version" : "1.10",
          "scopes" : [ "compile" ],
          "types" : [ "jar" ]
        }
      ],
      "dependencies" : [
        {
          "from" : "com.github.ferstl:module-1:1.0.0-SNAPSHOT:jar:",
          "to" : "commons-codec:commons-codec:1.10:jar:",
          "numericFrom" : 0,
          "numericTo" : 1,
          "resolution" : "INCLUDED"
        }
      ]
}

I'd like to put in a PR to support generating cytoscape.js ready JSON, some questions before I get started:

1. Would that be a good idea? Do you think it fits into your plugin to support individual libraries like this or is it out of scope?
2. Would you want to leave the current JSON as the default, and additionally support the cytoscape.js style JSON? I think making cytoscape.js the default would be a bit too opinionated, do you agree?
3. If we support different "flavors" of JSON, how would you like the user to specify which they want? Any similar configurations I should base this configuration on?

[connollyst]

PS: cytoscape.js has a pretty good force-directed algorithm for laying out nodes. It won't be the same as the hierarchical layout you currently provide from Graphviz but I think it'll be a good additional to depgraph.

[ferstl]

Hi,
I already thought that requests for other JSON formats would come up sooner or later. Actually, the current format is strongly based on the elm-arc-diagram format. Since this library only works with numeric IDs for nodes and edges, I added ID strings to the format. In my opinion this resulted in a nice "generic" format containing all possible information of the dependency graph in a meaningful structure.

Now to your questions:

1. Yes, I think so. Since it is JSON and all graph formats that I saw until now have some concept of "nodes and edges with labels", it would not be so difficult. The rendering of the graph output is also quite separated from the graph construction. So new formats do normally not interfere much with the plugin's infrastructure.
2. That depends a bit on the third question...
3. I see three options. First option, the plugin adds support for specific JSON formats as they are requested. Second option, the plugin keeps its "default" format as it is now and provides some kind of transformation mechanism to generate other formats out of it. Something like XSLT but for JSON or an API hook that gets a JSON string and returns a transformed JSON string. The third option would be a mixture of both, i.e. having a generic format and other specific formats.

I haven't made up my mind which option is the best but currently I tend to option one or three. Option one is the most user-friendly in case a supported format is used. Option three is the most flexible and would address the myriads of Javascript graph libraries with their specific formats or even other formats.

[kitplummer]

Curious about this - I'm looking for any JSON output format that contains a tree/nested structure, dependencies of dependencies. Any movement on this front?

I should add that my interest revolves around a desire to generate new queries to other sources during the processing through the tree, rather than visualizing one-time.

[ferstl]

@kitplummer There hasn't been any progress on this issue since I am a bit short of spare time at the moment.
So does the existing JSON output not work for you?

[davidlday]

I had the same question as @kitplummer - I'm looking for JSON output that gives a nested structure similar to npm's package-lock.json. Really I just need to separate direct and transitive dependencies. I'm not quite grokking the current JSON output yet.