@visual-analytics-components/graph-component

A network visualization component for disaggregated visualization.

Usage no npm install needed!

<script type="module">
  import visualAnalyticsComponentsGraphComponent from 'https://cdn.skypack.dev/@visual-analytics-components/graph-component';
</script>

README

graph-vac

A network visualization component for disaggregated visualization.

Configuration Options

  • id (string): The instance identifier for this component.
  • isLayoutSupported (boolean, optional): Whether this component should present layout controls.
  • attemptInitialLayout (boolean, optional): If the data is unpositioned, should this component attempt an initial 2D layout of the graph data.
  • is3DSupported (boolean, optional): A flag indicating whether this visual should expose a control allowing the user to select either 2D or 3D views.
  • emitsViewportHighlights (boolean, optional): A flag indicating whether this visual should emit events for when vertices are highlighted via hover actions.
  • receivesViewportHighlights (boolean, optional): A flag indicating whether this visual should accept events for when vertices are highlighted to synchronize highlights.
  • renderSettings: (TensorGraphRenderSettings, optional): A settings object specific to rendering.

TensorGraphRenderSettings

  • constantEdgeWidth (boolean, optional): a flag indicating whether edges should have a consistent width vs a width variable on edge weight (default=true).
  • cornerAxes (boolean, optional): a flag indicating whether the axes guides should be rendered in the corner (e.g. minimap-style).
  • drawAxes (boolean, optional): a flag indicating whether the axes should be drawn at all (default=true).
  • drawEdges (boolean, optional): A flag indicating whether to draw the edges of the graph data (default=false).
  • drawNodes (boolean, optional): A flag indicating whether to draw the vertices of the graph data (default=true).
  • edgeAlpha (number, optional): A number between [0-1] indicating the edge opacity.
  • edgeAntialias (boolean, optional): A flag indicating whether to use antialiasing when rendering edges (default=false).
  • edgeDepthWrite (boolean, optional): A flag indicating whether to use depth-writing when rendering edges (default=false).
  • edgeMaxWidth (number, optional): The maximum width of edges to render.
  • edgeMinWidth (number, optional): The minimum width of edges to render.
  • hideDeselected (boolean, optional): Whether to hide/occlude deselected vertices (default=false).
  • hideEdgesOnMove (boolean, optional): A flag indicating whether to hide edges when moving the graph (default=false).
  • hideNodesOnMove (boolean, optional): A flag indicating whether to hide nodes when moving the graph (default=false).
  • interpolationTime (boolean, optional): Interpolation time to use when animating between positions.
  • is3D (boolean, optional): Whether to render in 3D mode (default=false).
  • nodeMaxRadius (number, optional): The minimum rendering radius of the nodes.
  • nodeMinRadius (number, optional): The maximum rendering radius of the nodes.
  • nodeOutline (boolean, optional): A flag indicating whether to render node outlines.