Skip to main content

A Streamlit custom component for Cytoscape.js

Project description

Streamlit Cytoscape.js

Streamlit wrapper of React Cytoscape.js.

Installation

pip install streamlit-cytoscapejs

Try it

import streamlit as st
from streamlit_cytoscapejs import st_cytoscapejs

elements = [
    {"data": {"id": "one", "label": "Node 1"}, "position": {"x": 0, "y": 0}},
    {"data": {"id": "two", "label": "Node 2"}, "position": {"x": 100, "y": 0}},
    {"data": {"source": "one", "target": "two", "label": "Edge from Node1 to Node2"}},
]
stylesheet = [
    {"selector": "node", "style": {"width": 20, "height": 20, "shape": "rectangle"}},
    {"selector": "edge", "style": {"width": 10}},
]

st.title("Hello Cytoscape.js")
clicked_elements = st_cytoscapejs(elements, stylesheet)

if clicked_elements is not None:
    st.write(clicked_elements)

Development

Install

  • JS side
cd streamlit_cytoscape/frontend
npm install
  • Python side
conda create -n streamlit-cytoscapejs python=3.7
conda activate streamlit-cytoscapejs
pip install -e .

Run

Both webpack dev server and Streamlit should run at the same time.

  • JS side
cd streamlit_cytoscape/frontend
npm run start
  • Python side
streamlit run app.py

Next steps

I don't plan to make a lot of progress on this for now (except if huge interest) but if you want to contribute/take over its development I'm happy to lend a hand :).

Obviously missing lots of things like:

  • viewport manipulation props from React cytoscapejs.
  • custom layout
  • adding an extension (but also you'd better fork this repo and add the extension yourself I think :/)

References

Project details


Download files

Download the file for your platform. If you're not sure which to choose, learn more about installing packages.

Source Distribution

streamlit-cytoscapejs-0.0.2.tar.gz (1.0 MB view details)

Uploaded Source

Built Distribution

streamlit_cytoscapejs-0.0.2-py3-none-any.whl (1.1 MB view details)

Uploaded Python 3

File details

Details for the file streamlit-cytoscapejs-0.0.2.tar.gz.

File metadata

  • Download URL: streamlit-cytoscapejs-0.0.2.tar.gz
  • Upload date:
  • Size: 1.0 MB
  • Tags: Source
  • Uploaded using Trusted Publishing? No
  • Uploaded via: twine/4.0.0 CPython/3.8.12

File hashes

Hashes for streamlit-cytoscapejs-0.0.2.tar.gz
Algorithm Hash digest
SHA256 353872ecaeced2ca208b2d2dc170bbcfd2cd4015d4b802a960b25a577d15b169
MD5 1e263159262e782ca30b6c1b40435d63
BLAKE2b-256 69f8d057645434f71b7f3881ed4bd9ce632cacca0fa102541f309f0a13dd14f7

See more details on using hashes here.

File details

Details for the file streamlit_cytoscapejs-0.0.2-py3-none-any.whl.

File metadata

File hashes

Hashes for streamlit_cytoscapejs-0.0.2-py3-none-any.whl
Algorithm Hash digest
SHA256 bd073c3646fd735e210aa8803361a71f4c12c7355648c061902389b64f7f72ab
MD5 35589988c5e4b1bf17b8d803a9a73e80
BLAKE2b-256 1c72a20c760d8262f7177a3cd052ee394e2aec19c58d0f39294b6852ff48d3b1

See more details on using hashes here.

Supported by

AWS AWS Cloud computing and Security Sponsor Datadog Datadog Monitoring Fastly Fastly CDN Google Google Download Analytics Microsoft Microsoft PSF Sponsor Pingdom Pingdom Monitoring Sentry Sentry Error logging StatusPage StatusPage Status page