Streamlit 数据框中的超链接

Question

我试图在包含 Streamlit 上过滤结果的数据框中显示可单击的超链接。到目前为止，这是我的代码：

import pandas as pd
import streamlit as st
import openpyxl
import numpy as np
from IPython.core.display import display, HTML

df = pd.read_excel(

  io='list.xlsx',
  engine= 'openpyxl',
 ).fillna('')

def make_clickable(link):
    # target _blank to open new window
    # extract clickable text to display for your link
    text = link.split('=')[0]
    return f'<a target="_blank" href="{link}">{text}</a>'

# TRAILER is the column with hyperlinks
df['TRAILER'] = df['TRAILER'].apply(make_clickable)

df['TRAILER'] = HTML(display(df.to_html(render_links=True, escape=False), raw=True))

如果我使用：

df['TRAILER'] = df['TRAILER'].apply(make_clickable)

我会

<a target="_blank" href="{link}">{text}</a>

显示为字符串，而不是超链接。

当我添加：时

df['TRAILER'] = HTML(display(df.to_html(render_links=True, escape=False), raw=True))

，我得到：

<IPython.core.display.HTML object>

显示为字符串，而不是超链接。

这些是我正在使用的版本。该网站的其他组件仅适用于较低版本的 Streamlit，这就是我使用此版本的原因。

streamlit == 0.83 numpy == 1.18 pandas == 1.2 openpyxl ipython == 7.22 python == 3.9

我无法使用 st.markdown 或 st.write直接，因为我使用 st.dataframe 显示结果。

Answer 1

您可以使用 st.write(df.to_html(escape=False, index=False), unsafe_allow_html=True)：

import pandas as pd
import streamlit as st
import openpyxl
import numpy as np
from IPython.core.display import display, HTML

df = pd.read_excel(
  io='list.xlsx',
  engine= 'openpyxl',
 ).fillna('')

def make_clickable(link):
    # target _blank to open new window
    # extract clickable text to display for your link
    text = link.split('=')[0]
    return f'<a target="_blank" href="{link}">{text}</a>'

# TRAILER is the column with hyperlinks
df['TRAILER'] = df['TRAILER'].apply(make_clickable)

st.write(df.to_html(escape=False, index=False), unsafe_allow_html=True)

---

在一个工作示例中：

import pandas as pd
import streamlit as st

link1 = "https://stackoverflow.com/questions/71641666/hyperlink-in-streamlit-dataframe"
link2 = "https://stackoverflow.com/questions/71731937/how-to-plot-comparison-in-streamlit-dynamically-with-multiselect"
df = pd.DataFrame(
    {
        "url": [
            f'<a target="_blank" href="{link1}">Hyperlink in Streamlit dataframe</a>',
            f'<a target="_blank" href="{link2}">How to plot comparison in Streamlit dynamically with multiselect?</a>'
        ],
        "label": ["question", "question"]
    }
)

st.write(df.to_html(escape=False, index=False), unsafe_allow_html=True)

它给出：

Answer 2

现在可以通过 LinkColumn 在 streamlit 中直接使用此功能（请参阅doc 了解更多详细信息）配置。

以下是如何使用它的示例：

import pandas as pd
import streamlit as st

df = pd.DataFrame(
    [
        {"name": "Google", "url": "http://google.com"},
        {
            "name": "Streamlit Link Column",
            "url": "https://docs.streamlit.io/library/api-reference/data/st.column_config/st.column_config.linkcolumn",
        },
    ]
)

st.header("DataFrame")
st.dataframe(
    df,
    column_config={"url": st.column_config.LinkColumn("URL to website")},
)