Gauge Tiles (arc and radial)

Thanks again great support.

Now next i would like to make a dicimal number, and i see it is covered in another post with the code: function formatNumber(number, digits=1) { but i have a hard time to understand where to put in my code ther is as followed :

{ label: “buttom”, min: 0, max: 500, generateGradient: true, percentColors: [ [0.0, “#048d1f”], [0.50, “#b4d302”], [1.0, “#cb1007”] ], }

I do not see it on line 194 but on line 205 and when i change the digits from 0 to 1 and update it is the same. I know i do somthing wrong but i dont know what. :grimacing:

See my reply above - it was added natively to the Gauge.js Custom Tile and you can use fractionDigits as one of the chart customizations:

2 Likes

OK Thanks.

now i get it. and it works fine now.

Great help form you Thanks.

1 Like

Is it possible to change the line width and font size when using the gauges in Super Tile?

Since you mentioned a Super Tile, I assume you are referring to the native integration of Gauges rather than the custom tiles from this thread?

What do you mean by line width and font size?

Sorry for not being clear enough, Josh. The line width referring to the thickness of the arc and the font size for the display of the values.

I would like to change the arc segments to a thinner semi-circle and the value to a smaller font size.

Thanks in advance.

Bruce

The Custom Tiles listed at the top of this thread support customizations of the thickness of the arc. IIRC, the font size in the Gauge.js variant is set in the CSS of the Custom Tile but could in theory be customized… and the Apex Charts version can be customized with their JSON specification.

The native Super Tile Gauge does not support customization of the arc. The width changes automatically based on if you pick Arc, Circle, or Radial as the gauge style. And the font dynamically scales based on the number of characters to fit in the space (and thus can’t be overridden).

1 Like

Thanks Josh. I understand now. I’ll check out the Custom Tiles for the customization.