GLG CHART COMBO DEMO OVERVIEW The demo demonstrates how to display, configure and update a GLG realtime stripchart widget containing multiple stacked charts that share a common Time axis. All charts scroll together when updated with data or scrolled by dragging the charts with the mouse. The demo loads the stripchart_combo.g drawing containing stacked stripcharts and configures the charts dynamically at run-time based on the supplied configuration data. The configuration data includes the list of variables to be plotted, as well as a chart title, a low/high range, a plot color and a data supply tag for each variable. A vertical cross-hair line in all charts follows the mouse cursor when the user moves the mouse inside one of the charts or along the Time axis. A label annotation showing the value and the time stamp of the nearest data sample is displayed next to the cross-hair line in each chart. The chart toolbar contains buttons to scroll and zoom the chart, as well as change the time span on the Time axis. The toolbar is a GLG viewport included in the GLG drawing. The Select Chart toolbar button displays a dialog that may be used to select variables to be plotted from a list defined by the configuration data. When a variable is selected or deselected, a chart showing this variable is added or removed from the display, and the layout of all charts is automatically adjusted to fill all available space using the new layout feature of the GLG square series. The plot data for each variable is preserved even when the variable is not displayed. Alternatively, the chart selection may be implemented via HTML using an HTML list object. Configuration1 and Configuration2 HTML buttons demonstrate how to change the list of displayed variables by loading different configuration data. This reconfigures the charts on the fly according to the new configuration without reloading the drawing. Chart configuration data may be loaded from a file or defined in the source code. The application may extend the code to build configuration data dynamically as needed. Configuration data are supplied to the chart as an array of objects of type ConfigRecord. The demo displays one plot with one Y axis in each chart. This functionality can be extended to support multiple Y axes and multiple plots in each of the charts. DATA ANIMATION The demo uses simulated data generated by ChartDemoDataFeed. To use live data for animation: - Change the RANDOM_DATA variable to false in the source code. - Provide a custom implementation of the ChartLiveDataFeed object. DETAILS A GLG drawing stripchart_combo.g is loaded by LoadAssets(). Configuration data are loaded by LoadConfiguration(), and the charts get configured dynamically based on the loaded configuration. If USE_CONFIG_FILE is set to true, configuration data are loaded from a supplied configuration file in the JSON format. Otherwise, a predefined configuration table is used to configure the charts. The example shows how to use either a configuration file or a predefined table, using ConfigFile1_JSON.txt and ConfigDataTable1 for Configuration1, and ConfigFile2_JSON.txt and ConfigDataTable2 for Configuration2. The demo expects configuration file in the JSON format. Based on the loaded configuration, the number of charts is set in ConfigChartsBeforeH() invoked before hierarchy setup. The individual charts are configued in ConfigChartsAfterH() invoked after hierarchy setup, when the chart instances have already been created. Animation of the chart plots can be driven by a tag supplied as part of configuration data. A tag represents a datasource variable in the backend system that supplies data for a corresponding plot. The drawing is updated with data supplied by the DataFeed object using a timer with a time interval defined by UpdateInterval. The demo uses ChartDemoDataFeed to generate simulated data. The application should provide a custom data feed implementation via ChartLiveDataFeed object. A floating Chart Selection dialog activated by the Select Variables toolbar button provides a list of variables that can be plotted in a chart. When a variable is selected or deselected, its chart is added or removed from the display by changing its Visibility attribute, and the layout of all charts is automatically adjusted to fill all available space using the new layout feature of the GLG square series. Alternatively, the chart selection may be implemented via HTML using an HTML list object. The plot data for each variable are preserved and the chart continues to receive data updates even when the variable's chart is not displayed, so that when the chart is displayed, it displays all accumulated data. A vertical cross-hair line in all charts follows the mouse cursor when the user moves the mouse either inside one of the charts, or along the Time axis. A label annotation showing the value and the time stamp of the nearest data sample is displayed next to the cross-hair line in each chart, and the data sample is also highlighted with a marker. This functionality is implemented using TimeLines and Annotations feature of the GLG Chart. The SpanSelector drop-down menu in the toolbar allows to select a desired time axis span. The menu is initialized dynamically at run-time using the SpanData array. The Time axis labels and ticks are adjusted based on the selected time span, using data provided by SpanData array. The example uses hard-coded values for SpanData, but the application can extend the code to build SpanData dynamically as needed. If the SUPPLY_TIME_STAMP variable is set to true, the application should provide a time stamp for each data sample. Otherwise, the Chart object will supply time stamp automatically using current time. This demo is written using GLG Intermediate API.