Don't show values on x-axis if there isn't data (stitch together time gaps)

I only record data for certain measurements during business hours. When trying to create graphs over multiple days in the Cloud UI there are large gaps in between the data that get interpolated, rendering the Cloud dashboard visualizations worthless for date ranges longer over more than one business day. I believe this is due to how the js library is defining the x-axis. Is there a way to remove time values from the x-axis when the value is null?

Hi @pbdeuchler,
Could you potentially use a filter to check the _value column for null. This would leave only your data which has a valid value.

   |> filter(fn: (r) => exists r._value)

Hello Jay, thanks for the quick reply! Influx is returning the proper data, there are no null values in my result set. As mentioned I believe this is due to how the xTicks are being instantiated in the giraffe JS charting library that is used in the UI. With sparse timeseries data xTicks should be provided with an array of values only where data exists instead of using the automatic stepping functions. With the current way the charts display you end up with multi day graphs that look like this:

Please correct me if i’m barking up the wrong tree here and there’s something else I can do in my query to fix this.

Hi @pbdeuchler,
Sorry for the late reply. I believe I understand your requirement now. Instead of having the graph’s automatically join plots like this marked in red:


You would rather have a UI toggle that allowed you to disable this feature and leave spacing between the data to ingest points?

More that I would like to join the graph at that point, so my x axis will skip any time points that do not have values associated with them. So the last data point on Tuesday end of business will be directly next to the first data point at business open Wednesday.

Understood, I think it’s a fair use case. If you want to make a feature request via Github I will happily advocate internally for you.

@Jay_Clifford, on a related note, do you know if there is already support within the Giraffe library for leaving blank spaces on the x-axis for null values, or is this something that would also need a feature request?

I’ve been playing around with Giraffe trying to make some custom graphs using data housed outside of InfluxDB, but unlike @pbdeuchler, I’d like to have blank spaces in the area you highlighted in red when nulls are encountered.

In d3.js, the line.defined value accessor makes handling these types of discontinuous lines easy, but I haven’t found a comparable option in Giraffe yet. Hopefully I’m just overlooking something obvious.