Configure a widget for other web-enabled AVEVA products

The AVEVA product list shown in Apps and HTML5 Widgets support web-enabled widgets by embedding them into Industrial Graphics. The following procedure describes the major steps of a workflow to embed a web-enabled widget within an Industrial Graphic.

To embed a widget in an Industrial Graphic

1. Open the Industrial Graphic Editor with your AVEVA product.

2. Create a new graphic and open it on the Industrial Graphic Editor canvas.

3. Select the Toolbox tab and select the Widgets folder to show the set of widgets.

   Widget thumbnails appear near the bottom of the Toolbox area.

4. Drag and drop the widget you want to embed within the graphic you created.

5. With the embedded widget selected, view the Properties area to show the list of widget properties.

6. Configure the widget's properties and save your work.

   A Limitation of Industrial Graphics in a Web-Enabled ViewApp or Application

A limitation of Industrial Graphics in a web-enabled ViewApp or application is the inability to invoke an animation from a graphic embedded within another graphic.

In the following example, the ellipse is embedded within the rectangle and the rectangle is lower in the z-order. The rectangle has interactive animation in which the user performs some type of action like push a button to start the animation.

If the ellipse has been assigned a Tooltip animation, clicking on the ellipse in a web-enabled AVEVA OMI ViewApp does not invoke interactive animation configured on the underlying rectangle.

An interim solution for this issue is to configure Tooltip animation directly on the rectangle element in this example.