我有一个非常笼统的问题：如何管理dash-plotly在python中创建的 Jmeter 板中的分区/图表的布局。假设我有下面的代码：
def charts():
data = [go.Bar(
x=['giraffes', 'orangutans', 'monkeys'],
y=[20, 14, 23] )]
return data
app = dash.Dash()
app.layout = html.Div([
html.Div([
dcc.Graph(
id='figure1',
figure=charts()
),
], style={'width': '49%', 'display': 'inline-block'}),
html.Div([
dcc.Graph(
id = 'figure2',
figure=charts()
),
dcc.Graph(
id='figure3',
figure=charts()
)
], style= {'width': '49%', 'display': 'inline-block'})
])
if __name == '__main__':
app.run_server()我想要的是：
+++++++++++++++++++++++
+ + figure2 +
+ figure1 + +
+ + figure3 +
+++++++++++++++++++++++但我得到的是：
+++++++++++++++++++++++
+ + figure2 +
+ + +
+ figure1 + figure3 +
+++++++++++++++++++++++问题就在这里：
1.一般情况下，如何管理参数来改变布局？
1.使用宽度来管理宽度，但如何管理高度（在本例中，我希望图1的高度是图2或图3的两倍）？
2条答案
按热度按时间h9vpoimq1#
dcc.Graph的layout标签用于设置图形的布局，而不是HTML的布局。我通常使用bootstrap或任何其他CSS来获取Grid配置，使用Grid系统来对齐东西很容易。您可以通过在代码中追加此行来添加外部或内联样式表。根据您正在使用的CSS更改“external_url”。
yeotifhr2#
您的问题包含两个独立的主题：
应用程序布局
你想得到这样的东西：
这将引用应用程序布局，因为您正在定义要在 Jmeter 板中包含形状为3x2的网格。
实现这一点的简单方法是使用Dash Bootstrap组件的grid layout。
可以使用以下命令定义布局：
在此布局中有3行，每行包含2列。
请注意，每列都有“width”属性。网格的总宽度为12，您可以按如下方式定义每列的宽度：
图表布局
您希望一个图表的高度是另一个图表的两倍。您可以按照plotly的图表布局文档中的说明定义每个plotly图表的height属性，请参见here
在那里你会发现多个例子，但它可以像你设置宽度一样设置。