Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Switch visualization library to vis.js, add new features #60

Merged
merged 2 commits into from
May 2, 2023

Conversation

chisholm
Copy link
Contributor

This PR makes comprehensive changes to the visualization, including the following features and changes:

  • The stix2viz module is rewritten to use vis.js
  • Graph physics is now disabled after it has "settled". This means dragging one node won't affect the rest of the graph after it has settled, and nodes stay where you dropped them
  • Node "pinning" has been removed due to aforementioned disabling of physics
  • Changes inspired by PR Reworked display to allow object details via JSON. Added link view. #52 have been implemented:
    • There are new configuration options:
      • One can express mongo-query-like criteria describing which STIX objects should be used to create the graph. The PR used this for "decluttering", but object filtering can serve other purposes.
    • The demo application has been improved:
      • STIX object rendering in the selected object box has been improved with some syntax highlighting, and the structure and property values are presented in a JSON-like style without alteration. Ref property values are clickable to navigate to the referenced object.
      • A new info box is added which shows incoming and outgoing edges to/from the selected graph node. The edge items are expandable to show the object at the other end of the edge, and one can click to navigate to the other object
      • If there are too many nodes in the graph data, the user is asked if they want to use an alternative textual list-based "visualization"
  • In support of the alternative visualization idea described above, the stix2vis module architecture and API is changed to separate creation of graph data from its visualization
  • The per-type configuration sections now support an "embeddedRelationships" setting which allows user customization of how embedded relationships are converted to graph edges
  • In the demo, legend items are now clickable, which toggles visibility of nodes of the clicked type
  • Configuration setting names are normalized to camelCase, to align with the Javascript style of the stix2viz module
  • Add a README for the stix2viz module (configuration settings are documented here)

@clenk
Copy link
Contributor

clenk commented Mar 14, 2023

Additional context for the switch to vis.js: The vis.js library is higher level and easier to work with than D3. To address #12 we would have needed to understand the nuances and upgrade several versions of D3. Another automatic benefit is that in the current visualization code, multiple relationships between the same two objects will overlap each other be hard to read. Vis.js automatically curves the relationship arrows so they don't overlap.

are from the old PR52 and got in due to a rebase, and I just
hadn't noticed.  Their presence doesn't hurt, but they don't
belong there.  Better to delete them.
@ejratl ejratl merged commit 6c9269f into oasis-open:master May 2, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants