github.com/cayleygraph/cayley@v0.7.7/docs/ui-overview.md (about)

     1  # UI Overview
     2  
     3  ## Sidebar
     4  
     5  Along the side are the various actions or views you can take. From the top, these are:
     6  
     7  * Run Query \(run the query\)
     8  * Gizmo \(a dropdown, to pick your query language, MQL is the other\)
     9    * [GizmoAPI.md](gizmoapi.md): This is the one of the two query languages used either via the REPL or HTTP interface.
    10    * [MQL.md](mql.md): The _other_ query language the interfaces support.
    11  * Query \(a request/response editor for the query language\)
    12  * Query Shape \(a visualization of the shape of the final query. Does not execute the query.\)
    13  * Visualize \(runs a query and, if tagged correctly, gives a sigmajs view of the results\)
    14  * Write \(an interface to write or remove individual quads or quad files\)
    15  * Documentation \(this documentation\)
    16  
    17  ## Visualize
    18  
    19  To use the visualize function, emit, either through tags or JS post-processing, a set of JSON objects containing the keys `source` and `target`. These will be the links, and nodes will automatically be detected.
    20  
    21  For example:
    22  
    23  ```javascript
    24  [
    25    {
    26      source: "node1",
    27      target: "node2"
    28    },
    29    {
    30      source: "node1",
    31      target: "node3"
    32    }
    33  ];
    34  ```
    35  
    36  Other keys are ignored. The upshot is that if you use the "Tag" functionality to add "source" and "target" tags, you can extract and quickly view subgraphs.
    37  
    38  ```text
    39  // Visualize who dani follows.
    40  g.V("<dani>").Tag("source").Out("<follows>").Tag("target").All()
    41  ```
    42  
    43  The visualizer expects to tag nodes as either "source" or "target." Your source is represented as a blue node. While your target is represented as an orange node. The idea being that our node relationship goes from blue to orange \(source to target\).
    44