'plotly.js "pseudo" histogram for time-series data?

I am trying to figure out how to create this overlaid plot of time-series data, where one of the series should "look" like a histogram.

The problem is I could not figure out how to combine/overlay a histogram with time series data and line/scatter plot and get the histogram xbins to work with the date time data, etc.

So I was also trying to use a bar chart, and create a "pseudo histogram" by removing the gaps between bars, adding outlines, and so forth but that seems fruitless as I don't see a way to control all the borders/lines to that level of control.

The result I am looking for is roughly like so;

enter image description here

Which to me looks like the best match for a plot type should be a histogram, but again I could not figure out how to make that work overlaid with the same x axis as the line/scatter time-series data.

Can anyone offer ideas or point me to an example that might help me understand how to do this ?

I guess I also need to figure out how to align the y-axis scales of the two series also, but that I expect is a different topic...

I am specifically using plotly.js / Javascript



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source