We have a handful of moving analog indicators bound to analog values coming from OPC tags. These of course are polled, so true realtime analog movement won’t be possible on the indicator. But I’m wondering if there’s a visual trick I can use to smooth the indicator’s sliding movements on the GUI as a visual thing only. We find the arrow to be a little jarring and appearing ‘laggy’ due to the nature of the polled tags it is bound to. If there were some way to at least let the arrow slide along the axis smoothly, I think that would make our display a bit easier on the eyes.
I understand some CSS may be required, which is fine. Open to any and all ideas.
I can do it in the browser Development Tools by selecting the indicator and adding the transition property.
I don't know where to add this in Designer to apply it to the component. It might be in the Advanced Stylesheet.
1 Like
Add a style into the advance style sheet
.psc-animate *{
transition: all 1s ease;
}
Then add the class to the analog indicator
Change the 1s to smaller to make the arrow move faster
5 Likes
Thank you both! This got me where I needed. I ended up adding this to my stylesheet, which saved me needing to set any classes on the analog indicator:
.ia_movingAnalogIndicatorComponent__wedgeIndicator {
transition: transform 0.4s ease-out;
}
