How to build this component: Multi Layered Gauge

[Jesse_Dale_Gimenez]

I saw this component from the general discussion page, share your project screen.

I am curious on how he managed to build this component

[Jesse_Dale_Gimenez]

Project screenshots - share yours

Hi I’d like to share with you some screens of my first project in Maker Edition ! your feedback is welcomed. [Screenshot (597)] [Screenshot (598)] [Screenshot (600)] [Screenshot (601)]

link

[pascal.fragnoud]

Maybe this comes from a charting module, I don't think this is from apex chart, maybe @bmusson 's embr charts ?

But chances are this is just a coordinate container used to layer 3 simple gauges on top of each other:

[lrose]

@pascal.fragnoud

But chances are this is just a coordinate container used to layer 3 simple gauges on top of each other:

I would use an SVG to make this.

Perspective, faster page

Okay, I had a bit of free time today, so here is a complete SVG solution. You could do the Label as SVG text as well, or a gauge needle if you wanted, I haven't gone that far. Just a little example of the power of using the Ignition Designer to add SVG elements. I didn't include the label for the example. Note: All of this (outside of the calculations needed to find the points for the shape) was done inside of the designer (yes I can be somewhat of a masochist at times. ). First a s…

[pascal.fragnoud]

I haven't used gauges much, so I have no idea how much they impact performance, but...
For a dashboard full of these, maybe.
If there's just one on the page ? I'd probably just stack the simple gauges.

[lrose]

@pascal.fragnoud

If there's just one on the page ?

Yeah, in this instance, probably not going to be a huge hit on performance. I just don't like being locked into a coordinate container or some funky CSS to fix positioning.

[bmusson]

@pascal.fragnoud

I don't think this is from apex chart, maybe @bmusson 's embr charts ?

Hm, I was going to say it looked like ApexCharts.