如何调整 plotly express 面积图大小?
How to adjust plotly express area chart size?
我在 Dash 应用程序上创建了一个 plotly express 面积图。该图表工作正常,但是 x 轴上的第一个点和最后一个点似乎超出了图表并且只能看到一半(如附加屏幕截图所示)。我也尝试过更改图形的宽度和高度值,但似乎没有任何效果。
我是 python 和 dash 的新手,所以任何帮助将不胜感激,我还在堆栈溢出上发布了我的第一个问题,如果我遗漏了任何内容或没有正确完成,我深表歉意。
import dash
import dash_core_components as dcc
import dash_html_components as html
from dash.dependencies import Input, Output, State
import plotly.express as px
import pandas as pd
import pyodbc
import dash_bootstrap_components as dbc
from datetime import datetime as dt
from app import app
page2 = html.Div(
[
dbc.Row(
[
dbc.Col(
# dbc.Card(
html.Div(
id="opportunity_heatmap",
className="chart_div pretty_container",
children = [
dcc.Graph(id='my_graph',
config={
'staticPlot': False, # True, False
'scrollZoom': True, # True, False
'doubleClick': 'reset', # 'reset', 'autosize' or 'reset+autosize', False
'showTips': True, # True, False
'displayModeBar': 'hover', # True, False, 'hover'
'watermark': False,
# 'modeBarButtonsToRemove': ['pan2d','select2d'],
},
)
]
),
# color="light", inverse=True),
md=12,
),
],
no_gutters=True,
),
]
)
@app.callback(
Output('my_graph','figure'),
[Input('my_dropdown','value')]
)
def build_graph(trendGraph):
dff=SQL_data
fig = px.area(dff, x="DeploymentDate", y="DeploymentID", text='DeploymentID', color = 'DeploymentType' ,template='plotly_white'
,category_orders={'DeploymentDate':['January-2019','February-2019','March-2019','April-2019','May-2019','June-2019','July-2019','August-2019','September-2019','October-2019','November-2019','December-2019','January-2020','February-2020','March-2020','April-2020','May-2020','June-2020','July-2020','August-2020','September-2020','October-2020','November-2020','December-2020','January-2021','February-2021']})
fig.update_layout(yaxis={'title':'No. of deployments'},
title={'text':'Deployments Trend',
'font':{'size':28},'x':0.5,'xanchor':'center'},
autosize=True,)
return fig
def get_page2():
return page2
绘图上绘制的内容不能溢出网格布局,否则放大时我们不仅会看到文本值,还会看到整个图形延伸到网格之外。
显示这些值的唯一方法是缩小一点,这意味着相应地初始化图形 x_range
。这个想法是从相应的数据框列中获取最小值和最大值,并根据需要扩展该范围。
例如,在这里添加 4 年允许完全显示 y 值(一般用例在 x 轴上使用年份,@see https://plotly.com/python/filled-area-plots/):
fig = px.area(
df,
x='year',
y=y,
color="continent",
line_group="country",
text=y,
range_x=[df['year'].min()-2, df['year'].max()+2]
)
我在 Dash 应用程序上创建了一个 plotly express 面积图。该图表工作正常,但是 x 轴上的第一个点和最后一个点似乎超出了图表并且只能看到一半(如附加屏幕截图所示)。我也尝试过更改图形的宽度和高度值,但似乎没有任何效果。 我是 python 和 dash 的新手,所以任何帮助将不胜感激,我还在堆栈溢出上发布了我的第一个问题,如果我遗漏了任何内容或没有正确完成,我深表歉意。
import dash
import dash_core_components as dcc
import dash_html_components as html
from dash.dependencies import Input, Output, State
import plotly.express as px
import pandas as pd
import pyodbc
import dash_bootstrap_components as dbc
from datetime import datetime as dt
from app import app
page2 = html.Div(
[
dbc.Row(
[
dbc.Col(
# dbc.Card(
html.Div(
id="opportunity_heatmap",
className="chart_div pretty_container",
children = [
dcc.Graph(id='my_graph',
config={
'staticPlot': False, # True, False
'scrollZoom': True, # True, False
'doubleClick': 'reset', # 'reset', 'autosize' or 'reset+autosize', False
'showTips': True, # True, False
'displayModeBar': 'hover', # True, False, 'hover'
'watermark': False,
# 'modeBarButtonsToRemove': ['pan2d','select2d'],
},
)
]
),
# color="light", inverse=True),
md=12,
),
],
no_gutters=True,
),
]
)
@app.callback(
Output('my_graph','figure'),
[Input('my_dropdown','value')]
)
def build_graph(trendGraph):
dff=SQL_data
fig = px.area(dff, x="DeploymentDate", y="DeploymentID", text='DeploymentID', color = 'DeploymentType' ,template='plotly_white'
,category_orders={'DeploymentDate':['January-2019','February-2019','March-2019','April-2019','May-2019','June-2019','July-2019','August-2019','September-2019','October-2019','November-2019','December-2019','January-2020','February-2020','March-2020','April-2020','May-2020','June-2020','July-2020','August-2020','September-2020','October-2020','November-2020','December-2020','January-2021','February-2021']})
fig.update_layout(yaxis={'title':'No. of deployments'},
title={'text':'Deployments Trend',
'font':{'size':28},'x':0.5,'xanchor':'center'},
autosize=True,)
return fig
def get_page2():
return page2
绘图上绘制的内容不能溢出网格布局,否则放大时我们不仅会看到文本值,还会看到整个图形延伸到网格之外。
显示这些值的唯一方法是缩小一点,这意味着相应地初始化图形 x_range
。这个想法是从相应的数据框列中获取最小值和最大值,并根据需要扩展该范围。
例如,在这里添加 4 年允许完全显示 y 值(一般用例在 x 轴上使用年份,@see https://plotly.com/python/filled-area-plots/):
fig = px.area(
df,
x='year',
y=y,
color="continent",
line_group="country",
text=y,
range_x=[df['year'].min()-2, df['year'].max()+2]
)