How does the eHMI render

PLCnext Engineer
1

Hi,
Mostly out of pure curiosity; how does the eHMI actually work?
When viewing the actual webpage, it seems as if the entire webpage is a .png image, and that this is being refreshed (either parts of it or whole) everytime something in the HMI changes (values, colors etc).
Why doesn’t the eHMI engine create a pure HTML5 page with css instead? Too prone to rendering errors or inaccuracies?

Any information about how this engine works would be very interesting to me.

2

The eHMI uses the HTML5 canvas to give a graphical experience rather than one based on HTML controls. Another important reason why we use a canvas instead of a more standard web page is that we are building a scalable application that can be rendered onto various devices with the same presentation.

3

Aha, I see.
That canvas element seems rather clever.
Thanks