如何将图表和表格组合成一张绘图图像

Question

我已经使用以下代码片段成功创建了一个绘图条形图图像：

chart = go.Figure(data=chart_matrix)

并使用以下代码片段成功创建了第二个绘图表格图像：

trace_table = go.Table(
    type='table',
    header=dict(values=table_title),
    cells=dict(values=sorted_matrix)
)

现在我想将 2 个图像合并为 1 个图像（即条形图和下面的表格），但我似乎无法实现这一点。我尝试过使用子图，但绘图文档说没有本地方法可以将绘图表插入子图。其他文档指定使用与我不理解的轴和域相结合的布局。

有人可以分享一个如何执行此操作的简单示例吗？谢谢

Answer 1

在浏览表格子图教程时，我能够复制您所需要的内容！

遗憾的是，我们不能像你说的那样使用 Subplots，但这种其他方法并不复杂，我会尽力解释它，以便你可以在其他用例中实现它。

您需要了解属性domain，我们可以在其中指定包含 的字典，x and y start and end values这样我们就可以将图形放置在不同的位置，这个概念就是用于创建子图的概念。

注意：域 x 和 y 零值从画布的左下角开始。

因此，对于该表，我们可以看到域如下。

domain=dict(x=[0, 1], y=[0, 0.3])

正如您所看到的，我们说它应该从绘图画布的左端开始并拉伸到右端，但是如果您查看 y 值，我们说它应该从底部开始并仅拉伸到 0.3 (30 %) 的绘图画布，因此也有空间容纳条形图！

至于条形图，域是使用不同的方法指定的，问题是我们没有方便的domain参数，因此我们可以使用 its 来定位它x and y axis。

trace1 = go.Bar(
    x=[1, 2, 3],
    y=[4, 5, 6],
    xaxis="X1",
    yaxis="Y1"
)

layout = dict(xaxis1=dict( dict(domain=[0, 1], anchor='y1')),
             yaxis1=dict( dict(domain=[0.38, 1], anchor='x1')))

在这里我们可以看到，在条形图定义中，我们只需要设置图表的 x 轴和 y 轴的名称，在布局中我们可以定义与表格中类似的域。

如果您遇到任何已实施的问题以及您的问题是否已完全解决，请告诉我！

下面是一个工作片段供您参考！

from plotly.offline import download_plotlyjs, init_notebook_mode, plot, iplot
import plotly.graph_objs as go
from plotly import tools
import pandas as pd
import numpy as np
from datetime import datetime
init_notebook_mode(connected=True)

trace = go.Table(
    header=dict(values=['A Scores', 'B Scores']),
    cells=dict(values=[[100, 90, 80, 90],
                       [95, 85, 75, 95]]),
    domain=dict(x=[0, 1],
                y=[0, 0.3]))

trace1 = go.Bar(
    x=[1, 2, 3],
    y=[4, 5, 6],
    xaxis="X1",
    yaxis="Y1"
)

layout = dict(xaxis1=dict( dict(domain=[0, 1], anchor='y1')),
             yaxis1=dict( dict(domain=[0.38, 1], anchor='x1')))
fig = go.Figure(data = [trace,trace1], layout = layout)
iplot(fig, filename = 'basic_table')