workbench-WebWidget
This is a bajaux, HTML5-based application that incorporates a view with interactive functionality which allows you to edit properties and invoke commands from the view. You can easily add data to a WebWidget, such as the WebChart or Dashboard, simply by dragging one or more components onto the widget. The widget renders in both Workbench and HTML5 Hx interfaces. The widget also integrates into the environment. For example, commands defined for a WebWidget render as added tool bar icons in Workbench, as well as in the HTML5 Hx profile in a web browser.
Examples of the bajaux WebWidget include the following:
- The WebChart displays the Chart view which can display historical data and update with live data. Also, in a the view you can easily add data and invoke numerous commands and settings to modify data presentation.
Figure 1. Chart WebWidget 
- The CircularGauge displays the graphical gauge view which updates with live data and provides contextual information for the current value. At any time you can dynamically switch the display to another component simply by dragging and dropping a different component onto this widget.
Figure 2. CircularGauge WebWidget 
- A Dashboard may be added to any PxPage and displayed in the PxViewer. Additional WebWidgets may be added to the Dashboard pane to customize the presentation of data. The dashboard is used to write dashboard-specific data to and from a station for a specific user.
Figure 3. Dashboard WebWidget 
Configurable properties for the Chart widget
| Property | Value | Description |
|---|---|---|
| defaultOption | file:^charts/defaultOptions.chart | Provides an ORD for the defaultOption widget. You can browse to select another widget. |
| hideHeaderWidth | number | Controls header width. All headers are visible when you set this value to 800 pixels and above. |
| Visible | true (default) false | Sets the table to be visible in
the Px page interface (true) or not (false). |
| Enabled | true (default) false | Activates (true)
and deactivates (false) use of the object (network,
device, point, component, table, schedule, descriptor, etc.). |
| Layout | additional properties | Opens a layout window for specifying the size and location of the table in relation
to its parent (X, Y coordinates, height and width). |
| Js | view:webChart:ChartWidget (default) | Provides an ORD for the Javascript widget.
You can browse to select another widget. |
| layer | drop-down | null |
| legendVisibility | drop-down | Selects how to display the legend: Responsive, Show, Hide) |
| preferredSize | Default values: Width=000.00, Height=000.00 | preferredSize can use to set the values of height and width of widgetbar. |
| title | text | You can add the title. |
| titlevisibility | drop-down | Provides titleVisibility as per set value. (for example Responsive, Show, Hide) |
| wbViewBinding | Binding null —>WebWidget (default) | Defines an ORD for the bound label.
You can browse to select the ORD. This property also provides selectable options for Degrade Behavior (None, Disable, and Hide). |