Merge pull request #64 from neo4j/coordinate-layout

Add COORDINATE layout

Author: FlorentinD

js-applet/src/index.ts

@@ -1,4 +1,4 @@
-import { NVL } from '@neo4j-nvl/base'
+import { FreeLayoutType, NVL } from '@neo4j-nvl/base'
 import type { Node, NvlOptions, Relationship } from '@neo4j-nvl/base'
 import { DragNodeInteraction, PanInteraction, ZoomInteraction } from '@neo4j-nvl/interaction-handlers'
 
@@ -22,6 +22,10 @@ class PyNVL {
     this.zoomInteraction = new ZoomInteraction(this.nvl)
     this.panInteraction = new PanInteraction(this.nvl)
     this.dragNodeInteraction = new DragNodeInteraction(this.nvl)
+
+    if (options.layout === FreeLayoutType) {
+      this.nvl.setNodePositions(nvlNodes, false)
+    }
   }
 }
 

python-wrapper/src/neo4j_viz/node.py

@@ -34,6 +34,8 @@ class Node(BaseModel, extra="allow"):
     size: Optional[RealNumber] = Field(None, ge=0, description="The size of the node as radius in pixel")
     color: Optional[ColorType] = Field(None, description="The color of the node")
     pinned: Optional[bool] = Field(None, description="Whether the node is pinned in the visualization")
+    x: Optional[RealNumber] = Field(None, description="The x-coordinate of the node")
+    y: Optional[RealNumber] = Field(None, description="The y-coordinate of the node")
 
     @field_serializer("color")
     def serialize_color(self, color: Color) -> str:

python-wrapper/src/neo4j_viz/options.py

@@ -17,7 +17,10 @@ class Layout(str, Enum):
     FORCE_DIRECTED = "forcedirected"
     HIERARCHICAL = "hierarchical"
     GRID = "grid"
-    # TODO expose free layout for X,Y based
+    COORDINATE = "free"
+    """"
+    The coordinate layout sets the position of each node based on the `x` and `y` properties of the node.
+    """
 
 
 class Renderer(str, Enum):

python-wrapper/src/neo4j_viz/resources/nvl_entrypoint/base.js

@@ -12,6 +12,8 @@ def test_nodes_with_all_options() -> None:
         color="#FF0000",
         size=10,
         pinned=True,
+        x=1,
+        y=10,
     )
 
     assert node.to_dict() == {
@@ -22,6 +24,8 @@ def test_nodes_with_all_options() -> None:
         "color": "#ff0000",
         "size": 10,
         "pinned": True,
+        "x": 1,
+        "y": 10,
     }
 
 
@@ -66,3 +70,8 @@ def test_id_aliases(alias: str) -> None:
     assert node.to_dict() == {
         "id": "1",
     }
+
+
+def test_node_validation() -> None:
+    with pytest.raises(ValueError, match="Input should be a valid integer, unable to parse string as an integer"):
+        Node(id="1", x="not a number")

python-wrapper/tests/test_node.py

@@ -12,19 +12,20 @@
     "default": {},
     "force layout": {"layout": Layout.FORCE_DIRECTED},
     "grid layout": {"layout": Layout.GRID},
+    "coordinate layout": {"layout": Layout.COORDINATE},
 }
 
 
 @pytest.mark.parametrize("render_option", render_cases.values(), ids=render_cases.keys())
 def test_basic_render(render_option: dict[str, Any], tmp_path: Path) -> None:
     nodes = [
-        Node(id="4:d09f48a4-5fca-421d-921d-a30a896c604d:0", caption="Person"),
-        Node(id="4:d09f48a4-5fca-421d-921d-a30a896c604d:6", caption="Product"),
-        Node(id="4:d09f48a4-5fca-421d-921d-a30a896c604d:11", caption="Product", pinned=True),
-        Node(id="4:d09f48a4-5fca-421d-921d-a30a896c604d:12", caption="Product"),
-        Node(id="4:d09f48a4-5fca-421d-921d-a30a896c604d:1", caption="Person"),
-        Node(id="4:d09f48a4-5fca-421d-921d-a30a896c604d:7", caption="Product"),
-        Node(id="4:d09f48a4-5fca-421d-921d-a30a896c604d:8", caption="Product"),
+        Node(id="4:d09f48a4-5fca-421d-921d-a30a896c604d:0", caption="Person", x=1, y=10),
+        Node(id="4:d09f48a4-5fca-421d-921d-a30a896c604d:6", caption="Product", x=2, y=15),
+        Node(id="4:d09f48a4-5fca-421d-921d-a30a896c604d:11", caption="Product", x=3, pinned=True),
+        Node(id="4:d09f48a4-5fca-421d-921d-a30a896c604d:12", caption="Product", x=4),
+        Node(id="4:d09f48a4-5fca-421d-921d-a30a896c604d:1", caption="Person", x=5),
+        Node(id="4:d09f48a4-5fca-421d-921d-a30a896c604d:7", caption="Product", x=6),
+        Node(id="4:d09f48a4-5fca-421d-921d-a30a896c604d:8", caption="Product", x=7),
     ]
     relationships = [
         Relationship(

python-wrapper/tests/test_render.py

@@ -0,0 +1,11 @@
+GIT_ROOT=$(git rev-parse --show-toplevel)
+
+set -o errexit
+set -o nounset
+set -o pipefail
+
+(
+    cd "${GIT_ROOT}/js-applet"
+    yarn
+    yarn build
+)