Setting the width of a grid in absolute pixels

🧩 Custom Components streamlit-aggrid
2

Hi @TPMStreamer,

Thanks for posting and welcome to the Streamlit Community forum! We welcome everyone, especially newbies :blush:

So based on the code you’ve shared, this previous post might have a solution.

You should also consider using st.data_editor:

import streamlit as st
import altair as alt
from itertools import cycle
import pandas as pd

from st_aggrid import GridOptionsBuilder, AgGrid, GridUpdateMode, DataReturnMode, JsCode, ColumnsAutoSizeMode

st.title("Demo!")

# Upload file
st.file_uploader('Upload your file', type=['csv', 'json'])

#replace path in the following line with actual path to sampe.cvs
df = pd.read_csv("sample.csv")

df_editor = pd.DataFrame(
    [
       {"AIRLINE": "United", "is_widget": False},
       {"AIRLINE": "Delta", "is_widget": False},
       {"AIRLINE": "Southwest", "is_widget": False},
       {"AIRLINE": "American", "is_widget": False},
   ]
)

# Using AgGrid
selection_mode = "multiple"

gb = GridOptionsBuilder.from_dataframe(df)
gb.configure_selection(selection_mode)
gb.configure_selection(selection_mode, use_checkbox=True)

gridOptions = gb.build()

grid_response = AgGrid(
    df,
    gridOptions=gridOptions,
    height=500,
    fit_columns_on_grid_load=True,
    width=200,
    data_return_mode="AS_INPUT",
    columns_auto_size_mode=ColumnsAutoSizeMode.FIT_CONTENTS,
    )

selected = grid_response["selected_rows"]
selected_df = pd.DataFrame(selected)

# Using st.data_editor
st.subheader('Using `st.data_editor`')
uploaded_file = st.file_uploader("Choose a CSV file", type="csv")
if uploaded_file is not None:
    df = pd.read_csv(uploaded_file)

# Sample from the uploaded csv
st.data_editor(df_editor)

To your question on having an option to upload files, yes there’s a method to do this already in Streamlit;

# Using st.data_editor
uploaded_file = st.file_uploader("Choose a CSV file", type="csv")
if uploaded_file is not None:
    df = pd.read_csv(uploaded_file)
    st.data_editor(df)

Let me know if this helps.