Skip to content

Commit

Permalink
v1.9.0
Browse files Browse the repository at this point in the history
  • Loading branch information
fskpf committed Nov 4, 2024
1 parent d7bf0e7 commit eab7ef4
Show file tree
Hide file tree
Showing 2 changed files with 180 additions and 12 deletions.
158 changes: 158 additions & 0 deletions examples/feature-releases/v1.9.ipynb
Original file line number Diff line number Diff line change
@@ -0,0 +1,158 @@
{
"cells": [
{
"cell_type": "markdown",
"id": "4fba42bb-4dc4-44ce-bc12-bd2ca942c95f",
"metadata": {},
"source": [
"# yFiles Graphs for Jupyter v1.9 <a target=\"_blank\" href=\"https://colab.research.google.com/github/yWorks/yfiles-jupyter-graphs/blob/main/examples/feature-releases/v1.9.ipynb\"><img src=\"https://colab.research.google.com/assets/colab-badge.svg\" alt=\"Open In Colab\"/></a>\n",
"\n",
"Before using the graph widget, install all necessary packages and initialize your widget."
]
},
{
"cell_type": "code",
"execution_count": null,
"id": "e3d2ef93-7793-4a32-b3d6-e1b31cb54846",
"metadata": {},
"outputs": [],
"source": [
"%pip install yfiles_jupyter_graphs --quiet\n",
"from yfiles_jupyter_graphs import GraphWidget\n",
"\n",
"# sample graph for this notebook\n",
"%pip install networkx --quiet\n",
"from networkx import florentine_families_graph"
]
},
{
"cell_type": "markdown",
"id": "37116e66-b781-458f-8983-d6d613d4002f",
"metadata": {},
"source": [
"You can also open this notebook in Google Colab when Google Colab's custom widget manager is enabled:"
]
},
{
"cell_type": "code",
"execution_count": null,
"id": "e971e703-1a83-432b-a7f5-c3a9c62c5afd",
"metadata": {},
"outputs": [],
"source": [
"try:\n",
" import google.colab\n",
" from google.colab import output\n",
" output.enable_custom_widget_manager()\n",
"except:\n",
" pass"
]
},
{
"cell_type": "markdown",
"id": "d8a0a973-6626-4f88-9d90-425785af20fd",
"metadata": {},
"source": [
"<a target=\"_blank\" href=\"https://colab.research.google.com/github/yWorks/yfiles-jupyter-graphs/blob/main/examples/feature-releases/v1.9.ipynb\"><img src=\"https://colab.research.google.com/assets/colab-badge.svg\" alt=\"Open In Colab\"/></a>"
]
},
{
"cell_type": "markdown",
"id": "29e0f82c-2662-4130-92f9-c2660e42b5b5",
"metadata": {},
"source": [
"# Changelog\n",
"\n",
"## New features\n",
"* Support a configurable node-to-cell mapping that is considered by the automatic layout algorithms such that nodes are placed in the given grid cell. Typical use cases may be to highlight a critical path structurally by aligning these nodes in a row/column.\n",
"* Added `circular_straight_line` as new layout option that creates a circular layout with straight connections, instead of the bundled connections of the existing `circular` layout.\n",
"\n",
"## Improvements\n",
"* Adjusted the interactive organic layout settings to make the result more airy.\n",
"* Saved the executed Google Colab state in the example notebooks such that the widget can be tried without executing the notebook in Google Colab.\n",
"\n",
"## Bugfixes\n",
"* Fixed widget resizing issue after switching from map-view to the normal graph view."
]
},
{
"cell_type": "markdown",
"id": "76b5303d-66f7-4476-b6bb-268889721efa",
"metadata": {},
"source": [
"# Node-cell mapping\n",
"\n",
"The new `node_cell` mapping allows to assign specific cells for nodes. This information is considered by the automatic layout algorithms and helps to fine-tune the result, for example to highlight specific structures of the graph or to convey critical information."
]
},
{
"cell_type": "code",
"execution_count": null,
"id": "0181b651-b887-4372-9d44-192f7e291f22",
"metadata": {},
"outputs": [],
"source": [
"w = GraphWidget(graph=florentine_families_graph())\n",
"\n",
"# highlight Medici marriage line\n",
"medici_line = [\"Acciaiuoli\", \"Medici\", \"Albizzi\", \"Guadagni\", \"Lamberteschi\"]\n",
"w.node_color_mapping = lambda node: \"#FF5722\" if node[\"properties\"][\"label\"] in medici_line else \"#78909C\"\n",
"\n",
"# separate the Medici marriage line from the other families in the graph\n",
"def node_to_cell_mapping(node):\n",
" family = node[\"properties\"][\"label\"]\n",
" return (0, 0) if family in medici_line else (0, 2)\n",
"\n",
"w.node_cell_mapping = node_to_cell_mapping\n",
"w.hierarchic_layout()\n",
"display(w)"
]
},
{
"cell_type": "markdown",
"id": "86f0af76-445c-4486-acd0-8a58a19670a9",
"metadata": {},
"source": [
"# New `circular_straight_line` layout option"
]
},
{
"cell_type": "code",
"execution_count": null,
"id": "5cdbeb2a-d7bf-41ec-a63e-859ebeda3156",
"metadata": {},
"outputs": [],
"source": [
"from networkx import florentine_families_graph\n",
"\n",
"w = GraphWidget(graph=florentine_families_graph())\n",
"\n",
"# configure a circular layout with straight, unbundled connections\n",
"w.circular_straight_line_layout()\n",
"\n",
"display(w)"
]
}
],
"metadata": {
"kernelspec": {
"display_name": "Python 3 (ipykernel)",
"language": "python",
"name": "python3"
},
"language_info": {
"codemirror_mode": {
"name": "ipython",
"version": 3
},
"file_extension": ".py",
"mimetype": "text/x-python",
"name": "python",
"nbconvert_exporter": "python",
"pygments_lexer": "ipython3",
"version": "3.12.3"
}
},
"nbformat": 4,
"nbformat_minor": 5
}
34 changes: 22 additions & 12 deletions mkdocs/02_graph_widget.md
Original file line number Diff line number Diff line change
Expand Up @@ -172,9 +172,9 @@ Currently the algorithms use default settings from yFiles library.

