Dash/Plotly：如何使用相同的 x 轴在 y 轴上绘制两列？

Question

我试图在同一个折线图上绘制我的数据集中的两列（列是“病例”和“疫苗接种”）。 x 轴只有一列（即“国家/地区”），我希望他们共享。 是否可以在 Dash/Plotly 中做到这一点？ 我找不到任何使用 Dash 的解决方案。 这是我的代码片段：

                 html.Div(
                    children=dcc.Graph(
                        id="cases-chart",
                        config={"displayModeBar": False},
                        figure={
                            "data": [
                                {
                                    "x": data["country"],
                                    "y": data["cases"],
                                    "type": "lines",
                                },
                            ],
                            "layout": {
                                "title": {
                                    "text": "Cases by Country",
                                    "x": 0.05,
                                    "xanchor": "left",
                                },
                                "xaxis": {"fixedrange": True},
                                "yaxis": {"fixedrange": True},
                                "colorway": ["#17B897"],
                            },
                        },
                    ),
                    className="card",
                ),

谢谢。

Answer 1

尝试将另一个元素添加到具有所需数据的“数据”列表中。

您可以在文档中找到更多信息

Answer 2

找到了解决办法：

"data": [
                                {
                                    "x": data["country"],
                                    "y": data["vaccinations"],
                                    "type": "lines",
                                },
                                {
                                    "x": data["country"],
                                    "y": data["cases"],
                                    "type": "lines",
                                }
                            ],