Learn how to use Dash Bio for next-gen sequencing & quality control. 🧬Register for the Oct 27 webinar.

Data missing from dash scatter graph

I am trying to display some sensor data in a plotly-dash graph with django. I have noticed that in some scenarios, data is ommitted from the graph and only displayed properly once the timesale has been zoomed out (see below).

Before zooming out, some data is omitted:

And then it is displayed again:

I am currently using the following code:

        ambientTempApp = DjangoDash("ambientTemp")
        ambientTempApp.layout = html.Div([dcc.Graph(id='tempGraph'),
                                          dcc.Slider(
                                              id="tempSlider",
                                              marks={1: {'label': '1 Day'},
                                                     7: {'label': '1 Week'},
                                                     31: {'label': '1 Month'},
                                                     62: {'label': '2 Months'},
                                                     182: {'label': '6 Months'},
                                                     365: {'label': '1 year'}},
                                              max=365,
                                              min=1,
                                              value=7,
                                              step=1,
                                              updatemode='mouseup'
                                          ), html.P(className="description-text", id='ambientOutput')])

        @ambientTempApp.callback([Output('tempGraph', 'figure'), Output('ambientOutput', 'children')], [Input('tempSlider', 'value')])
        def update_figure(value):
            value *= 48
            TIMESTAMPS = [datetime.datetime.fromtimestamp(x) for x in
                          self.dataTimestamps[::-1][:value]]
            ambientTemp = self.dataAmbientTemp[::-1][:value]

            fig = Figure(data=Scatter(x=TIMESTAMPS, y=ambientTemp, mode="lines+markers", name="Ambient Temperature"))
            fig.update_layout(showlegend=False, transition_duration=250)

            return fig, f"Displaying data from {str(TIMESTAMPS[-1]).split('.')[0].replace('-', '/').replace(' ', '-')} to {str(TIMESTAMPS[0]).split('.')[0].replace('-', '/').replace(' ', '-')}"
        return None

I suspect that the reason for this is that the graph is running out of space to display the points when they are varying less on the y axis. Is there a variable I can set to ignore the lack of space and display the data anyway?

Hi @lriley and welcome to the Dash community :slightly_smiling_face:

The problem is likely with the data - maybe that the dates are not sorted correctly.

If you that doesn’t fix it, then supplying a small amount of sample data could help.

Hi, I can confirm that the dates are sorted correctly and that the graph works with a smaller ammount of data. However, I need to be able to see my sensor data for a long timescale (whilst also only having an interval of 30 mins), so I cannot use a smaller ammount of data on the graph. Is there any way I can fix this?