Chart as background, behind other HTML

Dash Python
1

In the past, I built a monitoring dashboard that used chart.js, with charts used as background behind other text.
It looked something like this:

Screenshot 2022-09-19 at 22.19.35
Screenshot 2022-09-19 at 22.19.351866×880 172 KB

Based on the dashing.io/smashing.io framework, that consisted in writing Ruby + CoffeeScript, neither languages I’m comfortable. It is hosted in Heroku.

As it’s becoming nearly impossible to maintain and host, I’m thinking of moving to Dash (which I’ve used quite a bit recently), but what I don’t know is this:

Is it possible to use Plotly for the graphs, in the same way as chart.js were used?, meaning as background canvas, using the full size of the container, and with text and other HTML being overlaid on top?

2

Absolutely, in the end, you’re writing HTML and CSS.
You can fit the graph to be in your container.
then make your container to be position relative and your text position absolute and z-index 1.
I have actually done the exact thing you’re describing with this method.

1 Like