examples/02a_label_styles_mapping.ipynb

{
  "cells": [
    {
      "cell_type": "markdown",
      "id": "8b919f4a-fd0e-49b2-90c7-f538cdb68288",
      "metadata": {
        "id": "8b919f4a-fd0e-49b2-90c7-f538cdb68288"
      },
      "source": [
        "# Element Label Mapping <a target=\"_blank\" href=\"https://colab.research.google.com/github/yWorks/yfiles-jupyter-graphs/blob/main/examples/02a_label_styles_mapping.ipynb\"><img src=\"https://colab.research.google.com/assets/colab-badge.svg\" alt=\"Open In Colab\"/></a>"
      ]
    },
    {
      "cell_type": "markdown",
      "id": "08db2296-9111-4446-b82d-6afa54a3c13b",
      "metadata": {
        "id": "08db2296-9111-4446-b82d-6afa54a3c13b"
      },
      "source": [
        "This notebook covers the basics of customizing label visualizations for nodes and edges.\n",
        "\n",
        "For mapping demonstrations, we'll use the same graph, ```erdos_renyi_graph```, imported from the NetworkX package.\n",
        "\n",
        "For more details on how to import graph data, explore the other example notebooks or refer to the full widget [documentation](https://yworks.github.io/yfiles-jupyter-graphs/).\n",
        "\n",
        "Before utilizing the graph widget, ensure all necessary packages are installed."
      ]
    },
    {
      "cell_type": "code",
      "execution_count": 1,
      "id": "3ce520a0-0c33-48ae-ab02-54d7aba460a8",
      "metadata": {
        "colab": {
          "base_uri": "https://localhost:8080/",
          "height": 86
        },
        "id": "3ce520a0-0c33-48ae-ab02-54d7aba460a8",
        "outputId": "2086b997-dbf5-4d27-b89a-82a46063636b"
      },
      "outputs": [
        {
          "output_type": "stream",
          "name": "stdout",
          "text": [
            "\u001b[2K   \u001b[90m━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━\u001b[0m \u001b[32m15.6/15.6 MB\u001b[0m \u001b[31m37.1 MB/s\u001b[0m eta \u001b[36m0:00:00\u001b[0m\n",
            "\u001b[2K   \u001b[90m━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━\u001b[0m \u001b[32m139.8/139.8 kB\u001b[0m \u001b[31m2.7 MB/s\u001b[0m eta \u001b[36m0:00:00\u001b[0m\n",
            "\u001b[2K   \u001b[90m━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━\u001b[0m \u001b[32m2.3/2.3 MB\u001b[0m \u001b[31m12.9 MB/s\u001b[0m eta \u001b[36m0:00:00\u001b[0m\n",
            "\u001b[2K   \u001b[90m━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━\u001b[0m \u001b[32m1.6/1.6 MB\u001b[0m \u001b[31m18.8 MB/s\u001b[0m eta \u001b[36m0:00:00\u001b[0m\n",
            "\u001b[?25h"
          ]
        }
      ],
      "source": [
        "%pip install yfiles_jupyter_graphs --quiet\n",
        "from yfiles_jupyter_graphs import GraphWidget\n",
        "%pip install networkx --quiet\n",
        "from typing import Dict\n",
        "from networkx import erdos_renyi_graph\n",
        "\n",
        "g = erdos_renyi_graph(10, 0.3, 2)\n",
        "w = GraphWidget(graph=g)\n"
      ]
    },
    {
      "cell_type": "markdown",
      "id": "e090cf46-b02f-42af-9a91-279b3440ecf6",
      "metadata": {
        "id": "e090cf46-b02f-42af-9a91-279b3440ecf6"
      },
      "source": [
        "You can also open this notebook in Google Colab when Google Colab's custom widget manager is enabled:"
      ]
    },
    {
      "cell_type": "code",
      "execution_count": 2,
      "id": "d99602b7-b89b-46bb-a477-00172006ac05",
      "metadata": {
        "id": "d99602b7-b89b-46bb-a477-00172006ac05"
      },
      "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": "1addb8c7-84ee-47ac-aa5b-6d1b69e4d0c7",
      "metadata": {
        "id": "1addb8c7-84ee-47ac-aa5b-6d1b69e4d0c7"
      },
      "source": [
        "<a target=\"_blank\" href=\"https://colab.research.google.com/github/yWorks/yfiles-jupyter-graphs/blob/main/examples/02a_label_styles_mapping.ipynb\"><img src=\"https://colab.research.google.com/assets/colab-badge.svg\" alt=\"Open In Colab\"/></a>"
      ]
    },
    {
      "cell_type": "markdown",
      "id": "aab103ba-9d3b-4d39-bb4e-3bdfac2566d6",
      "metadata": {
        "id": "aab103ba-9d3b-4d39-bb4e-3bdfac2566d6"
      },
      "source": [
        "This is the graph we will be working on:"
      ]
    },
    {
      "cell_type": "code",
      "execution_count": 3,
      "id": "1a87056a-a345-4221-ad19-d1440a63f08e",
      "metadata": {
        "colab": {
          "base_uri": "https://localhost:8080/",
          "height": 517,
          "referenced_widgets": [
            "f12458d67e7b4fde8c94e8efd7fa60db",
            "21722ca1cc2d41d3a6efb25ea83dde35"
          ]
        },
        "id": "1a87056a-a345-4221-ad19-d1440a63f08e",
        "outputId": "b5ed2a8d-d773-4473-fbdc-b8513c15f2ac"
      },
      "outputs": [
        {
          "output_type": "display_data",
          "data": {
            "text/plain": [
              "GraphWidget(layout=Layout(height='500px', width='100%'))"
            ],
            "application/vnd.jupyter.widget-view+json": {
              "version_major": 2,
              "version_minor": 0,
              "model_id": "f12458d67e7b4fde8c94e8efd7fa60db"
            }
          },
          "metadata": {
            "application/vnd.jupyter.widget-view+json": {
              "colab": {
                "custom_widget_manager": {
                  "url": "https://ssl.gstatic.com/colaboratory-static/widgets/colab-cdn-widget-manager/2b70e893a8ba7c0f/manager.min.js"
                }
              }
            }
          }
        }
      ],
      "source": [
        "display(GraphWidget(graph=g))"
      ]
    },
    {
      "cell_type": "markdown",
      "id": "81e2d7a1-6653-467a-8e87-c5f888145774",
      "metadata": {
        "id": "81e2d7a1-6653-467a-8e87-c5f888145774"
      },
      "source": [
        "## Node Label Styles Mapping\n",
        "\n",
        "Additionally to the shown label text mapping in [02 Label Mapping](./02_label_mapping.ipynb), the mapping function may also return styling properties alongside the `text`.\n",
        "\n",
        "Supported visualization properties:\n",
        "* `fontSize: number`: The text size of the label.\n",
        "* `fontWeight: 'bold' | 'bolder' | 'lighter' | 'normal'`: The font thickness.\n",
        "* `color: string`: The text color of the label.\n",
        "* `backgroundColor: string`: A color string that is used as the label's background.\n",
        "* `position: 'center' | 'north' | 'east' | 'south' | 'west'`: The label position at the node.\n",
        "* `maximumWidth: number`: The maximum width of the label. By default, the label is clipped at the given size, or wrapped when `wrapping` is set.\n",
        "* `maximumHeight: number`: The maximum height of the label. Clips the label at the given height. May be combined with `wrapping`.\n",
        "* `wrapping: 'character' | 'character_ellipsis' | 'none' | 'word' | 'word_ellipsis'`: Text wrapping for the label. Must be set in combination with `maximumWidth`.\n",
        "* `textAlignment: 'center' | 'left' | 'right'`: The horizontal text alignment when `wrapping` is enabled.\n",
        "\n",
        "For this, we define a new label mapping function and, instead of just returning a text string, we return a dictionary with a `text` property and optional styling properties:"
      ]
    },
    {
      "cell_type": "code",
      "execution_count": 4,
      "id": "371c5053-6019-4a20-af67-067f38fcbf39",
      "metadata": {
        "id": "371c5053-6019-4a20-af67-067f38fcbf39"
      },
      "outputs": [],
      "source": [
        "from datetime import datetime\n",
        "\n",
        "def custom_label_styles_mapping(node: Dict):\n",
        "    \"\"\"let the label be the negated purple big index\"\"\"\n",
        "    return {\n",
        "        'text' : datetime.now().strftime(\"%Y-%m-%d %H:%M:%S\"),\n",
        "        'backgroundColor': '#5C268B',\n",
        "        'fontSize': 20,\n",
        "        'color': '#FF6EC7',\n",
        "        'position': 'north',\n",
        "        'maximumWidth': 130,\n",
        "        'wrapping': 'word',\n",
        "        'textAlignment': 'center',\n",
        "        'fontWeight': 'bold'\n",
        "    }"
      ]
    },
    {
      "cell_type": "markdown",
      "id": "d306b597-678e-4a07-90f1-401bff0bc7c5",
      "metadata": {
        "id": "d306b597-678e-4a07-90f1-401bff0bc7c5"
      },
      "source": [
        "Let's set our new label styles:"
      ]
    },
    {
      "cell_type": "code",
      "execution_count": 5,
      "id": "938719a0-d739-4ddf-8f7f-da00c1d05012",
      "metadata": {
        "colab": {
          "base_uri": "https://localhost:8080/",
          "height": 104
        },
        "id": "938719a0-d739-4ddf-8f7f-da00c1d05012",
        "outputId": "07c541c3-9074-4357-d844-2fd12e12345d"
      },
      "outputs": [
        {
          "output_type": "execute_result",
          "data": {
            "text/plain": [
              "<function __main__.custom_label_styles_mapping(node: Dict)>"
            ],
            "text/html": [
              "<div style=\"max-width:800px; border: 1px solid var(--colab-border-color);\"><style>\n",
              "      pre.function-repr-contents {\n",
              "        overflow-x: auto;\n",
              "        padding: 8px 12px;\n",
              "        max-height: 500px;\n",
              "      }\n",
              "\n",
              "      pre.function-repr-contents.function-repr-contents-collapsed {\n",
              "        cursor: pointer;\n",
              "        max-height: 100px;\n",
              "      }\n",
              "    </style>\n",
              "    <pre style=\"white-space: initial; background:\n",
              "         var(--colab-secondary-surface-color); padding: 8px 12px;\n",
              "         border-bottom: 1px solid var(--colab-border-color);\"><b>custom_label_styles_mapping</b><br/>def custom_label_styles_mapping(node: Dict)</pre><pre class=\"function-repr-contents function-repr-contents-collapsed\" style=\"\"><a class=\"filepath\" style=\"display:none\" href=\"#\">/content/&lt;ipython-input-4-44266fa75f6f&gt;</a>let the label be the negated purple big index</pre></div>"
            ]
          },
          "metadata": {},
          "execution_count": 5
        }
      ],
      "source": [
        "w.set_node_label_mapping(custom_label_styles_mapping)\n",
        "w.get_node_label_mapping()"
      ]
    },
    {
      "cell_type": "code",
      "execution_count": 6,
      "id": "a45c9447-74ba-48a1-bdcb-acb6e3bec468",
      "metadata": {
        "colab": {
          "base_uri": "https://localhost:8080/",
          "height": 517,
          "referenced_widgets": [
            "7c74023174774bf8b723924ba780ac4e",
            "6151dcf7c75e4e1cbb48ada2e3ce3ef2"
          ]
        },
        "id": "a45c9447-74ba-48a1-bdcb-acb6e3bec468",
        "outputId": "9e27cc80-cfb5-49d8-a6f7-40b2f08f9e6e"
      },
      "outputs": [
        {
          "output_type": "display_data",
          "data": {
            "text/plain": [
              "GraphWidget(layout=Layout(height='500px', width='100%'))"
            ],
            "application/vnd.jupyter.widget-view+json": {
              "version_major": 2,
              "version_minor": 0,
              "model_id": "7c74023174774bf8b723924ba780ac4e"
            }
          },
          "metadata": {
            "application/vnd.jupyter.widget-view+json": {
              "colab": {
                "custom_widget_manager": {
                  "url": "https://ssl.gstatic.com/colaboratory-static/widgets/colab-cdn-widget-manager/2b70e893a8ba7c0f/manager.min.js"
                }
              }
            }
          }
        }
      ],
      "source": [
        "display(w)"
      ]
    },
    {
      "cell_type": "markdown",
      "id": "711a763a-e897-4e2b-bca0-4a4640c5f235",
      "metadata": {
        "id": "711a763a-e897-4e2b-bca0-4a4640c5f235"
      },
      "source": [
        "If the mapping is deleted, it reverts back to the default mapping."
      ]
    },
    {
      "cell_type": "code",
      "execution_count": 7,
      "id": "5f64587f-1035-4649-a751-32022baac797",
      "metadata": {
        "colab": {
          "base_uri": "https://localhost:8080/",
          "height": 121
        },
        "id": "5f64587f-1035-4649-a751-32022baac797",
        "outputId": "7bcfa97c-cbc9-4496-89da-504adf44f319"
      },
      "outputs": [
        {
          "output_type": "execute_result",
          "data": {
            "text/plain": [
              "<bound method GraphWidget.default_node_label_mapping of GraphWidget(layout=Layout(height='500px', width='100%'))>"
            ],
            "text/html": [
              "<div style=\"max-width:800px; border: 1px solid var(--colab-border-color);\"><style>\n",
              "      pre.function-repr-contents {\n",
              "        overflow-x: auto;\n",
              "        padding: 8px 12px;\n",
              "        max-height: 500px;\n",
              "      }\n",
              "\n",
              "      pre.function-repr-contents.function-repr-contents-collapsed {\n",
              "        cursor: pointer;\n",
              "        max-height: 100px;\n",
              "      }\n",
              "    </style>\n",
              "    <pre style=\"white-space: initial; background:\n",
              "         var(--colab-secondary-surface-color); padding: 8px 12px;\n",
              "         border-bottom: 1px solid var(--colab-border-color);\"><b>yfiles_jupyter_graphs.widget.GraphWidget.default_node_label_mapping</b><br/>def default_node_label_mapping(index: int, node: TDict)</pre><pre class=\"function-repr-contents function-repr-contents-collapsed\" style=\"\"><a class=\"filepath\" style=\"display:none\" href=\"#\">/usr/local/lib/python3.10/dist-packages/yfiles_jupyter_graphs/widget.py</a>See default element label mapping.</pre>\n",
              "      <script>\n",
              "      if (google.colab.kernel.accessAllowed && google.colab.files && google.colab.files.view) {\n",
              "        for (const element of document.querySelectorAll('.filepath')) {\n",
              "          element.style.display = 'block'\n",
              "          element.onclick = (event) => {\n",
              "            event.preventDefault();\n",
              "            event.stopPropagation();\n",
              "            google.colab.files.view(element.textContent, 1519);\n",
              "          };\n",
              "        }\n",
              "      }\n",
              "      for (const element of document.querySelectorAll('.function-repr-contents')) {\n",
              "        element.onclick = (event) => {\n",
              "          event.preventDefault();\n",
              "          event.stopPropagation();\n",
              "          element.classList.toggle('function-repr-contents-collapsed');\n",
              "        };\n",
              "      }\n",
              "      </script>\n",
              "      </div>"
            ]
          },
          "metadata": {},
          "execution_count": 7
        }
      ],
      "source": [
        "w.del_node_label_mapping()\n",
        "w.get_node_label_mapping()"
      ]
    },
    {
      "cell_type": "markdown",
      "id": "1d216797-d219-4d9e-a4f4-808dcb8bd390",
      "metadata": {
        "id": "1d216797-d219-4d9e-a4f4-808dcb8bd390"
      },
      "source": [
        "## Edge Label Mapping\n",
        "\n",
        "Similar to the node labels mapping function, the edge label mapping function may also return styling properties alongside the `text`.\n",
        "\n",
        "It supports the same optional visualization properties:\n",
        "* `fontSize: number`: The text size of the label.\n",
        "* `fontWeight: 'bold' | 'bolder' | 'lighter' | 'normal'`: The font thickness.\n",
        "* `color: string`: The text color of the label.\n",
        "* `backgroundColor: string`: A color string that is used as the label's background.\n",
        "\n",
        "Here, we will use the same mapping function as for the nodes. Let's set our new edge styles:"
      ]
    },
    {
      "cell_type": "code",
      "execution_count": 8,
      "id": "3cb41d68-d190-4e48-b91d-58a8973463c7",
      "metadata": {
        "colab": {
          "base_uri": "https://localhost:8080/",
          "height": 104
        },
        "id": "3cb41d68-d190-4e48-b91d-58a8973463c7",
        "outputId": "a4153917-9fac-48c6-8da7-b42012995c0c"
      },
      "outputs": [
        {
          "output_type": "execute_result",
          "data": {
            "text/plain": [
              "<function __main__.custom_label_styles_mapping(node: Dict)>"
            ],
            "text/html": [
              "<div style=\"max-width:800px; border: 1px solid var(--colab-border-color);\"><style>\n",
              "      pre.function-repr-contents {\n",
              "        overflow-x: auto;\n",
              "        padding: 8px 12px;\n",
              "        max-height: 500px;\n",
              "      }\n",
              "\n",
              "      pre.function-repr-contents.function-repr-contents-collapsed {\n",
              "        cursor: pointer;\n",
              "        max-height: 100px;\n",
              "      }\n",
              "    </style>\n",
              "    <pre style=\"white-space: initial; background:\n",
              "         var(--colab-secondary-surface-color); padding: 8px 12px;\n",
              "         border-bottom: 1px solid var(--colab-border-color);\"><b>custom_label_styles_mapping</b><br/>def custom_label_styles_mapping(node: Dict)</pre><pre class=\"function-repr-contents function-repr-contents-collapsed\" style=\"\"><a class=\"filepath\" style=\"display:none\" href=\"#\">/content/&lt;ipython-input-4-44266fa75f6f&gt;</a>let the label be the negated purple big index</pre></div>"
            ]
          },
          "metadata": {},
          "execution_count": 8
        }
      ],
      "source": [
        "w2 = GraphWidget(graph=g)\n",
        "w2.set_edge_label_mapping(custom_label_styles_mapping)\n",
        "w2.get_edge_label_mapping()"
      ]
    },
    {
      "cell_type": "code",
      "execution_count": 9,
      "id": "70a11fd8-e8ff-40ce-ba01-94762d3fd78d",
      "metadata": {
        "colab": {
          "base_uri": "https://localhost:8080/",
          "height": 517,
          "referenced_widgets": [
            "49303956ce5647a2bab53c596a32260f",
            "162c93df17c44c2a8ed58f8dfa6aff1f"
          ]
        },
        "id": "70a11fd8-e8ff-40ce-ba01-94762d3fd78d",
        "outputId": "0c5ddc8e-ab9b-4263-b746-7ee6ebb3f5c1"
      },
      "outputs": [
        {
          "output_type": "display_data",
          "data": {
            "text/plain": [
              "GraphWidget(layout=Layout(height='500px', width='100%'))"
            ],
            "application/vnd.jupyter.widget-view+json": {
              "version_major": 2,
              "version_minor": 0,
              "model_id": "49303956ce5647a2bab53c596a32260f"
            }
          },
          "metadata": {
            "application/vnd.jupyter.widget-view+json": {
              "colab": {
                "custom_widget_manager": {
                  "url": "https://ssl.gstatic.com/colaboratory-static/widgets/colab-cdn-widget-manager/2b70e893a8ba7c0f/manager.min.js"
                }
              }
            }
          }
        }
      ],
      "source": [
        "display(w2)"
      ]
    },
    {
      "cell_type": "markdown",
      "id": "f80d8bcd-6f6f-48f7-8c6a-aed259425365",
      "metadata": {
        "id": "f80d8bcd-6f6f-48f7-8c6a-aed259425365"
      },
      "source": [
        "If a edge label mapping is deleted, the label mapping reverts back to the default mapping."
      ]
    },
    {
      "cell_type": "code",
      "execution_count": 10,
      "id": "1b31186d-0cbb-4e2b-903e-83a9a3659640",
      "metadata": {
        "colab": {
          "base_uri": "https://localhost:8080/",
          "height": 121
        },
        "id": "1b31186d-0cbb-4e2b-903e-83a9a3659640",
        "outputId": "7c9eef15-edf3-4cff-91f9-3a6d1740b49b"
      },
      "outputs": [
        {
          "output_type": "execute_result",
          "data": {
            "text/plain": [
              "<bound method GraphWidget.default_edge_label_mapping of GraphWidget(layout=Layout(height='500px', width='100%'))>"
            ],
            "text/html": [
              "<div style=\"max-width:800px; border: 1px solid var(--colab-border-color);\"><style>\n",
              "      pre.function-repr-contents {\n",
              "        overflow-x: auto;\n",
              "        padding: 8px 12px;\n",
              "        max-height: 500px;\n",
              "      }\n",
              "\n",
              "      pre.function-repr-contents.function-repr-contents-collapsed {\n",
              "        cursor: pointer;\n",
              "        max-height: 100px;\n",
              "      }\n",
              "    </style>\n",
              "    <pre style=\"white-space: initial; background:\n",
              "         var(--colab-secondary-surface-color); padding: 8px 12px;\n",
              "         border-bottom: 1px solid var(--colab-border-color);\"><b>yfiles_jupyter_graphs.widget.GraphWidget.default_edge_label_mapping</b><br/>def default_edge_label_mapping(index: int, edge: TDict)</pre><pre class=\"function-repr-contents function-repr-contents-collapsed\" style=\"\"><a class=\"filepath\" style=\"display:none\" href=\"#\">/usr/local/lib/python3.10/dist-packages/yfiles_jupyter_graphs/widget.py</a>See default element label mapping.</pre>\n",
              "      <script>\n",
              "      if (google.colab.kernel.accessAllowed && google.colab.files && google.colab.files.view) {\n",
              "        for (const element of document.querySelectorAll('.filepath')) {\n",
              "          element.style.display = 'block'\n",
              "          element.onclick = (event) => {\n",
              "            event.preventDefault();\n",
              "            event.stopPropagation();\n",
              "            google.colab.files.view(element.textContent, 1523);\n",
              "          };\n",
              "        }\n",
              "      }\n",
              "      for (const element of document.querySelectorAll('.function-repr-contents')) {\n",
              "        element.onclick = (event) => {\n",
              "          event.preventDefault();\n",
              "          event.stopPropagation();\n",
              "          element.classList.toggle('function-repr-contents-collapsed');\n",
              "        };\n",
              "      }\n",
              "      </script>\n",
              "      </div>"
            ]
          },
          "metadata": {},
          "execution_count": 10
        }
      ],
      "source": [
        "w2.del_edge_label_mapping()\n",
        "w2.get_edge_label_mapping()"
      ]
    }
  ],
  "metadata": {
    "colab": {
      "provenance": []
    },
    "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"
    },
    "widgets": {
      "application/vnd.jupyter.widget-state+json": {
        "f12458d67e7b4fde8c94e8efd7fa60db": {
          "model_module": "yfiles-jupyter-graphs",
          "model_name": "GraphModel",
          "model_module_version": "^1.10.0",
          "state": {
            "_context_pane_mapping": [
              {
                "id": "Neighborhood",
                "title": "Neighborhood"
              },
              {
                "id": "Data",
                "title": "Data"
              },
              {
                "id": "Search",
                "title": "Search"
              },
              {
                "id": "About",
                "title": "About"
              }
            ],
            "_data_importer": "networkx",
            "_directed": false,
            "_dom_classes": [],
            "_edges": [
              {
                "id": 0,
                "start": 0,
                "end": 3,
                "properties": {},
                "color": "#15AFAC",
                "thickness_factor": 1,
                "directed": false,
                "styles": {},
                "label": ""
              },
              {
                "id": 1,
                "start": 0,
                "end": 4,
                "properties": {},
                "color": "#15AFAC",
                "thickness_factor": 1,
                "directed": false,
                "styles": {},
                "label": ""
              },
              {
                "id": 2,
                "start": 1,
                "end": 4,
                "properties": {},
                "color": "#15AFAC",
                "thickness_factor": 1,
                "directed": false,
                "styles": {},
                "label": ""
              },
              {
                "id": 3,
                "start": 2,
                "end": 5,
                "properties": {},
                "color": "#15AFAC",
                "thickness_factor": 1,
                "directed": false,
                "styles": {},
                "label": ""
              },
              {
                "id": 4,
                "start": 2,
                "end": 6,
                "properties": {},
                "color": "#15AFAC",
                "thickness_factor": 1,
                "directed": false,
                "styles": {},
                "label": ""
              },
              {
                "id": 5,
                "start": 2,
                "end": 7,
                "properties": {},
                "color": "#15AFAC",
                "thickness_factor": 1,
                "directed": false,
                "styles": {},
                "label": ""
              },
              {
                "id": 6,
                "start": 3,
                "end": 8,
                "properties": {},
                "color": "#15AFAC",
                "thickness_factor": 1,
                "directed": false,
                "styles": {},
                "label": ""
              },
              {
                "id": 7,
                "start": 3,
                "end": 9,
                "properties": {},
                "color": "#15AFAC",
                "thickness_factor": 1,
                "directed": false,
                "styles": {},
                "label": ""
              },
              {
                "id": 8,
                "start": 4,
                "end": 6,
                "properties": {},
                "color": "#15AFAC",
                "thickness_factor": 1,
                "directed": false,
                "styles": {},
                "label": ""
              },
              {
                "id": 9,
                "start": 5,
                "end": 6,
                "properties": {},
                "color": "#15AFAC",
                "thickness_factor": 1,
                "directed": false,
                "styles": {},
                "label": ""
              }
            ],
            "_graph_layout": {},
            "_highlight": [],
            "_license": {},
            "_model_module": "yfiles-jupyter-graphs",
            "_model_module_version": "^1.10.0",
            "_model_name": "GraphModel",
            "_neighborhood": {},
            "_nodes": [
              {
                "id": 0,
                "properties": {
                  "label": "0"
                },
                "color": "#15AFAC",
                "styles": {},
                "label": "0",
                "scale_factor": 1,
                "type": "#15AFAC",
                "size": [
                  55,
                  55
                ],
                "position": [
                  0,
                  0
                ]
              },
              {
                "id": 1,
                "properties": {
                  "label": "1"
                },
                "color": "#15AFAC",
                "styles": {},
                "label": "1",
                "scale_factor": 1,
                "type": "#15AFAC",
                "size": [
                  55,
                  55
                ],
                "position": [
                  0,
                  0
                ]
              },
              {
                "id": 2,
                "properties": {
                  "label": "2"
                },
                "color": "#15AFAC",
                "styles": {},
                "label": "2",
                "scale_factor": 1,
                "type": "#15AFAC",
                "size": [
                  55,
                  55
                ],
                "position": [
                  0,
                  0
                ]
              },
              {
                "id": 3,
                "properties": {
                  "label": "3"
                },
                "color": "#15AFAC",
                "styles": {},
                "label": "3",
                "scale_factor": 1,
                "type": "#15AFAC",
                "size": [
                  55,
                  55
                ],
                "position": [
                  0,
                  0
                ]
              },
              {
                "id": 4,
                "properties": {
                  "label": "4"
                },
                "color": "#15AFAC",
                "styles": {},
                "label": "4",
                "scale_factor": 1,
                "type": "#15AFAC",
                "size": [
                  55,
                  55
                ],
                "position": [
                  0,
                  0
                ]
              },
              {
                "id": 5,
                "properties": {
                  "label": "5"
                },
                "color": "#15AFAC",
                "styles": {},
                "label": "5",
                "scale_factor": 1,
                "type": "#15AFAC",
                "size": [
                  55,
                  55
                ],
                "position": [
                  0,
                  0
                ]
              },
              {
                "id": 6,
                "properties": {
                  "label": "6"
                },
                "color": "#15AFAC",
                "styles": {},
                "label": "6",
                "scale_factor": 1,
                "type": "#15AFAC",
                "size": [
                  55,
                  55
                ],
                "position": [
                  0,
                  0
                ]
              },
              {
                "id": 7,
                "properties": {
                  "label": "7"
                },
                "color": "#15AFAC",
                "styles": {},
                "label": "7",
                "scale_factor": 1,
                "type": "#15AFAC",
                "size": [
                  55,
                  55
                ],
                "position": [
                  0,
                  0
                ]
              },
              {
                "id": 8,
                "properties": {
                  "label": "8"
                },
                "color": "#15AFAC",
                "styles": {},
                "label": "8",
                "scale_factor": 1,
                "type": "#15AFAC",
                "size": [
                  55,
                  55
                ],
                "position": [
                  0,
                  0
                ]
              },
              {
                "id": 9,
                "properties": {
                  "label": "9"
                },
                "color": "#15AFAC",
                "styles": {},
                "label": "9",
                "scale_factor": 1,
                "type": "#15AFAC",
                "size": [
                  55,
                  55
                ],
                "position": [
                  0,
                  0
                ]
              }
            ],
            "_overview": {
              "enabled": null,
              "overview_set": false
            },
            "_selected_graph": [
              [],
              []
            ],
            "_sidebar": {
              "enabled": false,
              "start_with": null
            },
            "_view_count": null,
            "_view_module": "yfiles-jupyter-graphs",
            "_view_module_version": "^1.10.0",
            "_view_name": "GraphView",
            "layout": "IPY_MODEL_21722ca1cc2d41d3a6efb25ea83dde35",
            "tabbable": null,
            "tooltip": null
          }
        },
        "21722ca1cc2d41d3a6efb25ea83dde35": {
          "model_module": "@jupyter-widgets/base",
          "model_name": "LayoutModel",
          "model_module_version": "2.0.0",
          "state": {
            "_model_module": "@jupyter-widgets/base",
            "_model_module_version": "2.0.0",
            "_model_name": "LayoutModel",
            "_view_count": null,
            "_view_module": "@jupyter-widgets/base",
            "_view_module_version": "2.0.0",
            "_view_name": "LayoutView",
            "align_content": null,
            "align_items": null,
            "align_self": null,
            "border_bottom": null,
            "border_left": null,
            "border_right": null,
            "border_top": null,
            "bottom": null,
            "display": null,
            "flex": null,
            "flex_flow": null,
            "grid_area": null,
            "grid_auto_columns": null,
            "grid_auto_flow": null,
            "grid_auto_rows": null,
            "grid_column": null,
            "grid_gap": null,
            "grid_row": null,
            "grid_template_areas": null,
            "grid_template_columns": null,
            "grid_template_rows": null,
            "height": "500px",
            "justify_content": null,
            "justify_items": null,
            "left": null,
            "margin": null,
            "max_height": null,
            "max_width": null,
            "min_height": null,
            "min_width": null,
            "object_fit": null,
            "object_position": null,
            "order": null,
            "overflow": null,
            "padding": null,
            "right": null,
            "top": null,
            "visibility": null,
            "width": "100%"
          }
        },
        "7c74023174774bf8b723924ba780ac4e": {
          "model_module": "yfiles-jupyter-graphs",
          "model_name": "GraphModel",
          "model_module_version": "^1.10.0",
          "state": {
            "_context_pane_mapping": [
              {
                "id": "Neighborhood",
                "title": "Neighborhood"
              },
              {
                "id": "Data",
                "title": "Data"
              },
              {
                "id": "Search",
                "title": "Search"
              },
              {
                "id": "About",
                "title": "About"
              }
            ],
            "_data_importer": "networkx",
            "_directed": false,
            "_dom_classes": [],
            "_edges": [
              {
                "id": 0,
                "start": 0,
                "end": 3,
                "properties": {},
                "color": "#15AFAC",
                "thickness_factor": 1,
                "directed": false,
                "styles": {},
                "label": ""
              },
              {
                "id": 1,
                "start": 0,
                "end": 4,
                "properties": {},
                "color": "#15AFAC",
                "thickness_factor": 1,
                "directed": false,
                "styles": {},
                "label": ""
              },
              {
                "id": 2,
                "start": 1,
                "end": 4,
                "properties": {},
                "color": "#15AFAC",
                "thickness_factor": 1,
                "directed": false,
                "styles": {},
                "label": ""
              },
              {
                "id": 3,
                "start": 2,
                "end": 5,
                "properties": {},
                "color": "#15AFAC",
                "thickness_factor": 1,
                "directed": false,
                "styles": {},
                "label": ""
              },
              {
                "id": 4,
                "start": 2,
                "end": 6,
                "properties": {},
                "color": "#15AFAC",
                "thickness_factor": 1,
                "directed": false,
                "styles": {},
                "label": ""
              },
              {
                "id": 5,
                "start": 2,
                "end": 7,
                "properties": {},
                "color": "#15AFAC",
                "thickness_factor": 1,
                "directed": false,
                "styles": {},
                "label": ""
              },
              {
                "id": 6,
                "start": 3,
                "end": 8,
                "properties": {},
                "color": "#15AFAC",
                "thickness_factor": 1,
                "directed": false,
                "styles": {},
                "label": ""
              },
              {
                "id": 7,
                "start": 3,
                "end": 9,
                "properties": {},
                "color": "#15AFAC",
                "thickness_factor": 1,
                "directed": false,
                "styles": {},
                "label": ""
              },
              {
                "id": 8,
                "start": 4,
                "end": 6,
                "properties": {},
                "color": "#15AFAC",
                "thickness_factor": 1,
                "directed": false,
                "styles": {},
                "label": ""
              },
              {
                "id": 9,
                "start": 5,
                "end": 6,
                "properties": {},
                "color": "#15AFAC",
                "thickness_factor": 1,
                "directed": false,
                "styles": {},
                "label": ""
              }
            ],
            "_graph_layout": {},
            "_highlight": [],
            "_license": {},
            "_model_module": "yfiles-jupyter-graphs",
            "_model_module_version": "^1.10.0",
            "_model_name": "GraphModel",
            "_neighborhood": {},
            "_nodes": [
              {
                "id": 0,
                "properties": {
                  "label": "0"
                },
                "color": "#15AFAC",
                "styles": {
                  "label_styles": {
                    "backgroundColor": "#5C268B",
                    "fontSize": 20,
                    "color": "#FF6EC7",
                    "position": "north",
                    "maximumWidth": 130,
                    "wrapping": "word",
                    "textAlignment": "center",
                    "fontWeight": "bold"
                  }
                },
                "label": "2024-12-23 10:57:36",
                "scale_factor": 1,
                "type": "#15AFAC",
                "size": [
                  55,
                  55
                ],
                "position": [
                  0,
                  0
                ]
              },
              {
                "id": 1,
                "properties": {
                  "label": "1"
                },
                "color": "#15AFAC",
                "styles": {
                  "label_styles": {
                    "backgroundColor": "#5C268B",
                    "fontSize": 20,
                    "color": "#FF6EC7",
                    "position": "north",
                    "maximumWidth": 130,
                    "wrapping": "word",
                    "textAlignment": "center",
                    "fontWeight": "bold"
                  }
                },
                "label": "2024-12-23 10:57:36",
                "scale_factor": 1,
                "type": "#15AFAC",
                "size": [
                  55,
                  55
                ],
                "position": [
                  0,
                  0
                ]
              },
              {
                "id": 2,
                "properties": {
                  "label": "2"
                },
                "color": "#15AFAC",
                "styles": {
                  "label_styles": {
                    "backgroundColor": "#5C268B",
                    "fontSize": 20,
                    "color": "#FF6EC7",
                    "position": "north",
                    "maximumWidth": 130,
                    "wrapping": "word",
                    "textAlignment": "center",
                    "fontWeight": "bold"
                  }
                },
                "label": "2024-12-23 10:57:36",
                "scale_factor": 1,
                "type": "#15AFAC",
                "size": [
                  55,
                  55
                ],
                "position": [
                  0,
                  0
                ]
              },
              {
                "id": 3,
                "properties": {
                  "label": "3"
                },
                "color": "#15AFAC",
                "styles": {
                  "label_styles": {
                    "backgroundColor": "#5C268B",
                    "fontSize": 20,
                    "color": "#FF6EC7",
                    "position": "north",
                    "maximumWidth": 130,
                    "wrapping": "word",
                    "textAlignment": "center",
                    "fontWeight": "bold"
                  }
                },
                "label": "2024-12-23 10:57:36",
                "scale_factor": 1,
                "type": "#15AFAC",
                "size": [
                  55,
                  55
                ],
                "position": [
                  0,
                  0
                ]
              },
              {
                "id": 4,
                "properties": {
                  "label": "4"
                },
                "color": "#15AFAC",
                "styles": {
                  "label_styles": {
                    "backgroundColor": "#5C268B",
                    "fontSize": 20,
                    "color": "#FF6EC7",
                    "position": "north",
                    "maximumWidth": 130,
                    "wrapping": "word",
                    "textAlignment": "center",
                    "fontWeight": "bold"
                  }
                },
                "label": "2024-12-23 10:57:36",
                "scale_factor": 1,
                "type": "#15AFAC",
                "size": [
                  55,
                  55
                ],
                "position": [
                  0,
                  0
                ]
              },
              {
                "id": 5,
                "properties": {
                  "label": "5"
                },
                "color": "#15AFAC",
                "styles": {
                  "label_styles": {
                    "backgroundColor": "#5C268B",
                    "fontSize": 20,
                    "color": "#FF6EC7",
                    "position": "north",
                    "maximumWidth": 130,
                    "wrapping": "word",
                    "textAlignment": "center",
                    "fontWeight": "bold"
                  }
                },
                "label": "2024-12-23 10:57:36",
                "scale_factor": 1,
                "type": "#15AFAC",
                "size": [
                  55,
                  55
                ],
                "position": [
                  0,
                  0
                ]
              },
              {
                "id": 6,
                "properties": {
                  "label": "6"
                },
                "color": "#15AFAC",
                "styles": {
                  "label_styles": {
                    "backgroundColor": "#5C268B",
                    "fontSize": 20,
                    "color": "#FF6EC7",
                    "position": "north",
                    "maximumWidth": 130,
                    "wrapping": "word",
                    "textAlignment": "center",
                    "fontWeight": "bold"
                  }
                },
                "label": "2024-12-23 10:57:36",
                "scale_factor": 1,
                "type": "#15AFAC",
                "size": [
                  55,
                  55
                ],
                "position": [
                  0,
                  0
                ]
              },
              {
                "id": 7,
                "properties": {
                  "label": "7"
                },
                "color": "#15AFAC",
                "styles": {
                  "label_styles": {
                    "backgroundColor": "#5C268B",
                    "fontSize": 20,
                    "color": "#FF6EC7",
                    "position": "north",
                    "maximumWidth": 130,
                    "wrapping": "word",
                    "textAlignment": "center",
                    "fontWeight": "bold"
                  }
                },
                "label": "2024-12-23 10:57:36",
                "scale_factor": 1,
                "type": "#15AFAC",
                "size": [
                  55,
                  55
                ],
                "position": [
                  0,
                  0
                ]
              },
              {
                "id": 8,
                "properties": {
                  "label": "8"
                },
                "color": "#15AFAC",
                "styles": {
                  "label_styles": {
                    "backgroundColor": "#5C268B",
                    "fontSize": 20,
                    "color": "#FF6EC7",
                    "position": "north",
                    "maximumWidth": 130,
                    "wrapping": "word",
                    "textAlignment": "center",
                    "fontWeight": "bold"
                  }
                },
                "label": "2024-12-23 10:57:36",
                "scale_factor": 1,
                "type": "#15AFAC",
                "size": [
                  55,
                  55
                ],
                "position": [
                  0,
                  0
                ]
              },
              {
                "id": 9,
                "properties": {
                  "label": "9"
                },
                "color": "#15AFAC",
                "styles": {
                  "label_styles": {
                    "backgroundColor": "#5C268B",
                    "fontSize": 20,
                    "color": "#FF6EC7",
                    "position": "north",
                    "maximumWidth": 130,
                    "wrapping": "word",
                    "textAlignment": "center",
                    "fontWeight": "bold"
                  }
                },
                "label": "2024-12-23 10:57:36",
                "scale_factor": 1,
                "type": "#15AFAC",
                "size": [
                  55,
                  55
                ],
                "position": [
                  0,
                  0
                ]
              }
            ],
            "_overview": {
              "enabled": null,
              "overview_set": false
            },
            "_selected_graph": [
              [],
              []
            ],
            "_sidebar": {
              "enabled": false,
              "start_with": null
            },
            "_view_count": null,
            "_view_module": "yfiles-jupyter-graphs",
            "_view_module_version": "^1.10.0",
            "_view_name": "GraphView",
            "layout": "IPY_MODEL_6151dcf7c75e4e1cbb48ada2e3ce3ef2",
            "tabbable": null,
            "tooltip": null
          }
        },
        "6151dcf7c75e4e1cbb48ada2e3ce3ef2": {
          "model_module": "@jupyter-widgets/base",
          "model_name": "LayoutModel",
          "model_module_version": "2.0.0",
          "state": {
            "_model_module": "@jupyter-widgets/base",
            "_model_module_version": "2.0.0",
            "_model_name": "LayoutModel",
            "_view_count": null,
            "_view_module": "@jupyter-widgets/base",
            "_view_module_version": "2.0.0",
            "_view_name": "LayoutView",
            "align_content": null,
            "align_items": null,
            "align_self": null,
            "border_bottom": null,
            "border_left": null,
            "border_right": null,
            "border_top": null,
            "bottom": null,
            "display": null,
            "flex": null,
            "flex_flow": null,
            "grid_area": null,
            "grid_auto_columns": null,
            "grid_auto_flow": null,
            "grid_auto_rows": null,
            "grid_column": null,
            "grid_gap": null,
            "grid_row": null,
            "grid_template_areas": null,
            "grid_template_columns": null,
            "grid_template_rows": null,
            "height": "500px",
            "justify_content": null,
            "justify_items": null,
            "left": null,
            "margin": null,
            "max_height": null,
            "max_width": null,
            "min_height": null,
            "min_width": null,
            "object_fit": null,
            "object_position": null,
            "order": null,
            "overflow": null,
            "padding": null,
            "right": null,
            "top": null,
            "visibility": null,
            "width": "100%"
          }
        },
        "49303956ce5647a2bab53c596a32260f": {
          "model_module": "yfiles-jupyter-graphs",
          "model_name": "GraphModel",
          "model_module_version": "^1.10.0",
          "state": {
            "_context_pane_mapping": [
              {
                "id": "Neighborhood",
                "title": "Neighborhood"
              },
              {
                "id": "Data",
                "title": "Data"
              },
              {
                "id": "Search",
                "title": "Search"
              },
              {
                "id": "About",
                "title": "About"
              }
            ],
            "_data_importer": "networkx",
            "_directed": false,
            "_dom_classes": [],
            "_edges": [
              {
                "id": 0,
                "start": 0,
                "end": 3,
                "properties": {},
                "color": "#15AFAC",
                "thickness_factor": 1,
                "directed": false,
                "styles": {
                  "label_styles": {
                    "backgroundColor": "#5C268B",
                    "fontSize": 20,
                    "color": "#FF6EC7",
                    "position": "north",
                    "maximumWidth": 130,
                    "wrapping": "word",
                    "textAlignment": "center",
                    "fontWeight": "bold"
                  }
                },
                "label": "2024-12-23 10:57:36"
              },
              {
                "id": 1,
                "start": 0,
                "end": 4,
                "properties": {},
                "color": "#15AFAC",
                "thickness_factor": 1,
                "directed": false,
                "styles": {
                  "label_styles": {
                    "backgroundColor": "#5C268B",
                    "fontSize": 20,
                    "color": "#FF6EC7",
                    "position": "north",
                    "maximumWidth": 130,
                    "wrapping": "word",
                    "textAlignment": "center",
                    "fontWeight": "bold"
                  }
                },
                "label": "2024-12-23 10:57:36"
              },
              {
                "id": 2,
                "start": 1,
                "end": 4,
                "properties": {},
                "color": "#15AFAC",
                "thickness_factor": 1,
                "directed": false,
                "styles": {
                  "label_styles": {
                    "backgroundColor": "#5C268B",
                    "fontSize": 20,
                    "color": "#FF6EC7",
                    "position": "north",
                    "maximumWidth": 130,
                    "wrapping": "word",
                    "textAlignment": "center",
                    "fontWeight": "bold"
                  }
                },
                "label": "2024-12-23 10:57:36"
              },
              {
                "id": 3,
                "start": 2,
                "end": 5,
                "properties": {},
                "color": "#15AFAC",
                "thickness_factor": 1,
                "directed": false,
                "styles": {
                  "label_styles": {
                    "backgroundColor": "#5C268B",
                    "fontSize": 20,
                    "color": "#FF6EC7",
                    "position": "north",
                    "maximumWidth": 130,
                    "wrapping": "word",
                    "textAlignment": "center",
                    "fontWeight": "bold"
                  }
                },
                "label": "2024-12-23 10:57:36"
              },
              {
                "id": 4,
                "start": 2,
                "end": 6,
                "properties": {},
                "color": "#15AFAC",
                "thickness_factor": 1,
                "directed": false,
                "styles": {
                  "label_styles": {
                    "backgroundColor": "#5C268B",
                    "fontSize": 20,
                    "color": "#FF6EC7",
                    "position": "north",
                    "maximumWidth": 130,
                    "wrapping": "word",
                    "textAlignment": "center",
                    "fontWeight": "bold"
                  }
                },
                "label": "2024-12-23 10:57:36"
              },
              {
                "id": 5,
                "start": 2,
                "end": 7,
                "properties": {},
                "color": "#15AFAC",
                "thickness_factor": 1,
                "directed": false,
                "styles": {
                  "label_styles": {
                    "backgroundColor": "#5C268B",
                    "fontSize": 20,
                    "color": "#FF6EC7",
                    "position": "north",
                    "maximumWidth": 130,
                    "wrapping": "word",
                    "textAlignment": "center",
                    "fontWeight": "bold"
                  }
                },
                "label": "2024-12-23 10:57:36"
              },
              {
                "id": 6,
                "start": 3,
                "end": 8,
                "properties": {},
                "color": "#15AFAC",
                "thickness_factor": 1,
                "directed": false,
                "styles": {
                  "label_styles": {
                    "backgroundColor": "#5C268B",
                    "fontSize": 20,
                    "color": "#FF6EC7",
                    "position": "north",
                    "maximumWidth": 130,
                    "wrapping": "word",
                    "textAlignment": "center",
                    "fontWeight": "bold"
                  }
                },
                "label": "2024-12-23 10:57:36"
              },
              {
                "id": 7,
                "start": 3,
                "end": 9,
                "properties": {},
                "color": "#15AFAC",
                "thickness_factor": 1,
                "directed": false,
                "styles": {
                  "label_styles": {
                    "backgroundColor": "#5C268B",
                    "fontSize": 20,
                    "color": "#FF6EC7",
                    "position": "north",
                    "maximumWidth": 130,
                    "wrapping": "word",
                    "textAlignment": "center",
                    "fontWeight": "bold"
                  }
                },
                "label": "2024-12-23 10:57:36"
              },
              {
                "id": 8,
                "start": 4,
                "end": 6,
                "properties": {},
                "color": "#15AFAC",
                "thickness_factor": 1,
                "directed": false,
                "styles": {
                  "label_styles": {
                    "backgroundColor": "#5C268B",
                    "fontSize": 20,
                    "color": "#FF6EC7",
                    "position": "north",
                    "maximumWidth": 130,
                    "wrapping": "word",
                    "textAlignment": "center",
                    "fontWeight": "bold"
                  }
                },
                "label": "2024-12-23 10:57:36"
              },
              {
                "id": 9,
                "start": 5,
                "end": 6,
                "properties": {},
                "color": "#15AFAC",
                "thickness_factor": 1,
                "directed": false,
                "styles": {
                  "label_styles": {
                    "backgroundColor": "#5C268B",
                    "fontSize": 20,
                    "color": "#FF6EC7",
                    "position": "north",
                    "maximumWidth": 130,
                    "wrapping": "word",
                    "textAlignment": "center",
                    "fontWeight": "bold"
                  }
                },
                "label": "2024-12-23 10:57:36"
              }
            ],
            "_graph_layout": {},
            "_highlight": [],
            "_license": {},
            "_model_module": "yfiles-jupyter-graphs",
            "_model_module_version": "^1.10.0",
            "_model_name": "GraphModel",
            "_neighborhood": {},
            "_nodes": [
              {
                "id": 0,
                "properties": {
                  "label": "0"
                },
                "color": "#15AFAC",
                "styles": {},
                "label": "0",
                "scale_factor": 1,
                "type": "#15AFAC",
                "size": [
                  55,
                  55
                ],
                "position": [
                  0,
                  0
                ]
              },
              {
                "id": 1,
                "properties": {
                  "label": "1"
                },
                "color": "#15AFAC",
                "styles": {},
                "label": "1",
                "scale_factor": 1,
                "type": "#15AFAC",
                "size": [
                  55,
                  55
                ],
                "position": [
                  0,
                  0
                ]
              },
              {
                "id": 2,
                "properties": {
                  "label": "2"
                },
                "color": "#15AFAC",
                "styles": {},
                "label": "2",
                "scale_factor": 1,
                "type": "#15AFAC",
                "size": [
                  55,
                  55
                ],
                "position": [
                  0,
                  0
                ]
              },
              {
                "id": 3,
                "properties": {
                  "label": "3"
                },
                "color": "#15AFAC",
                "styles": {},
                "label": "3",
                "scale_factor": 1,
                "type": "#15AFAC",
                "size": [
                  55,
                  55
                ],
                "position": [
                  0,
                  0
                ]
              },
              {
                "id": 4,
                "properties": {
                  "label": "4"
                },
                "color": "#15AFAC",
                "styles": {},
                "label": "4",
                "scale_factor": 1,
                "type": "#15AFAC",
                "size": [
                  55,
                  55
                ],
                "position": [
                  0,
                  0
                ]
              },
              {
                "id": 5,
                "properties": {
                  "label": "5"
                },
                "color": "#15AFAC",
                "styles": {},
                "label": "5",
                "scale_factor": 1,
                "type": "#15AFAC",
                "size": [
                  55,
                  55
                ],
                "position": [
                  0,
                  0
                ]
              },
              {
                "id": 6,
                "properties": {
                  "label": "6"
                },
                "color": "#15AFAC",
                "styles": {},
                "label": "6",
                "scale_factor": 1,
                "type": "#15AFAC",
                "size": [
                  55,
                  55
                ],
                "position": [
                  0,
                  0
                ]
              },
              {
                "id": 7,
                "properties": {
                  "label": "7"
                },
                "color": "#15AFAC",
                "styles": {},
                "label": "7",
                "scale_factor": 1,
                "type": "#15AFAC",
                "size": [
                  55,
                  55
                ],
                "position": [
                  0,
                  0
                ]
              },
              {
                "id": 8,
                "properties": {
                  "label": "8"
                },
                "color": "#15AFAC",
                "styles": {},
                "label": "8",
                "scale_factor": 1,
                "type": "#15AFAC",
                "size": [
                  55,
                  55
                ],
                "position": [
                  0,
                  0
                ]
              },
              {
                "id": 9,
                "properties": {
                  "label": "9"
                },
                "color": "#15AFAC",
                "styles": {},
                "label": "9",
                "scale_factor": 1,
                "type": "#15AFAC",
                "size": [
                  55,
                  55
                ],
                "position": [
                  0,
                  0
                ]
              }
            ],
            "_overview": {
              "enabled": null,
              "overview_set": false
            },
            "_selected_graph": [
              [],
              []
            ],
            "_sidebar": {
              "enabled": false,
              "start_with": null
            },
            "_view_count": null,
            "_view_module": "yfiles-jupyter-graphs",
            "_view_module_version": "^1.10.0",
            "_view_name": "GraphView",
            "layout": "IPY_MODEL_162c93df17c44c2a8ed58f8dfa6aff1f",
            "tabbable": null,
            "tooltip": null
          }
        },
        "162c93df17c44c2a8ed58f8dfa6aff1f": {
          "model_module": "@jupyter-widgets/base",
          "model_name": "LayoutModel",
          "model_module_version": "2.0.0",
          "state": {
            "_model_module": "@jupyter-widgets/base",
            "_model_module_version": "2.0.0",
            "_model_name": "LayoutModel",
            "_view_count": null,
            "_view_module": "@jupyter-widgets/base",
            "_view_module_version": "2.0.0",
            "_view_name": "LayoutView",
            "align_content": null,
            "align_items": null,
            "align_self": null,
            "border_bottom": null,
            "border_left": null,
            "border_right": null,
            "border_top": null,
            "bottom": null,
            "display": null,
            "flex": null,
            "flex_flow": null,
            "grid_area": null,
            "grid_auto_columns": null,
            "grid_auto_flow": null,
            "grid_auto_rows": null,
            "grid_column": null,
            "grid_gap": null,
            "grid_row": null,
            "grid_template_areas": null,
            "grid_template_columns": null,
            "grid_template_rows": null,
            "height": "500px",
            "justify_content": null,
            "justify_items": null,
            "left": null,
            "margin": null,
            "max_height": null,
            "max_width": null,
            "min_height": null,
            "min_width": null,
            "object_fit": null,
            "object_position": null,
            "order": null,
            "overflow": null,
            "padding": null,
            "right": null,
            "top": null,
            "visibility": null,
            "width": "100%"
          }
        }
      }
    }
  },
  "nbformat": 4,
  "nbformat_minor": 5
}