The Web Edition of the GLG Toolkit makes it possible to create dynamic graphical pages for visualizing real-time processes in a Graphical Editor and deploy them on the Web using JavaScript in either plain HTML, or in the React, Angular or Next.js framework.

With the Toolkit, dynamic HMI screens are created in an interactive Graphics Builder and deployed on the web using the GLG JavaScript library, which provides the same high update rate and elaborate user interaction as a conventional desktop application.

The GLG Graphics Server for either ASP.NET or JSP is also available for an alternative server-side web deployment of legacy applications that can reuse existing C# or Java application code. With the Graphics Server, the graphics is generated on the web server and displayed in a browser as an image that is periodically updated.

For conventional desktop applications, both the C/C++, C#, and Java editions of the Toolkit are also available.

Point and Click HMI Editor

The Web Edition of the GLG Toolkit includes the GLG Graphics Builder - a graphical editor with point and click interface for creating dynamic graphical pages, from simple dashboards to elaborate visual simulations. With the Graphics Builder, developers can create elaborate screens containing custom graphical objects with an application-defined dynamic behavior that can be animated with real-time data. A number of pre-built components and palettes are available for use as building blocks in the Builder, including dials and meters, charts and a GIS Map component.

GLG drawings use vector graphics and are resolution-independent, which makes it possible to deploy them on a wide range of displays - from large monitors to mobile devices. Drawings created with the Builder can be reused between all deployment platforms - C/C++, C#, Java, JavaScript / React / Angular / Next.js, for both desktop, Web and Mobile deployment.

Web / Mobile Deployment with JavaScript / React / Angular / Next.js

The GLG JavaScript Library is used to deploy the HMI displays on a web page in a browser, on any desktop or mobile device. The library provides an API to load and display drawings created with the Graphics Builder, animate them with real-time data and handle user interaction.

The GLG JavaScript Library implements full GLG run-time functionality present in the GLG C/C++, C# and Java libraries, allowing the same graphical page and programming logic to be shared between the desktop, web and mobile versions of an application.

The React, Angular and Next.js GLG components are provided in the React, Angular and Next.js integration examples and may be used to integrate GLG drawings in the React, Angular and Next.js frameworks. The GLG-related part of the JavaScript source code may be shared between the React, Angular, Next.js and standalone HTML versions of an application, as shown in the GLG demos and examples.

The library uses HTML5 canvas to render graphics and supports all major browsers: Chrome, Firefox, Edge and Safari, as well as mobile browsers. Since all rendering is performed by the browser on the client side, the server load is reduced, making it possible to use low-end embedded web servers for hosting a web application.

Web / Mobile Deployment with AJAX and Server-Side Graphics Server

The GLG Graphics Server may be used as an alternative way to web-deploy legacy applications written in Java or C# on an application server.

The Graphics Server takes care of generating dynamic images of the HMI displays and updating them with the real-time data. The Graphics Server uses the same C# or Java API as the corresponding desktop applications, making it possible to reuse the existing application code and quickly deploy the application on the web with ASP.NET or JSP with minimal changes.