Overview
The TrendChart is a graphical tool for visualizing data trends. Its purpose is to display and analyze time-series data for process monitoring. Key functionalities include customizable Y and X axes, label and grid line settings, pen configurations, and SPC settings. Applications include monitoring production metrics and quality control. Configuration requires setting control names, binding tags, and defining pen properties. Usage involves selecting trend objects, setting up axes, and configuring visual elements for data display and interaction.
On this page:
Requirements
This component is Portable. It runs both on Windows (WPF) and on Web Pages hosted in any platform.
Configuration
- Go to Displays / Draw.
- On the Components Panel, select Charts, then TrendChart.
- Click or drag-and-drop it on the Drawing area to use it.
- Double-click the object to open the configuration window.
TrendChart Settings | |
|---|---|
Field | Description |
Control Name | Defines the name for the control, allowing it to be accessed in scripts. See Display CodeBehind. |
Bind to Tag | Specifies the object property where the Trend configuration will be saved. |
Bind Pens to Tag | Specifies the object property where the Pen values will be saved. |
Orientation | Sets the orientation of the TrendChart (Horizontal or Vertical). Options available:
|
Window | Sets the background color of the trend control. |
Labels | Defines the color of the trend control labels. |
Grid Lines | Sets the color of the grid lines in the trend control. |
Grid Lines Stroke | Defines the settings for the grid line stroke. |
Cursor | Enables or disables cursor settings in the trend control. |
Mouse Actions | Enables or disables mouse actions on the trend control. |
Marker Tooltip | Enables or disables tooltips for markers on the trend control. |
X Axis
Trend window settings | |
|---|---|
Field | Description |
X Axis: Duration | Sets the time span for the X-axis. |
X Axis: XY Chart | Enables or disables the definition of a range for the X-axis. |
X Axis: Labels | Specifies the number of labels on the X-axis. |
X Axis: Format | Defines the format of the X-axis labels. |
Y Axis
Trend window settings | |
|---|---|
Field | Description |
Y Axis: Y scale for each pen | Uses the min and max values of each pen for the Y-axis scale. |
Y Axis: Y Range | Defines a fixed range for the Y-axis. |
Y Axis: Labels | Specifies the number of labels on the Y-axis. |
Y Axis: Format | Defines the format of the Y-axis labels. |
Y Axis: Stack Y scales | Enables stacking of similar Y scales. |
Y Axis: Merge similar Y scales | Merges similar Y scales. |
Pens
Trend window settings | |
|---|---|
Field | Description |
Pens: ID | Identifier for each pen. |
Pens: TagName | Sets the tag that provides the value for each pen. |
Pens: PenSettings | Configures the pen settings, including line color, stroke, and marker type. |
Pens: MinValue | Defines the minimum value for the pen according to the Y-axis range. |
Pens: Auto | Automatically sets the pen value based on the defined range. |
Pens: MaxValue | Defines the maximum value for the pen according to the Y-axis range. |
Pens: PenLabel | Sets the name of the pen. |
Pens: LimitMinMaxValue | Removes points less than the tag's Min value and greater than the tag's Max value. |
Pens: Square | Fills the pen points with a square wave. |
Pens: FilterLevel | Specifies the filter level to group points on the XY axis, calculating the average. |
Legend | Defines the position of the legend in the trend control (e.g., RightPanel). Options available:
|
Using Y Axis Scaling
Considering:
Y-axis Min = 0;
Y-axis Max = 100;
The trend control allows many pens to be displayed together. When your pens do not have the same range, you can use the tips below to fit your data in the same chart and for better visualization:
If a pen has a lower range, 0 to 1 for example, you can set the max property of the pen to 1. When the real tag value is 1, the value 100 will be displayed in the chart. (100/1 scale).
If a pen has a higher range, 0 to 1000 for example, you can set the max property of the pen to 1000. When the real tag value is 1000, the value 100 will be displayed in the chart. (1/10 scale).
===============
Added new property "FilterExpression" (string) in TDrillingChart and TTrendChart controls. This property is used with "select" command in where condition while getting samples from SQL historic.
Added new property "DisableXMinMaxChecking" (bool) in TDrillingChart control. This property is used to disable checking while scrolling X Axis, such as: depth < 0 and depth > current hole depth.
Created new properties and method in TDrillingChart and TTrendChart controls [only Windows Desktop]:
double RegionBeginPoint;
double RegionEndPoint;
DateTimeOffset RegionBeginDateTime [only GET];
DateTimeOffset RegionEndDateTime [only GET];
bool EnableRegionMode;
bool EnableRegionScroll;
Brush RegionOutsideBrush;
Brush RegionInsideBrush;
Brush RegionInsideStrokeBrush;
int RegionInsideStrokeThickness;
public void SetRegionDateTime(DateTimeOffset begin, DateTimeOffset end);
Add event handler while region is changed [only Windows Desktop]:
public event RegionChangedEventHandler RegionChangedEvent
Added new property "FilterExpression" (string) in TDrillingChart and TTrendChart controls. This property is used with "select" command in where condition while getting samples from SQL historic.
Added new property "DisableXMinMaxChecking" (bool) in TDrillingChart control. This property is used to disable checking while scrolling X Axis, such as: depth < 0 and depth > current hole depth.
Created new properties and method in TDrillingChart and TTrendChart controls [only Windows Desktop]:
double RegionBeginPoint;
double RegionEndPoint;
DateTimeOffset RegionBeginDateTime [only GET];
DateTimeOffset RegionEndDateTime [only GET];
bool EnableRegionMode;
bool EnableRegionScroll;
Brush RegionOutsideBrush;
Brush RegionInsideBrush;
Brush RegionInsideStrokeBrush;
int RegionInsideStrokeThickness;
public void SetRegionDateTime(DateTimeOffset begin, DateTimeOffset end);
Add event handler while region is changed [only Windows Desktop]:
public event RegionChangedEventHandler RegionChangedEvent
Runtime Execution
During runtime, the TrendChart Window visualizes time-series data, enabling users to monitor and analyze data trends effectively. Users have previously configured the TrendChart by setting control names, binding tags, and defining pen properties. They have also customized the Y and X axes, label and grid line settings, and SPC settings.
When the runtime environment is initiated, the TrendChart Window displays the configured data trends. Users can interact with the chart, adjusting axes and visual elements to refine their data analysis. The TrendChart dynamically updates to reflect real-time data changes, providing a comprehensive view of production metrics and quality control parameters. This tool facilitates detailed process monitoring and supports informed decision-making based on the visualized data trends.
In this section: