File size: 2,258 Bytes
b966bc9 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 |
import streamlit as st
import pandas as pd
from st_aggrid import AgGrid
# from st_aggrid.grid_options_builder import GridOptionsBuilder
# from st_aggrid.shared import JsCode
# from st_aggrid.shared import GridUpdateMode
num=range(1,10)
data=pd.DataFrame({'A':num,'B':num,'C':num})
gridOptions = {
"columnDefs": [
{'headerName':'A列',"field": 'A','width':80,'cellStyle':{'color':'red','textAlign': 'center','font-weight':'bold'}},
#此外还可以设置minWidth 与maxWidth来控制宽度
{'headerName':'B列',"field": 'B','width':144,'cellStyle':{'color':'red','textAlign': 'center','font-weight':'bold'}},
{'headerName':'C列',"field": 'C','width':80,'cellStyle':{'color':'red','textAlign': 'center','font-weight':'bold'}}
],
"defaultColDef": {
"sortable": True,
"filter": False,
# "width":200 #可以设置各行的默认值
},
}
data_ag = AgGrid(data, # 数据
gridOptions=gridOptions, # 布局选项
# fit_columns_on_grid_load=True, #此参数会以列宽为比例自动铺满表格
allow_unsafe_jscode=True,
key=1,
custom_css={'.ag-header-cell-text':{'flex':'1','text-align':'center'}}) #此处是设置列名居中
#可配合st.columns来设置表格的整体宽度
c1,c2=st.columns(2)
with c1:
AgGrid(data, # 数据
gridOptions=gridOptions, # 布局选项
allow_unsafe_jscode=True,
key=2,
custom_css={'.ag-header-cell-text': {'flex': '1', 'text-align': 'center'}})
#铺满表格
c1,c2=st.columns(2)
with c1:
AgGrid(data, # 数据
gridOptions=gridOptions, # 布局选项
allow_unsafe_jscode=True,
fit_columns_on_grid_load=True,
key=3,
custom_css={'.ag-header-cell-text': {'flex': '1', 'text-align': 'center'}})
#铺满且居中
c1,c2,c3=st.columns([1,2,1])
with c2:
AgGrid(data, # 数据
gridOptions=gridOptions, # 布局选项
allow_unsafe_jscode=True,
fit_columns_on_grid_load=True,
key=4,
custom_css={'.ag-header-cell-text': {'flex': '1', 'text-align': 'center'}})
|