Skip to content

Commit 17c27f6

Browse files
committed
Fixed sharing logic in both standalone and editor modes
2 parents 86dca1b + 333f9e2 commit 17c27f6

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

42 files changed

+1062
-829
lines changed

docs/modules/ROOT/images/graph3d.png

52.4 KB
Loading
71.7 KB
Loading

docs/modules/ROOT/nav.adoc

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@
99
*** xref:user-guide/reports/bar-chart.adoc[Bar Chart]
1010
*** xref:user-guide/reports/pie-chart.adoc[Pie Chart]
1111
*** xref:user-guide/reports/line-chart.adoc[Line Chart]
12+
*** xref:user-guide/reports/graph3d.adoc[3D Graph]
1213
*** xref:user-guide/reports/sunburst.adoc[Sunburst]
1314
*** xref:user-guide/reports/circle-packing.adoc[Circle Packing]
1415
*** xref:user-guide/reports/choropleth.adoc[Choropleth]

docs/modules/ROOT/pages/user-guide/extensions/advanced-visualizations.adoc

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ For specific use-cases, these visualizations may convey information that a simpl
55
To use advanced visualizations, enable them in the **Extensions Window**. This makes them selectable inside reports, as well as add examples to the Example window.
66

77
The following visualizations are part of this extension:
8-
8+
- A link:../../reports/graph3d[3D Graph] to visualize a graph in three dimensions.
99
- A link:../../reports/sankey[Sankey Chart] to visualize flows.
1010
- Three charts to plot hierarchical data (link:../../reports/sunburst[Sunburst], link:../../reports/circle-packing[Circle Packing], link:../../reports/treemap[Treemap])
1111
- A link:../../reports/gauge-chart[Gauge Chart] to show percentages.

docs/modules/ROOT/pages/user-guide/reports/graph.adoc

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,7 @@ RETURN p, a, m
2626

2727
image::graph.png[Basic Graph]
2828

29-
== Virtual Graph (apoc is required)
29+
== Virtual Graph
3030

