OHCL / candlestick - Just a scatter with x and four y´s ?

[SW4T400]

Hi,

I am working on a dash visualization app for financial data and scatters cover 99% of what I need, but the 1 thing I cant do without is a candlestick chart. I currently use tsdownsample to downsample each of the ohlc columns - in a way treating each feature as its own trace in the hopes of not losing too much info (see below).

My way of thinking:
OpenHighLowClose data is just a scatter trace with x and 4y´s which I want to downsample

Also: I dont mind losing some information when fully zoomed out - closer views matter the most. I will make decisions based on a zoom level where no resampling is happening anyways.

I can of course use the new dash "patch figure" option but I dont want to re-invent plotly resampler for all my traces!

Hence my question ↓

• Does anyone have hints or ideas as to how to implement ohlc downsampling in plotly-resampler?
• QUICK AND DIRTY ideas are very welcome ;) as I only need it for a single trace in a plotly-resampler make_subplot figure.
• Which codelines do I start at? I am hoping for some quick inputs from the authors ;) @jonasvdd
• Has anyone implemented any resampling for non-scatters?

def downsample_OHLC(df):
    #returns x,o,h,l,c
    
    
    #% downsampling the candles
    x = df["date"].to_numpy() 
    yo = df["open"].to_numpy() 
    yh = df["high"].to_numpy() 
    yl = df["low"].to_numpy() 
    yc = df["close"].to_numpy() 

    n_out=500

    # Downsample to 1000 points using the (possible irregularly spaced) x-data
    dsi_o = MinMaxLTTBDownsampler().downsample(x, yo, n_out=n_out)
    dsi_h = MinMaxLTTBDownsampler().downsample(x, yh, n_out=n_out)
    dsi_l = MinMaxLTTBDownsampler().downsample(x, yl, n_out=n_out)
    dsi_c = MinMaxLTTBDownsampler().downsample(x, yc, n_out=n_out)

    # Get unique values from the combined array
    dsi = np.unique(np.concatenate((dsi_o,dsi_h,dsi_l,dsi_c)))
    
    return x[dsi],yo[dsi], yh[dsi], yl[dsi],yc[dsi]```

[SW4T400]

I believe I have to work on the following code snippet from here.

@app.callback(
    Output({"type": "dynamic-graph", "index": MATCH}, "figure", allow_duplicate=True),
    Input({"type": "dynamic-graph", "index": MATCH}, "relayoutData"),
    State({"type": "store", "index": MATCH}, "data"),
    prevent_initial_call=True,
)
def update_fig(relayoutdata: dict, fig: FigureResampler):
    if fig is not None:
        patched_figure = Patch()  # create patch
        for trace in fig.construct_update_data(relayoutdata)[1:]:  # skip first item as it contains the relayout
            trace_index = trace.pop('index')  # the index of the corresponding trace 
            patched_figure['data'][trace_index] = trace  # add all the other data to patch
        return patched_figure
    return no_update

[SW4T400]

For anyone trying to resample traces other than scatters, heres a piece of my code that worked for me:

I have a df-store where my original data is stored - this data is resampled based on what the xrange of the last trace in fig.construct_update_data(relayoutdata)

@app.callback(
    Output("graph-id", "figure", allow_duplicate=True),
    Input("graph-id", "relayoutData"),
    State("store", "data"),  # The server side cached FigureResampler per session
    State("df-store", "data"),
    prevent_initial_call=True,
    memoize=True,
)
def update_fig(relayoutdata: dict, fig: FigureResampler,df: pd.DataFrame):
    if fig is not None:
        patched_figure = Patch()  # create patch
        
        update_data=fig.construct_update_data(relayoutdata)
        
        print("relayout:")
        print("----------------------------")
        ppprint(relayoutdata)
        print("----------------------------")
        print("construct_data:")
        # ppprint(update_data)
        
        if update_data is not no_update: # not autosized according to resampler

            # wrong according to: https://github.com/plotly/dash/issues/2709#issuecomment-1853008462
            # for trace in update_data[1:]:  # skip first item as it contains the relayout
            #     trace_index = trace.pop('index')  # the index of the corresponding trace 
            #     print("index:" + str(trace_index))
            #     patched_figure['data'][trace_index] = trace  # add all the other data to patch
                
            for trace in update_data[1:]:  # skip first item as it contains the relayout
                trace_index = trace.pop("index")  # the index of the corresponding trace
                # All the other items are the trace data which needs to be updated
                print("index:" + str(trace_index))
                # print(trace)
                for key, v in trace.items(): #key = x,y,name
                    # print(key)
                    patched_figure["data"][trace_index][key] = v 
                
            #-----------------------------------------------------------------------------    
            # In index 0 there is also my OHCL which is never returned by fig.update
            # as plotly-resampler is not made for that. Hence we do some
            # resampling on OHCL Candlestick trace ourselves:
            #-----------------------------------------------------------------------------   
            
            # instead of implementing our own check for autorange,reset or 
            # real xaxis change i take the resampler traces x-data to determine
            # my x-range - the last trace in the for loop will do:
            df_xrange = df[(df['date'] >= trace["x"][0]) & 
                            (df['date'] <= trace["x"][-1])]

            x,yo,yh,yl,yc=downsample_OHLC(df_xrange)
            
            patched_figure["data"][0]["x"] = x
            patched_figure["data"][0]["open"] = yo
            patched_figure["data"][0]["high"] = yh
            patched_figure["data"][0]["low"] = yl
            patched_figure["data"][0]["close"] = yc

            return patched_figure
        else:
            print("no_update")

    return no_update