Is there any methods to hide index when using st.table?

[COOLSTORM]

Just like the title, is there any methods to hide the index while using st.table. I have to use st.table function instead of using dataframe.

[Encrypt]

To hide the index of rows in the st.table, you could modify the Dataframe to set all indexes to empty strings. However, this will lead to an empty column in the table.

import streamlit as st
import pandas as pd
import numpy as np

df = pd.DataFrame(
    np.random.randn(10, 5), columns=("col %d" % i for i in range(5))
)

# Set the index to an empty string to hide row index
df.index = [''] * len(df)

st.table(df)

You’ll have to use custom JavaScript to modify the website’s DOM for a more advanced solution.

import streamlit as st
import pandas as pd
import numpy as np

# Create a sample dataframe
df = pd.DataFrame(
    np.random.randn(10, 5), columns=("col %d" % i for i in range(5))
)

# Display the dataframe using st.table
st.table(df)

# Inject custom JavaScript to hide the index column
hide_index_js = """
<script>
    const tables = window.parent.document.querySelectorAll('table');
    tables.forEach(table => {
        const indexColumn = table.querySelector('thead th:first-child');
        if (indexColumn) {
            indexColumn.style.display = 'none';
        }
        const indexCells = table.querySelectorAll('tbody th');
        indexCells.forEach(cell => {
            cell.style.display = 'none';
        });
    });
</script>
"""

# Use components.html to inject the JavaScript
st.components.v1.html(hide_index_js, height=0)

[edsaac]

st.table	pandas.Styler

The easiest would be to set one of the columns in the dataframe as the index:

df = pd.DataFrame(
    np.random.randn(10, 5), 
    columns=("col %d" % i for i in range(5))
)

st.table(df.set_index("col 0"))

But st.table will hide that column title and the left-most column will look odd.

Another way is to use pandas.style.to_html(), which is similar to st.table in the sense that it takes a dataframe and returns a static html representation. Here is my idea using pandas.style and passing that to st.html:

def static_table(
    df: pd.DataFrame,
    text_align: Literal["left", "center", "right"] = "center",
    line_color: str = "rgba(150, 150, 150, 0.3)",
) -> None:
    common_props = [
        ("text-align", text_align),
        ("border", f"1px solid {line_color}"),
        ("padding", "0.25rem 0.375rem"),
        ("vertical-align", "middle"),
        ("line-height", "1.5rem"),
    ]

    st.html(
        df.style.hide(axis="index")
        .format(precision=4)
        .set_table_styles(
            [
                {  # Header
                    "selector": "th",
                    "props": common_props,
                },
                {  # Data
                    "selector": "td",
                    "props": common_props,
                },
            ]
        )
        .to_html(table_attributes='style="width: 100%;"')
    )

static_table(df, text_align="right")

---

[COOLSTORM]

Thanks a lot, you are hero