React bug with Candlestick

@archmoj

Let's investigate this: https://community.plotly.com/t/overlapping-old-new-data/37123

@archmoj you'll probably have to whip up a CodePen for this yourself as this user is not a Plotly.js user directly :)

I tried to replicate this in a simple Pen but couldn't... https://codepen.io/nicolaskruchten/pen/zYvabwX

Should we close this one?

Let's try to replicate it still.

Add files to reproduce plotly bug

I've been able to replicate this issue in Python. It looks like it only happens to Candlestick and not OHLC for me. After launching that dash application click the start date selector and choose a date a week in the future.

plotly==4.12.0
dash==1.17.0

from datetime import datetime

import pandas as pd

import plotly.graph_objects as go
import dash
import dash_core_components as dcc
import dash_html_components as html
from dash.dependencies import Input, Output

df = pd.read_pickle("https://raw.githubusercontent.com/AdamDorwart/plotly_canddlestick_bug/main/appl_bug.pkl")

start_date = df.index.min()
end_date = df.index.max()

def get_figure(df, start_date, end_date):
    mask = (df.index >= start_date) & (df.index <= end_date)
    df_filt = df[mask]

    data = go.Candlestick(x=df_filt.index,
                    open=df_filt['Open'],
                    high=df_filt['High'],
                    low=df_filt['Low'],
                    close=df_filt['Close'])
    
    return go.Figure(data=data)

app = dash.Dash()
app.layout = html.Div([
    dcc.DatePickerRange(
        id="ohlc-dates",
        start_date=start_date,
        end_date=end_date,
        display_format='M-D-Y',
    ),
    dcc.Graph(
        id="ohlc", 
        figure=get_figure(df, start_date, end_date),
    )
])

@app.callback(
    Output("ohlc", "figure"),
    [Input("ohlc-dates", "start_date"),
    Input("ohlc-dates", "end_date")]
)
def update_dates(start_date, end_date):
    global df
    return get_figure(df, start_date, end_date)

app.run_server(debug=True)

Here's a small repository that hosts the data and source: https://github.com/AdamDorwart/plotly_canddlestick_bug

@nicolaskruchten

@nicolaskruchten @archmoj

Is the above sufficient to replicate the issue? Just curious if this is getting planned in.

here is a codepen that reproduces the issue https://codepen.io/michaelbabyn/pen/LYyNXjJ. It looks like the candlesticks that don't get removed correspond to the null values in the new trace

@michaelbabyn

Thanks @michaelbabyn for the codepen.
Would you please fork the pen and then try to make it as minimal as possible?
Having a minimal pen can help identify & solve the problem.

sure, https://codepen.io/michaelbabyn/pen/oNWxJrz

@michaelbabyn

sure, https://codepen.io/michaelbabyn/pen/oNWxJrz

Thanks very much @michaelbabyn.
This is now clear!

Navigation Menu

Repository navigation

React bug with Candlestick #4729

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

React bug with Candlestick #4729

Description

Activity

nicolaskruchten commented on May 12, 2020

archmoj commented on May 14, 2020

nicolaskruchten commented on May 14, 2020

AdamDorwart commented on Nov 8, 2020

AdamDorwart commented on Dec 14, 2020

michaelbabyn commented on Jul 7, 2021

archmoj commented on Jul 7, 2021

michaelbabyn commented on Jul 7, 2021

archmoj commented on Jul 7, 2021

Metadata

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Issue actions