diff --git a/docs-2.0/nebula-explorer/ex-ug-page-overview.md b/docs-2.0/nebula-explorer/ex-ug-page-overview.md new file mode 100644 index 00000000000..dbfd2d676b9 --- /dev/null +++ b/docs-2.0/nebula-explorer/ex-ug-page-overview.md @@ -0,0 +1,49 @@ +# Page overview + +This topic introduces the Explorer page to help you learn more about Explorer's functions. + +The Explorer page consists of two modules navigation bar and canvas. + +![explorer-overview](figs/explorer-overview-1.png) + +!!! note + + After logging into Explorer, select a graph space and click on it to unlock query and exploration functions in the left-side navigation bar. + +![explorer-overview-graph_space](figs/explorer-overview-graphspace.png) + +## Navigation bar + +Click the icons in the left-side navigation bar to import, analyze, and explore graph data. The descriptions of the icons are as follows: + +| Icon | Description | +| ----- | ---- | +| ![query](figs/nav-query2.png) | Enter VIDs or tags to query data. For more information, see [Ways to query data](ex-ug-query-exploration.md). | +| ![filter](figs/nav-filter.png) | Search for target vertexes displayed on the canvas. For more information, see [Filter vertices](node-filtering.md). | +| ![expand](figs/nav-expand.png) | Perform explorations on the vertices on the canvas by setting edge directions, steps, and filtering conditions. | +| ![commonNeighbor](figs/nav-commonNeighbor.png) | Select at least two vertices on the canvas to search for their common neighbors. | +| ![findPath](figs/nav-findPath.png) | Find all paths, the shortest path, and the non-loop paths from the source to the destination vertex. | +| ![propertyView](figs/nav-propertyView.png) | Choose whether to display the properties of vertices or edges on the canvas. | +| ![hide](figs/nav-miss.png) | Hide the selected vertices and edges on the canvas. | +| ![hideReverse](figs/nav-missReverse.png) | Hide the unselected vertices and edges on the canvas. | +| ![Revoke](figs/nav-Revoke.png) | Undo the action in the previous step. | +| ![Redo](figs/redo.png) | Restores the action that was previously undone. | +| ![snapshot](figs/snapshot-history.png) | View historical snapshots. For more information, see [Canvas snapshots](canvas-operations/canvas-snapshot.md). | +| ![graphSpace](figs/nav-graphSpace.png) | View all graph spaces. Click a graph space to create a canvas corresponding to it. | +| ![Help](figs/nav-help.png) | View Explorer documents and Nebula Graph forum. | +| ![Setup](figs/nav-setup.png) | View your account and shortcuts, edit languages, limit returned results, and clear connection.| +| ![Console](figs/nav-console.png) | Query data by entering nGQL statements. Querying results are imported on canvas. For more information, see [Explorer console](explorer-console.md). | + +## Canvas + +Graph data can be displayed visually on a canvas. The canvas consists of the following parts: + +- Tabs on the Top +- Visualization modes +- Data storage +- Search box +- Layouts +- Minimap +- Data overview + +For more information, see [Canvas overview](canvas-operations/canvas-overview.md). \ No newline at end of file diff --git a/docs-2.0/nebula-explorer/operation-guide/ex-ug-page-overview.md b/docs-2.0/nebula-explorer/operation-guide/ex-ug-page-overview.md deleted file mode 100644 index c255a0aeab9..00000000000 --- a/docs-2.0/nebula-explorer/operation-guide/ex-ug-page-overview.md +++ /dev/null @@ -1,94 +0,0 @@ -# Page Overview - -This topic describes Explorer main page. - -## Overview - -![Explorer](../figs/explorer-en.png) -The main page of Explorer is divided into five parts: - -- Tab bar -- Sidebar -- Canvas -- Minimap -- Relationship list - -## Tab bar - -- Export: Export a CSV or PNG file of the current view. - -- Create: Support creating multiple canvases. Only up to 10 canvases can be opened. - -## Sidebar - -The sidebar consists of five parts. You can click the buttons to explore the graph, modify the content of the vertexes on the canvas, etc. - -- Start query: Before exploring, the user needs to query the vertexes and display them in the canvas. - -- Canvas operation: Including frame selection of vertexes in the canvas, dragging the canvas, and selecting multiple vertexes and edges. - -- Graph exploration and expansion: Including functions such as vertexes expansion, finding common neighbors of multiple vertexes, finding the path of two vertexes, and inspecting the property. - -- Hide and undo: Hide the data displayed in the canvas and undo the previous operation. - -- Settings and help: Switch graph space, find help, modify settings, etc. - -### Start query - -- Start: Click the ![query](../figs/nav-query.png) icon to query the data and display it on the page through VID, Tag and sub-graph. - -### Canvas operation - -- Frame selection mode: Click the ![frameSelect](../figs/nav-frameSelect.png) icon to support frame selection of vertexes and edges in the canvas. -- Click to select multiple vertexes and edges: Click the ![singleSelect](../figs/nav-singleSelect.png) icon, you can easily click the vertexes and edges in the canvas, and click the blank space to cancel the selection. -- Move the canvas: Click the ![moveCanvas](../figs/nav-moveCanvas.png) icon to drag the position of the canvas. -- Vertex Filter: Click the ![filter](../figs/nav-filter.png) icon to filter the vertexes displayed on the canvas. - -For more information, see [Canvas Operation](../operation-guide/ex-ug-canvas.md). - -### Graph exploration and expansion - -- Expand: Click the ![expand](../figs/rightclickmenu-expand.png) icon, select the vertexes on the page and perform custom expansion, including direction, steps, filter conditions, etc. -- Common neighbor: Click the ![commonNeighbor](../figs/rightclickmenu-commonNeighbor.png) icon, select at least two vertexes on the page and view their common neighbors. -- Search path: Click the ![findPath](../figs/rightclickmenu-findPath.png) icon to query the path of `all paths`, `Shortest path` or `Noloop path` between the start vertex and the end vertex. -- Inspect property: Click the ![propertyView](../figs/nav-propertyView.png) icon to choose whether to display the property values of vertexes or edges in the canvas. - -For more information, see [Graph exploration and expansion](../operation-guide/ex-ug-graph-exploration.md). - -### Hide and undo - -- Dismiss: Click the ![miss](../figs/nav-miss.png) icon to hide the selected vertexes and edges in the canvas. -- Dismiss others: Click the ![missreverse](../figs/nav-missReverse.png) icon to hide all unselected vertexes and edges in the canvas. -- Undo: Click the ![Revoke](../figs/nav-Revoke.png) icon to undo the operation in the previous step. - -### Settings and help - -- Switch graph space: Click the ![graphSpace](../figs/nav-graphSpace.png) icon to switch the current graph space. -- Help: Click the ![help](../figs/nav-help.png) icon to see more information. -- Setting: Click the ![setup](../figs/nav-setup.png) icon to view usernames and shortcut keys, modify language settings, clear Explorer connect, etc. - -## Canvas - -The canvas is mainly divided into: - -- Canvas: Display the data queried by VID, Tag or subgraph. - -- Vertexes and Edges overview: It is hidden by default and only displayed when the vertex and edge are selected on the current canvas. Click on the icon in the following, and the user can open the menu to view the detailed data of the selected vertexes and edges in the current canvas. - - ![review](../figs/ex-ug-027-1.png) - -For more information, see [canvas operation](../operation-guide/ex-ug-canvas.md). - -## Minimap - -You can use the button on the minimap to switch the graph mode, display the vertexes in the canvas in full screen, collapse the minimap, zoom in or zoom out the canvass, etc. At the same time, the percentage of the graph in the canvas to the total graph is displayed in the lower-left corner of the minimap. - -- Switch mode: You can switch the display mode of the graph in the canvas. - - | icon | ![force](../figs/Thumbnail-graphView.png) | ![dagre](../figs/Thumbnail-treeView.png) | ![circular](../figs/Thumbnail-sphereView.png) | - | ---- | ---- |----| ----| - | mode | force | dagre | circular | - -## Relationship list - -Click the ![unfold](../figs/sidebar-unfold.png) icon on the right, you can open the menu, view the number of tags and edges in the canvas, search for tags and edges, and also support modifying the color and icon of the vertex.