python-3.x - 通过将网格放置在 st.container、st.column 或 st.empty 中来控制 Streamlit st_aggrid (AgGrid) 布局

Question

python 3.8.10Ubuntu 20.04

使用 st_aggrid (用于 Streamlit 的 AgGrid 的 Python 端口。)

Streamlit 允许使用 st.column, st.empty, and st.container 进行布局控制.格式是(例如)...

col1, col2 = st.columns(2)

original = Image.open(image)
col1.header("Original")
col1.image(original, use_column_width=True)

grayscale = original.convert('LA')
col2.header("Grayscale")
col2.image(grayscale, use_column_width=True)

请注意，col1 和 col2 替换了所有命令中的 st.。IE。如果没有列，它将是...

import streamlit as st

original = Image.open(image)
st.header("Original")
st.image(original, use_column_width=True)

grayscale = original.convert('LA')
st.header("Grayscale")
st.image(grayscale, use_column_width=True)

...所有内容都将在页面上一个接一个地显示。

st_aggrid 使用命令创建和放置网格 ...

instruments_gb = GridOptionsBuilder.from_dataframe(instruments_df)

if st.session_state["enable_sidebar"]:instruments_gb.configure_side_bar()
instruments_gb.configure_selection(st.session_state["selection_mode"])
instruments_gb.configure_selection(st.session_state["selection_mode"], use_checkbox=True, groupSelectsChildren=st.session_state["groupSelectsChildren"], groupSelectsFiltered=st.session_state["groupSelectsFiltered"])
instruments_gb.configure_selection(st.session_state["selection_mode"], use_checkbox=False, rowMultiSelectWithClick=True, suppressRowDeselection=True)
instruments_gb.configure_grid_options(domLayout='normal')
instruments_gridOptions = instruments_gb.build()

AgGrid(
        instruments_df, 
        gridOptions=instruments_gridOptions,
        height=st.session_state["grid_height"], 
        width='100%',
        data_return_mode=st.session_state["return_mode_value"], 
        update_mode=st.session_state["update_mode_value"],
        fit_columns_on_grid_load=True,
        allow_unsafe_jscode=True, #Set it to True to allow js function to be injected
        enable_enterprise_modules=True,    
        )

这将创建并显示网格。请注意，st. 未在命令中的任何位置使用。

• 如何在 Streamlit 中放置一个 st_aggrid 网格容器/占位符？
• 或者，可以将网格放置在页面上的特定位置，而不使用 Streamlit 容器？

Answer 1

这是一个关于如何将 aggrid 放入容器中的示例。

import streamlit as st
import numpy as np
from st_aggrid import AgGrid
import pandas as pd

data = {
    'country': ['norway', 'russia', 'china', 'japan'],
    'capital': ['oslo', 'moscow', 'beijing', 'tokyo']
}

df = pd.DataFrame(data)

with st.container():
    st.write("This is inside the container")
    AgGrid(df, height=200)    
    st.bar_chart(np.random.randn(50, 3))

st.write("This is outside the container.")

输出