**Parameters**

| Name | Type | Description |
| ----------- | ----------- | ----------- |
| `algorithm` | `str` | Specify graph layout (or edge router) algorithm. Available algorithms are: ["circular", "hierarchic", "organic", "orthogonal", "radial", "tree", "orthogonal_edge_router", "organic_edge_router"] |
| Name | Type | Description |
| ----------- | ----------- |----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
| `algorithm` | `str` | Specify graph layout (or edge router) algorithm. Available algorithms are: ["circular", "circular_straight_line", "hierarchic", "organic", "interactive_organic", "orthogonal", "radial", "tree", "map", "orthogonal_edge_router", "organic_edge_router"] |


**Notes**
Expand Down Expand Up @@ -1149,71 +1149,81 @@ For more granular control use nodes and edges properties directly.
&nbsp;

### <a id="circular_layout_method" href="#circular_layout_method"><code>def circular_layout()</code></a><br>
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; Alias for GraphWidget.<a href="#graph_layout_property">graph_layout</a>= "circular".
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; Alias for GraphWidget.<a href="#graph_layout_property">graph_layout</a> = "circular".

See [yFiles circular layout guide](https://docs.yworks.com/yfileshtml/#/dguide/layout-summary#layout_styles-circular)
for more details about this specific algorithm.

&nbsp;

### <a id="circular_straight_line_layout_method" href="#circular_straight_line_layout_method"><code>def circular_straight_line_layout()</code></a><br>
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; Alias for GraphWidget.<a href="#graph_layout_property">graph_layout</a> = "circular_straight_line".

Similar to circular layout but with straight edge paths instead of bundled paths.

See [yFiles circular layout guide](https://docs.yworks.com/yfileshtml/#/dguide/layout-summary#layout_styles-circular)
for more details about this specific algorithm.

&nbsp;

### <a id="hierarchic_layout_method" href="#hierarchic_layout_method"><code>def hierarchic_layout()</code></a><br>
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; Alias for GraphWidget.<a href="#graph_layout_property">graph_layout</a>= "hierarchic".
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; Alias for GraphWidget.<a href="#graph_layout_property">graph_layout</a> = "hierarchic".

See [yFiles hierarchic layout guide](https://docs.yworks.com/yfileshtml/#/dguide/layout-summary#layout_styles-hierarchical)
for more details about this specific algorithm.

&nbsp;

### <a id="organic_layout_method" href="#organic_layout_method"><code>def organic_layout()</code></a><br>
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; Alias for GraphWidget.<a href="#graph_layout_property">graph_layout</a>= "organic".
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; Alias for GraphWidget.<a href="#graph_layout_property">graph_layout</a> = "organic".

See [yFiles organic layout guide](https://docs.yworks.com/yfileshtml/#/dguide/layout-summary#layout_styles-organic)
for more details about this specific algorithm.

&nbsp;

### <a id="orthogonal_layout_method" href="#orthogonal_layout_method"><code>def orthogonal_layout()</code></a><br>
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; Alias for GraphWidget.<a href="#graph_layout_property">graph_layout</a>= "orthogonal".
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; Alias for GraphWidget.<a href="#graph_layout_property">graph_layout</a> = "orthogonal".

See [yFiles orthogonal layout guide](https://docs.yworks.com/yfileshtml/#/dguide/layout-summary#layout_styles-orthogonal)
for more details about this specific algorithm.

&nbsp;

### <a id="radial_layout_method" href="#radial_layout_method"><code>def radial_layout()</code></a><br>
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; Alias for GraphWidget.<a href="#graph_layout_property">graph_layout</a>= "radial".
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; Alias for GraphWidget.<a href="#graph_layout_property">graph_layout</a> = "radial".

See [yFiles radial layout guide](https://docs.yworks.com/yfileshtml/#/dguide/layout-summary#layout_styles-radial)
for more details about this specific algorithm.

&nbsp;

### <a id="tree_layout_method" href="#tree_layout_method"><code>def tree_layout()</code></a><br>
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; Alias for GraphWidget.<a href="#graph_layout_property">graph_layout</a>= "tree".
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; Alias for GraphWidget.<a href="#graph_layout_property">graph_layout</a> = "tree".

See [yFiles tree layout guide](https://docs.yworks.com/yfileshtml/#/dguide/layout-summary#layout_styles-tree)
for more details about this specific algorithm.

&nbsp;

### <a id="orthogonal_edge_router_method" href="#orthogonal_edge_router_method"><code>def orthogonal_edge_router()</code></a><br>
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; Alias for GraphWidget.<a href="#graph_layout_property">graph_layout</a>= "orthogonal_edge_router".
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; Alias for GraphWidget.<a href="#graph_layout_property">graph_layout</a> = "orthogonal_edge_router".

See [yFiles orthogonal edge router guide](https://docs.yworks.com/yfileshtml/#/dguide/layout-summary#layout_styles-polyline_router)
for more details about this specific algorithm.

&nbsp;

### <a id="interactive_organic_layout_method" href="#interactive_organic:layout_method"><code>def interactive_organic_layout()</code></a><br>
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; Alias for GraphWidget.<a href="#graph_layout_property">graph_layout</a>= "interactive_organic_layout".
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; Alias for GraphWidget.<a href="#graph_layout_property">graph_layout</a> = "interactive_organic_layout".

See [yFiles interactive organic layout guide](https://docs.yworks.com/yfileshtml/#/dguide/organic_layout#interactive_organic_layout)
for more details about this specific algorithm.

&nbsp;

### <a id="organic_edge_router_method" href="#organic_edge_router_method"><code>def organic_edge_router()</code></a><br>
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; Alias for GraphWidget.<a href="#graph_layout_property">graph_layout</a>= "organic_edge_router".
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; Alias for GraphWidget.<a href="#graph_layout_property">graph_layout</a> = "organic_edge_router".

See [yFiles organic edge router guide](https://docs.yworks.com/yfileshtml/#/dguide/layout-summary#layout_styles-organic_router)
for more details about this specific algorithm.
Expand Down

0 comments on commit eab7ef4

Please sign in to comment.