Custom HTML block Gauge

I’m using a custom gauge as in your example.

How could I get the time of last data received to show in that gauge, just like your defaukt gauge block?

Hi @Lars_Andersson,

Just as a quick tip, the pre-filled code in the Custom HTML Block will display the DashboardBlock.input object. When you include a query in the block, the preview will update and display the object from your query, here is an example:

With this example in mind, I can access the last data query time with DashboardBlock.input.queries.time-series-0.time and a Gauge Query:

Let me know if you have any further questions.

Thanks!
Julia

How do you get the code to show in the preview window?

I realized that if I leave the default text in header and body I can now see the the same preview.
What I’m not clear on is how I can show, just the timestamp for example, next to the gauge.

any help here would be greatly appreciated.

Hi @Lars_Andersson,

For us to help you best, it’s always useful if you can provide any screenshots or details about your configuration along with your questions.

Since the Custom HTML Block is an advanced block that allows you to create data visualization using your own custom HTML, CSS, and JavaScript, you fully control what things look like and where things are.

In the screenshot that @JuliaKempf posted, the block configuration is the default configuration. So, if you create a new Custom HTML Block, you will be able to see the full object ( and if you look at the example, you can see how it’s displayed.

If you started from the Google Chart Gauge Example, it’s documentation is here:

https://developers.google.com/chart/interactive/docs/gallery/gauge

Working with this block would be really difficult if you’re unfamiliar with HTML, CSS, and Javascript. Here are some good resources that may help you get up to speed:

https://www.w3schools.com/