Code Monkey home page Code Monkey logo

Comments (4)

denphi avatar denphi commented on May 28, 2024 1

FYI:
Not sure if you have used streamlit's session state, It would help you to sync widgets and components

import streamlit as st
from ipyspeck import stspeck

example_xyz = '''12
benzene example
C        0.00000        1.40272        0.00000
H        0.00000        2.49029        0.00000
C       -1.21479        0.70136        0.00000
H       -2.15666        1.24515        0.00000
C       -1.21479       -0.70136        0.00000
H       -2.15666       -1.24515        0.00000
C        0.00000       -1.40272        0.00000
H        0.00000       -2.49029        0.00000
C        1.21479       -0.70136        0.00000
H        2.15666       -1.24515        0.00000
C        1.21479        0.70136        0.00000
H        2.15666        1.24515        0.00000
'''

st.set_page_config(
    layout="centered",
    page_title="Specklit",
    page_icon=":sparkles:")
st.sidebar.title("Parameter")

if 'model' not in st.session_state:
    st.session_state['model'] = {
        'bonds': True, 
        'atomScale': 0.24, 
        'relativeAtomScale': 0.64, 
        'bondScale': 0.5,
        'brightness': 0.5, 
        'outline': 0, 
        'spf': 32, 
        'bondShade': 0.5, 
        'atomShade': 0.5, 
        'dofStrength': 0, 
        'dofPosition': 0.5
    }

atomScale = st.sidebar.slider(
    'atomScale', 0.0, 1.0, value=float(st.session_state['model']['atomScale']))
bondScale = st.sidebar.slider(
    'bondScale', 0.0, 1.0, value=float(st.session_state['model']['bondScale']))
atomShade = st.sidebar.slider(
    'atomShade', 0.0, 1.0, value=float(st.session_state['model']['atomShade']))
bonds = st.sidebar.checkbox(
    "bonds", value=st.session_state['model']['bonds'])
outline = st.sidebar.checkbox(
    'outline', value=st.session_state['model']['outline'])
brightness = st.sidebar.slider(
    'brightness', 0.0, 1.0, value=float(st.session_state['model']['brightness']))
relativeAtomScale = st.sidebar.slider(
    'relativeAtomScale', 0.0, 1.0, value=float(st.session_state['model']['relativeAtomScale']))

spec_xyz = stspeck.Speck(
    data=example_xyz,
    atomScale=atomScale,
    bondScale=bondScale,
    outline=outline,
    atomShade=atomShade,
    bonds=bonds,
    brightness=brightness,
    width="800px",
    height="600px", 
    key="model"
)

from st-speckmol.

denphi avatar denphi commented on May 28, 2024 1

@jump2cn, ipyspeck>=0.6.2 exposes ao and aoRes to its streamlite component (stspeck), but NO to its ipywidget, I still need to find time to port it to ipywidgets 8.X

import streamlit as st
from ipyspeck import stspeck

H2O='''3
Water molecule
O          0.00000        0.00000        0.11779
H          0.00000        0.75545       -0.47116
H          0.00000       -0.75545       -0.47116'''

with st.sidebar:
    ao = st.selectbox("Select ao",[0, 0.1, 0.2 ,0.5, 0.8,1])
    bonds = st.selectbox("Select bonds",[True,False])

res = stspeck.Speck(
  data=H2O,
  ao=ao,
  width="800px",
  height="600px"
)

from st-speckmol.

jump2cn avatar jump2cn commented on May 28, 2024

hi @avrabyt,

I found the speck repo has added some new parameters like 'ao' and 'aoRes' for ambient occlusion control, can we add them to support it?

https://github.com/plotly/speck/blob/master/src/view.js#L25

from st-speckmol.

avrabyt avatar avrabyt commented on May 28, 2024

Hi @jump2cn , yeah I think it is very much possible to add it . Would you mind to make a PR ? It's been while I've made any updates here. Happy to see your interest :)

from st-speckmol.

Related Issues (9)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.