Plotly：如何使用 pandas 数据框作为源按行填充 table
Plotly: How to fill table by rows using a pandas dataframe as source
我有这个 df: vertical_stack = pd.concat([eu_table, us_table], axis=0):
0 1 2 3 4 5 6 7 8 9 10 11
EU value 21 13 9 11 15 9 8 11 11 20 19 6
USA value 17 28 14 18 16 11 25 26 22 27 25 17
我想在 Plotly 中按行创建一个 table，但我只能垂直填充 table，其中 'EU value' 成为一列及其所有值垂直填充。这是我用的：
fig3 = go.Figure(data=[go.Table(header=dict(values=['','Sept. 19', 'Oct. 19', 'Nov. 19', 'Dec. 19', 'Jan. 20', 'Feb. 20', 'Mar. 20',
'Apr. 20', 'May 20', 'Jun. 20', 'Jul. 20', 'Aug. 20']),
cells=dict(values=[vertical_stack])
)])
这是我的输出：
如您所见，所有值都填充在同一个单元格中。
我不确定是什么导致了您的错误，但我可以向您展示如何从 pandas 数据框构建 table，如下所示：
0 1 2 3 4 5 6 7 8 9 10 11
EU value 21 13 9 11 15 9 8 11 11 20 19 6
USA value 17 28 14 18 16 11 25 26 22 27 25 17
并且由于您已经标记了您的问题 plotly-dash 但在您的示例中仅使用 pure plotly，我不妨在两个单独的部分中为这两种方法提供建议。
第 1 部分 - 情节和 graph_objects
使用 df = pd.read_clipboard(sep='\s+') 和 df.to_dict() 可以让您构建一个可重现的数据框，如下所示：
df = pd.DataFrame({'0': {'EU value': 21, 'USA value': 17},
'1': {'EU value': 13, 'USA value': 28},
'2': {'EU value': 9, 'USA value': 14},
'3': {'EU value': 11, 'USA value': 18},
'4': {'EU value': 15, 'USA value': 16},
'5': {'EU value': 9, 'USA value': 11},
'6': {'EU value': 8, 'USA value': 25},
'7': {'EU value': 11, 'USA value': 26},
'8': {'EU value': 11, 'USA value': 22},
'9': {'EU value': 20, 'USA value': 27},
'10': {'EU value': 19, 'USA value': 25},
'11': {'EU value': 6, 'USA value': 17}})
而且这个数据样本更实用一些。
逐行或逐列向 table 添加数据应该无关紧要。您的示例的结果应该相同。如果以下建议不适用于您的实际用例，请告诉我，我们可以讨论选项。
下面的代码片段将使用 go.Figure() 和 go.Table() 生成下图。
Table 1
plotly 的完整代码
import plotly.graph_objects as go
import pandas as pd
df = pd.DataFrame({'0': {'EU value': 21, 'USA value': 17},
'1': {'EU value': 13, 'USA value': 28},
'2': {'EU value': 9, 'USA value': 14},
'3': {'EU value': 11, 'USA value': 18},
'4': {'EU value': 15, 'USA value': 16},
'5': {'EU value': 9, 'USA value': 11},
'6': {'EU value': 8, 'USA value': 25},
'7': {'EU value': 11, 'USA value': 26},
'8': {'EU value': 11, 'USA value': 22},
'9': {'EU value': 20, 'USA value': 27},
'10': {'EU value': 19, 'USA value': 25},
'11': {'EU value': 6, 'USA value': 17}})
df.reset_index(inplace=True)
df.rename(columns={'index':''}, inplace = True)
fig = go.Figure(data=[go.Table(
header=dict(values=list(df.columns),
fill_color='paleturquoise',
align='left'),
cells=dict(values=[df[col] for col in df.columns],
fill_color='lavender',
align='left'))
])
fig.show()
第 2 部分 - 使用 JupyterDash 绘制 Dash
下面的代码片段将产生以下 table 使用，除此之外：
dash_table.DataTable(
id='table',
columns=[{"name": i, "id": i} for i in df.columns],
data=df.to_dict('records')
Table 1
JupyterDash 的完整代码
from jupyter_dash import JupyterDash
import dash_table
import pandas as pd
df = pd.read_csv('https://raw.githubusercontent.com/plotly/datasets/master/solar.csv')
df = pd.DataFrame({'0': {'EU_value': 21, 'USA_value': 17},
'1': {'EU_value': 13, 'USA_value': 28},
'2': {'EU_value': 9, 'USA_value': 14},
'3': {'EU_value': 11, 'USA_value': 18},
'4': {'EU_value': 15, 'USA_value': 16},
'5': {'EU_value': 9, 'USA_value': 11},
'6': {'EU_value': 8, 'USA_value': 25},
'7': {'EU_value': 11, 'USA_value': 26},
'8': {'EU_value': 11, 'USA_value': 22},
'9': {'EU_value': 20, 'USA_value': 27},
'10': {'EU_value': 19, 'USA_value': 25},
'11': {'EU_value': 6, 'USA_value': 17}})
df.reset_index(inplace=True)
df.rename(columns={'index':''}, inplace = True)
app = JupyterDash(__name__)
app.layout = dash_table.DataTable(
id='table',
columns=[{"name": i, "id": i} for i in df.columns],
data=df.to_dict('records'),
)
app.run_server(mode='inline', port = 8070, dev_tools_ui=True,
dev_tools_hot_reload =True, threaded=True)
这对我有用：
df = pd.read_csv(
'https://raw.githubusercontent.com/plotly/datasets/master/solar.csv')
# Plotly's simple table
fig = go.Figure(data=[go.Table(
header=dict(values=df.columns.tolist()),
cells=dict(values=df.to_numpy().T.tolist())
)])
参考：https://plotly.com/python/table/
我有这个 df: vertical_stack = pd.concat([eu_table, us_table], axis=0):
0 1 2 3 4 5 6 7 8 9 10 11
EU value 21 13 9 11 15 9 8 11 11 20 19 6
USA value 17 28 14 18 16 11 25 26 22 27 25 17
我想在 Plotly 中按行创建一个 table，但我只能垂直填充 table，其中 'EU value' 成为一列及其所有值垂直填充。这是我用的：
fig3 = go.Figure(data=[go.Table(header=dict(values=['','Sept. 19', 'Oct. 19', 'Nov. 19', 'Dec. 19', 'Jan. 20', 'Feb. 20', 'Mar. 20',
'Apr. 20', 'May 20', 'Jun. 20', 'Jul. 20', 'Aug. 20']),
cells=dict(values=[vertical_stack])
)])
这是我的输出：
如您所见，所有值都填充在同一个单元格中。
我不确定是什么导致了您的错误，但我可以向您展示如何从 pandas 数据框构建 table，如下所示：
0 1 2 3 4 5 6 7 8 9 10 11
EU value 21 13 9 11 15 9 8 11 11 20 19 6
USA value 17 28 14 18 16 11 25 26 22 27 25 17
并且由于您已经标记了您的问题 plotly-dash 但在您的示例中仅使用 pure plotly，我不妨在两个单独的部分中为这两种方法提供建议。
第 1 部分 - 情节和 graph_objects
使用 df = pd.read_clipboard(sep='\s+') 和 df.to_dict() 可以让您构建一个可重现的数据框，如下所示：
df = pd.DataFrame({'0': {'EU value': 21, 'USA value': 17},
'1': {'EU value': 13, 'USA value': 28},
'2': {'EU value': 9, 'USA value': 14},
'3': {'EU value': 11, 'USA value': 18},
'4': {'EU value': 15, 'USA value': 16},
'5': {'EU value': 9, 'USA value': 11},
'6': {'EU value': 8, 'USA value': 25},
'7': {'EU value': 11, 'USA value': 26},
'8': {'EU value': 11, 'USA value': 22},
'9': {'EU value': 20, 'USA value': 27},
'10': {'EU value': 19, 'USA value': 25},
'11': {'EU value': 6, 'USA value': 17}})
而且这个数据样本更实用一些。 逐行或逐列向 table 添加数据应该无关紧要。您的示例的结果应该相同。如果以下建议不适用于您的实际用例，请告诉我，我们可以讨论选项。
下面的代码片段将使用 go.Figure() 和 go.Table() 生成下图。
Table 1
plotly 的完整代码
import plotly.graph_objects as go
import pandas as pd
df = pd.DataFrame({'0': {'EU value': 21, 'USA value': 17},
'1': {'EU value': 13, 'USA value': 28},
'2': {'EU value': 9, 'USA value': 14},
'3': {'EU value': 11, 'USA value': 18},
'4': {'EU value': 15, 'USA value': 16},
'5': {'EU value': 9, 'USA value': 11},
'6': {'EU value': 8, 'USA value': 25},
'7': {'EU value': 11, 'USA value': 26},
'8': {'EU value': 11, 'USA value': 22},
'9': {'EU value': 20, 'USA value': 27},
'10': {'EU value': 19, 'USA value': 25},
'11': {'EU value': 6, 'USA value': 17}})
df.reset_index(inplace=True)
df.rename(columns={'index':''}, inplace = True)
fig = go.Figure(data=[go.Table(
header=dict(values=list(df.columns),
fill_color='paleturquoise',
align='left'),
cells=dict(values=[df[col] for col in df.columns],
fill_color='lavender',
align='left'))
])
fig.show()
第 2 部分 - 使用 JupyterDash 绘制 Dash
下面的代码片段将产生以下 table 使用，除此之外：
dash_table.DataTable(
id='table',
columns=[{"name": i, "id": i} for i in df.columns],
data=df.to_dict('records')
Table 1
JupyterDash 的完整代码
from jupyter_dash import JupyterDash
import dash_table
import pandas as pd
df = pd.read_csv('https://raw.githubusercontent.com/plotly/datasets/master/solar.csv')
df = pd.DataFrame({'0': {'EU_value': 21, 'USA_value': 17},
'1': {'EU_value': 13, 'USA_value': 28},
'2': {'EU_value': 9, 'USA_value': 14},
'3': {'EU_value': 11, 'USA_value': 18},
'4': {'EU_value': 15, 'USA_value': 16},
'5': {'EU_value': 9, 'USA_value': 11},
'6': {'EU_value': 8, 'USA_value': 25},
'7': {'EU_value': 11, 'USA_value': 26},
'8': {'EU_value': 11, 'USA_value': 22},
'9': {'EU_value': 20, 'USA_value': 27},
'10': {'EU_value': 19, 'USA_value': 25},
'11': {'EU_value': 6, 'USA_value': 17}})
df.reset_index(inplace=True)
df.rename(columns={'index':''}, inplace = True)
app = JupyterDash(__name__)
app.layout = dash_table.DataTable(
id='table',
columns=[{"name": i, "id": i} for i in df.columns],
data=df.to_dict('records'),
)
app.run_server(mode='inline', port = 8070, dev_tools_ui=True,
dev_tools_hot_reload =True, threaded=True)
这对我有用：
df = pd.read_csv(
'https://raw.githubusercontent.com/plotly/datasets/master/solar.csv')
# Plotly's simple table
fig = go.Figure(data=[go.Table(
header=dict(values=df.columns.tolist()),
cells=dict(values=df.to_numpy().T.tolist())
)])
参考：https://plotly.com/python/table/