diff --git a/docs/antora/modules/ROOT/pages/integration/snowflake.adoc b/docs/antora/modules/ROOT/pages/integration/snowflake.adoc
index d8e9d2f2..1a65d061 100644
--- a/docs/antora/modules/ROOT/pages/integration/snowflake.adoc
+++ b/docs/antora/modules/ROOT/pages/integration/snowflake.adoc
@@ -26,12 +26,13 @@ The nodes will be colored so that nodes from the same table have the same color,
== Example
-In this small example, we import a toy graph representing a social network from two tables in Snowflake.
+In this small example, we import a toy graph representing a social network from two tables in Snowflake, and display it
+as an interactive widget using link:{api-docs-uri}/visualization-graph/#neo4j_viz.VisualizationGraph.render_widget[`render_widget`].
[source, python]
----
from snowflake.snowpark import Session
-from neo4j_viz.snowflake import from_dfs
+from neo4j_viz.snowflake import from_snowflake
# Configure according to your own setup
connection_parameters = {
@@ -82,6 +83,8 @@ VG = from_snowflake(
},
},
)
+
+VG.render_widget()
----
For a full example of the `from_snowflake` importer in action, please see the link:{tutorials-docs-uri}/snowflake-example/[Visualizing Snowflake Tables tutorial].
\ No newline at end of file
diff --git a/examples/snowflake-example.ipynb b/examples/snowflake-example.ipynb
index 7d23be78..1cf64dd1 100644
--- a/examples/snowflake-example.ipynb
+++ b/examples/snowflake-example.ipynb
@@ -233,135 +233,23 @@
"id": "da39f29deb1569e2",
"metadata": {},
"source": [
- "Let us now render our visualization graph, using only default render options."
+ "Let us now render our visualization graph as an interactive widget with `render_widget`, using only default render options.\n",
+ "The widget works in Jupyter environments such as JupyterLab, Notebook 7, VS Code and Colab, and provides two-way sync between Python and JavaScript."
]
},
{
"cell_type": "code",
- "execution_count": 10,
+ "execution_count": null,
"id": "e8b0f4c6",
"metadata": {
"tags": [
"preserve-output"
]
},
- "outputs": [
- {
- "data": {
- "text/html": [
- "\n",
- " \n",
- "
\n",
- "
\n",
- " \n",
- " \n",
- " \n",
- "
\n",
- " \n",
- "
\n",
- "\n",
- " \n",
- " "
- ],
- "text/plain": [
- ""
- ]
- },
- "execution_count": 10,
- "metadata": {},
- "output_type": "execute_result"
- }
- ],
+ "outputs": [],
"source": [
- "VG.render()"
+ "widget = VG.render_widget()\n",
+ "widget"
]
},
{
@@ -387,136 +275,19 @@
"If we are not completely satisfied with the graph is rendered, there are ways to customize it.\n",
"For example, we could change it so that every nodes gets its own color, by using the `color_nodes` method.\n",
"By passing it the `property` \"SNOWFLAKEID\", which will be unique for all nodes, it will give each node a new color.\n",
- "We also make sure to set `override` to override the default coloring."
+ "We also make sure to set `override` to override the default coloring.\n",
+ "\n",
+ "Since we are working with a widget, we can call `color_nodes` directly on it, and the change is synced to the visualization rendered above without having to render the graph again."
]
},
{
"cell_type": "code",
- "execution_count": 11,
+ "execution_count": null,
"id": "a59b91d9cccf9987",
- "metadata": {
- "tags": [
- "preserve-output"
- ]
- },
- "outputs": [
- {
- "data": {
- "text/html": [
- "\n",
- " \n",
- "