根据值（字符串）更改 Plotly 表中单元格的文本颜色

Posted 2023-02-23

【中文标题】根据值（字符串）更改 Plotly 表中单元格的文本颜色

【英文标题】：Change the text color of cells in Plotly table based on value (string)

【发布时间】：2020-08-24 10:29:16

【问题描述】：

我有以下脚本，它可以使用 Plotly 将 pandas 数据框转换为交互式 html 表格：

goals_output_df = pd.read_csv(os.path.join(question_dir, "data/output.csv"))

fig = go.Figure(data=[go.Table(
    columnwidth = [15,170,15,35,35],
    header=dict(values=['<b>' + x + '</b>' for x in list(goals_output_df.columns)],
                # fill_color='#b9e2ff',
                line_color='darkslategray',
                align='center',
                font=dict(color='black', family="Lato", size=20),
                height=30
                ),
    cells=dict(values=[goals_output_df[column] for column in goals_output_df.columns],
            #    fill_color='#e6f2fd',
               line_color='darkslategray',
               align='left',
               font=dict(color='black', family="Lato", size=20),
               height=30
               ))
])

fig.update_layout(
title="<b>Output summary for %s</b>"%question.strip('question'),
font=dict(
    family="Lato",
    size=18,
    color="#000000"))

fig.write_html(os.path.join(question_dir, "results/output.html"))

该表包含一个名为“Output”的列，每行可以有以下三个值之一：“YES”、“NO”和“BORDERLINE”。

我希望能够更改“输出”列中文本的颜色，使“YES”为绿色，“NO”为红色，“BORDERLINE”为蓝色。

知道我该怎么做吗？ Plotly 文档似乎没有帮助。

【参考方案1】：

这部分有点隐含cell-color-based-on-variable。在你的情况下我会怎么做。

数据

import pandas as pd
import plotly.graph_objects as go
df = pd.DataFrame("name":["a", "b", "c", "d"],
                   "value":[100,20,30,40],
                   "output":["YES", "NO", "BORDERLINE", "NO"])

map_color = "YES":"green", "NO":"red", "BORDERLINE":"blue"

df["color"] = df["output"].map(map_color)

cols_to_show = ["name", "value", "output"]

cols_to_show 是您希望在表格中显示的唯一列。

填充颜色

在这里，您希望在除output 之外的所有列中都有标准单元格背景

fill_color = []
n = len(df)
for col in cols_to_show:
    if col!='output':
        fill_color.append(['#e6f2fd']*n)
    else:
        fill_color.append(df["color"].to_list())

表格

data=[go.Table(
#     columnwidth = [15,20,30],
    header=dict(values=[f"<b>col</b>" for col in cols_to_show],
                # fill_color='#b9e2ff',
                line_color='darkslategray',
                align='center',
                font=dict(color='black', family="Lato", size=20),
                height=30
                ),
    cells=dict(values=df[cols_to_show].values.T,
               fill_color=fill_color,
               line_color='darkslategray',
               align='left',
               font=dict(color='black', family="Lato", size=20),
               height=30
               ))
]

fig = go.Figure(data=data)
fig.show()

更新

改变文字颜色

如果你想改变文字颜色

text_color = []
n = len(df)
for col in cols_to_show:
    if col!='output':
        text_color.append(["black"] * n)
    else:
        text_color.append(df["color"].to_list())

和

data=[go.Table(
#     columnwidth = [15,20,30],
    header=dict(values=[f"<b>col</b>" for col in cols_to_show],
                # fill_color='#b9e2ff',
                line_color='darkslategray',
                align='center',
                font=dict(color='black', family="Lato", size=20),
                height=30
                ),
    cells=dict(values=df[cols_to_show].values.T,

               line_color='darkslategray',
               align='left',
               font=dict(color=text_color, family="Lato", size=20),
               height=30
               ))
]

fig = go.Figure(data=data)
fig.show()

【讨论】：

非常感谢！抱歉，如果我不清楚：理想情况下，我想更改文本的颜色而不是单元格的颜色。这可能吗？

【参考方案2】：

您可以在 font_color 部分添加 if 语句：

  import pandas as pd
  import plotly
  import plotly.graph_objs as go
  df = pd.DataFrame("name":["a", "b", "c", "d"],
            "value":[100,20,30,40],
            "output":["YES", "NO", "BORDERLINE", "NO"])

  fig = go.Figure(data=[go.Table(
            columnwidth = [30,30,30],
            header=dict(values=["Name","Value", "Output"],
            # fill_color='#b9e2ff',
            line_color='darkslategray',
            align='center',
            font=dict(color='black', family="Lato", size=20),
            height=30
            ),
    cells=dict(values=[df.name, df.value, df.output],
        #    fill_color='#e6f2fd',
           line_color='darkslategray',
           align='left',
           font_color=['darkslategray','darkslategray',['green' if x == "YES" else       
           "red" if x == "NO" else "blue" if x == "BORDERLINE" else 'darkslategray' 
           for x in list(df.output)]],
           height=30
           ))
     ])


     fig.show()

这将生成表格：