绘图折线图未正确显示

Question

以下是我选择日期后的折线图。我不知道为什么数据以荒谬的线条格式显示，

下面是我的回电

@app.callback(
    Output('graph2', 'figure'),
    [Input('dt','start_date'),
    Input('dt','end_date')]
)

def update_date(start_date, end_date):
    df_new4=df_good.copy()
    df_new4=df_new4[(df_new4['Draw Date']>=start_date) & (df_new4['Draw Date']<=end_date)]
    fig2=px.line(df_new4,x='Draw Date',y='Net Sale',color='Type')
    return fig2

Answer 1

• 模拟了一个与您的数据相似的数据框
• 创建了一个带有所需组件和回调的dash应用
• 唯一需要的修复是防止start_date成为None
• 很重要的是绘制日期实际上是一个日期而不是一个字符串

import numpy as np
import pandas as pd
import dash_core_components as dcc
import dash_html_components as html
from dash.dependencies import Input, Output, State
from jupyter_dash import JupyterDash
import plotly.express as px

# build a data set that simulates data noted in question
gtype = ["Indoor", "Ghana"]
d = pd.date_range("1-jan-2021", periods=150)
df_good = (
    pd.DataFrame({t: np.sort(np.random.uniform(1, 10 ** 6, len(d))) for t in gtype})
    .set_index(d)
    .unstack()
    .reset_index()
    .rename(columns={"level_0": "Type", "level_1": "Draw Date", 0: "Net Sale"})
)

# Build App
app = JupyterDash(__name__)
app.layout = html.Div(
    [
        dcc.DatePickerRange(
            id="dt",
            min_date_allowed=df_good["Draw Date"].min(),
            max_date_allowed=df_good["Draw Date"].max(),
            initial_visible_month=df_good["Draw Date"].min(),
            end_date=df_good["Draw Date"].max(),
        ),
        dcc.Graph(id="graph2"),
    ],
    style={"font-family": "Arial", "font-size": "0.9em"},
)


@app.callback(
    Output("graph2", "figure"), [Input("dt", "start_date"), Input("dt", "end_date")]
)
def update_date(start_date, end_date):
    # start date can be None, set to min...
    if not start_date:
        start_date = df_good["Draw Date"].min()
    return px.line(
        df_good.loc[df_good["Draw Date"].between(start_date, end_date)],
        x="Draw Date",
        y="Net Sale",
        color="Type",
    )

# Run app and display result inline in the notebook
app.run_server(mode="inline")