Shift bar graph to a center of period

[grafalex]

I have a water measurement device, that reports a message for each consumed litre of water. These values are stored in InfluxDB as monotonically increased values. I also set up a continuous query to aggregate hourly values:

CREATE CONTINUOUS QUERY cq_water_cold_hourly ON homeassistant 
BEGIN 
  SELECT max(value) 
  AS value 
  INTO homeassistant.month.water_meter_cold_hour 
  FROM homeassistant.autogen.l 
  GROUP BY time(1h), entity_id 
  fill(previous)
END

Now I want to draw a consumption graph, like this

Here I used line graph, with stairs option on. This graph looks correct in terms of data and intervals: stairs are located on hour boundaries, and the value represents how much water consumed during this hour.

While the data and representation is correct, I do not like the look. I would prefer bar graph.

But this graph has 2 issues:

1. the bar is centered at the hour boundary, and therefore it is not really clear whether it belongs to a previous, or to the next hour
2. There are strange holes like one at 17:00. Perhaps hot water counter did not report any values during this hour, and continuous query did not generate any new values as well, but overall it looks strange.

Is there any ways to fix these 2 issues? At least first one (I know second one causes a big debate on InfluxDB forums)

[grafalex]

Looks like I figured out where the gap at 17:00 comes from, but I still have no idea how to fix that

[eduardogodinho]

check if this helps

Hole on stacked bar graph