{"id":18810821,"url":"https://github.com/ecell/dash-pathway","last_synced_at":"2026-01-11T00:30:15.350Z","repository":{"id":42425312,"uuid":"269541171","full_name":"ecell/dash-pathway","owner":"ecell","description":"A Dash component for pathway visualization","archived":false,"fork":false,"pushed_at":"2022-06-16T23:48:51.000Z","size":6558,"stargazers_count":2,"open_issues_count":10,"forks_count":0,"subscribers_count":5,"default_branch":"master","last_synced_at":"2024-12-29T23:44:20.135Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"Python","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/ecell.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2020-06-05T05:45:25.000Z","updated_at":"2024-10-03T05:10:46.000Z","dependencies_parsed_at":"2022-09-21T19:12:19.396Z","dependency_job_id":null,"html_url":"https://github.com/ecell/dash-pathway","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ecell%2Fdash-pathway","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ecell%2Fdash-pathway/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ecell%2Fdash-pathway/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ecell%2Fdash-pathway/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ecell","download_url":"https://codeload.github.com/ecell/dash-pathway/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":239748254,"owners_count":19690232,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-11-07T23:22:42.045Z","updated_at":"2026-01-11T00:30:15.293Z","avatar_url":"https://github.com/ecell.png","language":"Python","funding_links":[],"categories":[],"sub_categories":[],"readme":"# dash-pathway\n[![Binder](https://mybinder.org/badge_logo.svg)](https://mybinder.org/v2/gh/ecell/dash-pathway/master?filepath=notebooks)\n[![PyPI version](https://badge.fury.io/py/dash-pathway.svg)](https://badge.fury.io/py/dash-pathway)\n\nA dash component for pathway visualization, wrapped around [dash-cytoscape](https://github.com/plotly/dash-cytoscape)\n\n![demo](./data/dash-pathway-demo.gif)\n\n## Getting Started in JupyterLab\n\n### Prerequisites\nMake sure that dash and jupyter dependent libraries are correctly installed:\n```\nconda install pandas pip\nconda install -c conda-forge jupyterlab\nconda install -c conda-forge -c plotly jupyter-dash\n```\n\n### Usage\nInstall the library using `pip`:\n```\npip install dash-pathway\n```\n\nRun the following command in your terminal to run JupyterLab:\n```\njupyter lab\n```\n\nRun the following cell inside JupyterLab cell: (This reproduces the visualization like animated gif at the beginning.)\n```\nfrom jupyter_dash import JupyterDash\nimport dash\nimport dash_core_components as dcc\nimport dash_html_components as html\nimport dash_pathway\n\nexternal_stylesheets = ['https://codepen.io/chriddyp/pen/bWLwgP.css']\napp = JupyterDash(__name__, external_stylesheets=external_stylesheets)\nserver = app.server\n\napp.layout = html.Div(dash_pathway.Pathway(pathwayid=\"eco00020\", width=1200, height=1200,\n                    id='eco00020', node_style={\"font-size\":14}, edge_style={\"width\":10.0}))\n\napp.run_server()\n```\n\n### Advanced Usage\ndash-pathway not only allows you to visualize pathways, but also maps and integrates data into pathways.\n\nIn the example below, we have mapped the quantitative values of a compound's time series onto KEGG global metabolism map.\nThe size of compound nodes in the metabolism map increase or decrease in size depending on the amount of the mapped quantitative value.\nAnd we used the dash slider component to change the quantitative value of each time series.\n\nThis allows us to determine how the abundance of compounds in which pathway function changes over time.\n\n```\nfrom jupyter_dash import JupyterDash\nimport pandas as pd\nimport dash\nimport dash_core_components as dcc\nimport dash_html_components as html\nimport dash_pathway\n\ndf=pd.read_csv(\"./data/kegg_compound_timeseries.csv\")\ndf=df.rename(columns={\"Unnamed: 0\": \"keggid\"})\n\nexternal_stylesheets = ['https://codepen.io/chriddyp/pen/bWLwgP.css']\napp = JupyterDash(__name__, external_stylesheets=external_stylesheets)\nserver = app.server\n\napp.layout = html.Div(id='pathway-body', children=[\n    dash_pathway.Pathway(pathwayid=\"eco01100\", width=1920, height=1080, id='global-metabolism'),\n    dcc.Slider(\n        id='my-slider',\n        min=0,\n        max=15200,\n        step=100,\n        value=100,\n    ),\n    html.Div(id='slider-output-container')\n])\n\n@app.callback(dash.dependencies.Output('global-metabolism', 'elements'),\n              [dash.dependencies.Input('my-slider', 'value')],\n              [dash.dependencies.State('global-metabolism', 'elements')])\ndef update_elements(value, elements):\n    for idx, val in enumerate(elements):\n        if 'label' in val['data']: \n            node_label = val['data']['label']\n            quantity = df[df['keggid']==node_label][str(value)]\n            if len(quantity):\n                elements[idx]['data']['width'] = str(quantity.values[0] * 0.1)\n                elements[idx]['data']['height'] = str(quantity.values[0] * 0.1)\n    return elements\n\n@app.callback(\n    dash.dependencies.Output('slider-output-container', 'children'),\n    [dash.dependencies.Input('my-slider', 'value')])\ndef update_output(value):\n    return 'You have selected time \"{}\"'.format(value)\n\napp.run_server()\n```\n\n![metabolism](./data/global-metabolism.gif)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fecell%2Fdash-pathway","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fecell%2Fdash-pathway","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fecell%2Fdash-pathway/lists"}