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

Question

我正在 Python3 中创建一个 Dash 应用程序。 试图在条形图中添加一条水平线。 文档中的示例适用于折线图，它具有数字 x 和 y 轴，而我有一个分类 X 轴。 下面的代码成功创建了图形，但没有显示形状 object。 如何在该图中添加一条水平线？

        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"
                ),

Answer 1

您可以通过将x和y坐标添加到figure.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)

在此处输入图像描述