Examples of creating custom st.column_config for st.dataframe?

🧩 Custom Components
5

Thanks @dataprofessor and @Shawn_Pereira, I have now a working version with server-based image generation:

import base64
import io

import pandas as pd
import rdkit
import rdkit.Chem
import rdkit.Chem.Draw
import streamlit as st


@st.cache_data
def smi_to_png(smi: str) -> str:
    """Returns molecular image as data URI."""
    mol = rdkit.Chem.MolFromSmiles(smi)
    pil_image = rdkit.Chem.Draw.MolToImage(mol)

    with io.BytesIO() as buffer:
        pil_image.save(buffer, "png")
        data = base64.encodebytes(buffer.getvalue()).decode("utf-8")

    return f"data:image/png;base64,{data}"


df = pd.DataFrame({"smiles": ["CCCNC", "CCC", "CCCCC"]})

df["img"] = df["smiles"].apply(smi_to_png)

st.dataframe(df, column_config={"img": st.column_config.ImageColumn()})

Screenshot 2023-12-11 at 12.45.17

1 Like