将水平线添加到Dash-Plotly Python仪表板

时间:2019-11-21 22:40:48

标签: python plotly plotly-dash plotly-python

我正在Python3中创建Dash应用程序。尝试在条形图中添加一条水平线。文档中的示例适用于线形图,线形图具有数字x和y轴,而我具有分类X轴。以下代码成功创建了图形,但未显示shape对象。如何在此图中添加一条水平线?

        html.Div(
                    [    dcc.Graph(
                            id='example-graph-23',
                            figure={
                                'data': [
                                    {'x': ['Overall', 'NBA', 'WWC', 'NFL'], 'y': [3,2,2.5],
                                     'type': 'bar', 'name': 'Instagram'},
                                          ],
                                'layout': {
                                    'yaxis' : dict(
                                            range=[0, 4]
                                            ),
                                    'plot_bgcolor': colors['background'],
                                    'paper_bgcolor': colors['background'],
                                    'font': {
                                        'color': colors['text']
                                    },
                                    'shapes' : dict(type="line",
                                                    x0=0,
                                                    y0=2,
                                                    x1=5,
                                                    y1=2,
                                                    line=dict(
                                                        color="Red",
                                                        width=4,
                                                        dash="dashdot",
                                                ))
                                }
                            }
                        ) ]
        , className="four columns"
                ),

1 个答案:

答案 0 :(得分:0)

您可以通过向x添加yfigure.data坐标来添加垂直线,如下所示:

import dash
import dash_html_components as html
import dash_core_components as dcc

app = dash.Dash()

colors = {'background': 'white', 'text': 'black'}
app.layout = html.Div(
                    [    dcc.Graph(
                            id='example-graph-23',
                            figure={
                                'data': [
                                    {'x': ['Overall', 'NBA', 'WWC', 'NFL'], 'y': [3,2,2.5],
                                     'type': 'bar', 'name': 'Instagram'},
                                    {'x': ['Overall', 'Overall'], 'y': [0, 4],
                                     'type': 'line', 'name': 'v_line_1'}, 
                                    {'x': ['NBA', 'NBA'], 'y': [0, 4],
                                     'type': 'line', 'name': 'v_line_2'}, 
                                    {'x': ['WWC', 'WWC'], 'y': [0, 4],
                                     'type': 'line', 'name': 'v_line_3'},                                    
                                          ],
                                'layout': {
                                    'yaxis' : dict(
                                            range=[0, 4]
                                            ),
                                    'plot_bgcolor': colors['background'],
                                    'paper_bgcolor': colors['background'],
                                    'font': {
                                        'color': colors['text']
                                    },
                                    'shapes' : dict(type="line",
                                                    x0=0,
                                                    y0=2,
                                                    x1=5,
                                                    y1=2,
                                                    line=dict(
                                                        color="Red",
                                                        width=4,
                                                        dash="dashdot",
                                                ))
                                }
                            }
                        )], className="four columns"
)


if __name__ == '__main__':
    app.run_server(debug=True)

enter image description here