3131
....
3232
MATCH (p:Person)-[:ACTED_IN]->(m:Movie)<-[:ACTED_IN]-(p2:Person)
Lines changed: 135 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,135 @@
1+
= 3D Graph
2+
3+
link:../../extensions/advanced-visualizations[label:Advanced&nbsp;Visualization[]]
4+
5+
The 3D graph report extends the default graph visualization with another dimensions.
6+
It supports ~95% of the features & customizations for the regular (2D) graph, including rule-based styling and report actions.
7+
8+
== Examples
9+
10+
=== Basic Graph
11+
12+
....
13+
MATCH (p:Person)-[a:ACTED_IN]->(m:Movie)
14+
WHERE m.title = 'The Matrix'
15+
RETURN p, a, m
16+
....
17+
18+
image::graph3d.png[Basic 3D Graph]
19+
20+
== Virtual Graph
21+
22+
....
23+
MATCH (p:Person)-[:ACTED_IN]->(m:Movie)<-[:ACTED_IN]-(p2:Person)
24+
WHERE m.title = "The Matrix"
25+
RETURN p, p2, apoc.create.vRelationship(p, "KNOWS", {}, p2)
26+
....
27+
28+
image::graph3dvirtual.png[Virtual 3D Graph]
29+
30+
== Advanced Settings
31+
32+
[width="100%",cols="12%,2%,3%,83%",options="header",]
33+
|===
34+
|Name |Type |Default Value |Description
35+
|Node Color Scheme |List |neodash |The color scheme to use for the node
36+
labels. Colors are assigned automatically (consequitevely) to the
37+
different labels returned by the Cypher query.
38+
39+
|Node Label Color |Text |black |The color of the labels drawn on the
40+
nodes.
41+
42+
|Node Label Font Size |Number |3.5 |Size of the labels drawn on the
43+
nodes.
44+
45+
|Node Size |Number |2 |Default size of a node in the graph
46+
visualization. This size is applied if no custom size styling is defined
47+
and no Rule-Based styling is active.
48+
49+
|Node Size Property |Text |size |Optionally, the name of the node
50+
property to map to the node size. This lets you define sizes on a
51+
node-specific level, if you have a property that directly maps to the
52+
numeric size value.
53+
54+
|Node Color Property |Text |color |Optionally, the name of the node
55+
property to map to the node color. This lets you define colors on a
56+
node-specific level, if you have a property that directly maps to the
57+
HTML color value.
58+
59+
|Relationship Color |Text |#a0a0a0 |The color used for drawing the
60+
relationship arrows in the visualization.
61+
62+
|Relationship Width |Text |1 |The (default) width of the relationship
63+
arrows in the visualization.
64+
65+
|Relationship Label Color |Text |#a0a0a0 |The color of the labels
66+
(relationship type) drawn next to the relationship arrows.
67+
68+
|Relationship Label Font Size |Text |2.75 |The font size of the labels
69+
(relationship type) drawn next to the relationship arrows.
70+
71+
|Relationship Color Property |Text |color |Optionally, the name of the
72+
relationship property to map to the arrow color. This lets you define
73+
colors on a relationship-specific level, if you have a property that
74+
directly maps to the HTML color value.
75+
76+
|Relationship Width Property |Text |width |Optionally, the name of the
77+
relationship property to map to the arrow width. This lets you define
78+
widths on a relationship-specific level, if you have a property that
79+
directly maps to the width value.
80+
81+
|Animated Particles on Relationships |on/off |off |If enabled, draw
82+
relationships with animated particles on them, moving in the direction
83+
of the relationship.
84+
85+
|Arrow head size |Number |3 |Use this to set the length of the arrow head, size is adjusted automatically.
86+
If 0, no arrow will be drawn.
87+
88+
|Background Color |Text |#fafafa |The background color of the
89+
visualization.
90+
91+
|Layout (experimental) |List |force-directed |tree-top-down |tree-bottom-up |tree-left-right |tree-right-left |radial | Use this to switch from
92+
the main (force-directed) layout to one of the experimental layouts
93+
(tree, radial). For the experimental layouts, make sure
94+
your graph is a DAG (directed acyclic graph).
95+
96+
| Graph Depth Separation | Number | 30 | Specify the level distance for the tree layout.
97+
This setting controls the separation between different levels in the tree hierarchy. Adjusting this value impacts the overall spacing of the tree layout in your graph visualization.
98+
99+
|Enable graph exploration |on/off |on |Enables basic exploration functionality for the graph. Exploration can be done by right clicking on a node, and choosing 'Expand' to choose a type to traverse. Data is retrieved real-time and not cached in the visualization.
100+
101+
|Enable graph editing |on/off |off |Enables editing of nodes and relationships in the graph from the right-click context menu. In addition, lets users create new relationships with existing types/property keys as present in the database.
102+
103+
|Show pop-up on Hover |on/off |on |if enabled, shows a pop-up when a
104+
user hovers over one of the nodes/relationships in the visualization.
105+
The pop-up contains the label and properties of the node/relationship.
106+
107+
|Show properties on Click |on/off |on |if enabled, opens up a window
108+
when a user clicks on one of the nodes/relationships in the
109+
visualization. The window contains the label and properties of the
110+
node/relationship.
111+
112+
|Drilldown Link |Text (URL) |(no value) |Specifying a URL here will
113+
display a floating button on the top right of the visualization. This
114+
button can be used to drilldown into a different tool (e.g. Bloom) so
115+
that the graph can be explored further. Dynamic Dashboard Parameters
116+
(e.g. $neodash_person_name) can be used in these links as well.
117+
118+
|Hide Selections |on/off |off |If enabled, hides the property selector
119+
(footer of the visualization).
120+
121+
|Override no data message |Text |Query returned no data. |Override the message displayed to the user when their query returns no data.
122+
123+
|Auto-run query |on/off |on |when activated automatically runs the query
124+
when the report is displayed. When set to `off', the query is displayed
125+
and will need to be executed manually.
126+
|Report Description |markdown text | | When specified, adds another button the report header that opens a pop-up. This pop-up contains the rendered markdown from this setting.
127+
|===
128+
129+
== Rule-Based Styling
130+
131+
Using the link:../#_rule_based_styling[Rule-Based Styling] menu, the
132+
following style rules can be applied to the graph:
133+
134+
- The background color of a node.
135+
- The label color of a node.

docs/modules/ROOT/pages/user-guide/reports/index.adoc

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -93,6 +93,7 @@ pages:
9393
- link:bar-chart[Bar Chart]
9494
- link:pie-chart[Pie Chart]
9595
- link:line-chart[Line Chart]
96+
- link:graph3d[3D Graph]
9697
- link:sunburst[Sunburst]
9798
- link:circle-packing[Circle Packing]
9899
- link:treemap[Treemap]

gallery/tsconfig.json

Lines changed: 2 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,7 @@
11
{
22
"compilerOptions": {
33
"target": "es5",
4-
"lib": [
5-
"dom",
6-
"dom.iterable",
7-
"esnext"
8-
],
4+
"lib": ["dom", "dom.iterable", "esnext"],
95
"allowJs": true,
106
"skipLibCheck": true,
117
"esModuleInterop": true,
@@ -20,7 +16,5 @@
2016
"noEmit": true,
2117
"jsx": "react-jsx"
2218
},
23-
"include": [
24-
"src"
25-
],
19+
"include": ["src"]
2620
}

package.json

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -81,6 +81,7 @@
8181
"react-cool-dimensions": "^2.0.7",
8282
"react-dom": "^17.0.2",
8383
"react-force-graph-2d": "^1.23.8",
84+
"react-force-graph-3d": "^1.24.1",
8485
"react-gauge-chart": "^0.4.1",
8586
"react-grid-layout": "^1.3.4",
8687
"react-leaflet": "^3.2.5",
@@ -97,6 +98,8 @@
9798
"remark-gfm": "^3.0.1",
9899
"reselect": "^4.1.8",
99100
"tailwindcss": "^3.3.2",
101+
"three": "^0.159.0",
102+
"three-spritetext": "^1.8.1",
100103
"use-neo4j": "^0.3.13",
101104
"yaml": "^2.2.1"
102105
},

public/style.css

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -165,7 +165,7 @@
165165
white-space: pre;
166166
background-position: 0px -11px;
167167
padding-right: 0px !important;
168-
margin-top: 0px !important;
168+
margin-top: 0px;
169169
padding-left: 30px;
170170
padding-top: 0px !important;
171171
padding-bottom: 0px !important;

0 commit comments

Comments
 (0)