{
 "cells": [
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "# Add text to Nodes"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "import ipycytoscape"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "data = {\n",
    "    'nodes': [\n",
    "        { 'data': { 'id': 'desktop', 'name': 'Cytoscape', 'href': 'http://cytoscape.org' } },\n",
    "        { 'data': { 'id': 'a', 'name': 'Grid', 'href': 'http://cytoscape.org' } },\n",
    "        { 'data': { 'id': 'b', 'name': 'Cola', 'href': 'http://cytoscape.org' } },\n",
    "        { 'data': { 'id': 'c', 'name': 'Popper', 'href': 'http://cytoscape.org' } },\n",
    "        { 'data': { 'id': 'js', 'name': 'Cytoscape.js', 'href': 'http://js.cytoscape.org' } }\n",
    "    ],\n",
    "    'edges': [\n",
    "        {'data': { 'source': 'desktop', 'target': 'js' }},\n",
    "        {'data': { 'source': 'a', 'target': 'b' }},\n",
    "        {'data': { 'source': 'a', 'target': 'c' }},\n",
    "        {'data': { 'source': 'b', 'target': 'c' }},\n",
    "        {'data': { 'source': 'js', 'target': 'b' }}\n",
    "    ]\n",
    "}\n"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "cytoscapeobj = ipycytoscape.CytoscapeWidget()\n",
    "cytoscapeobj.graph.add_graph_from_json(data)"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "cytoscapeobj.set_style([{\n",
    "                        'selector': 'node',\n",
    "                        'css': {\n",
    "                            'content': 'data(name)',\n",
    "                            'text-valign': 'center',\n",
    "                            'color': 'white',\n",
    "                            'text-outline-width': 2,\n",
    "                            'text-outline-color': 'green',\n",
    "                            'background-color': 'green'\n",
    "                        }\n",
    "                        },\n",
    "                        {\n",
    "                        'selector': ':selected',\n",
    "                        'css': {\n",
    "                            'background-color': 'black',\n",
    "                            'line-color': 'black',\n",
    "                            'target-arrow-color': 'black',\n",
    "                            'source-arrow-color': 'black',\n",
    "                            'text-outline-color': 'black'\n",
    "                        }}\n",
    "                        ])"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": [
    "cytoscapeobj"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": []
  }
 ],
 "metadata": {
  "kernelspec": {
   "display_name": "Python 3",
   "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.8.2"
  }
 },
 "nbformat": 4,
 "nbformat_minor": 4
}