Summary
The SolarPanel Demo showcases a distributed application example by simulating a solar panel solution's the data collection, publishing, and viewing processes of a solar panel solution. This Demo demo uses a distributed software architecture to handle and process real-time data from multiple sources.
There are 2 two versions of the SolarPanel demo.
The first version, 'SolarPanel.dbsln' , included by default on with the software installation, requires only one solution file, with with the data defined in tags in within the solution itself and the simulated communication driver populating the values.
Download the solution file: SolarPanel.dbsln
The second version, 'fxAssetMonitor' used , uses the internal simulator to act as multiple devices, publishing data to a an EdgeCollector application (using the EdgeGateway product), which is will transform . This application transforms the data and sent sends it the to a centralized broker and the Canary Historian. FrameworX limited will act serves as the visualization tool, showing displaying data from the centralized MQTT broker and from the Canary Historian, enabling monitoring of the entire system.
Download the solution files:
- Edge: fxEdgeColletor
- Monitor: fxAssetMonitor.dbsln
On this page:
| Table of Contents | ||||||
|---|---|---|---|---|---|---|
|
Solar Panel Demo
Configuration file: SolarPanel.dbsln
Asset Selection
The key display in that demo is the left panel, with the TAssetTree Control.
That control allows the operator to select that area he wants to monitor, and that information is saved on the built-in variable Client.Context. The key properties of the Client.Context are listed in the following table.
Client.Context Properties Updated by the TAssetTree UI control | |
|---|---|
Property | Description |
AssetName | The complete path for the asset. Example: \SolarPanels\Tripoli\Tripoli[1].PanelVoltage. |
AssetPath | Path of Parent Node (excluding final attribute) |
AssetNodeName | Name of parent folder. Example: Tripoli |
AssetNodeDepth | The Depth of the node in the treeL Example: 2 |
If you add Client.Context.AssetName to dynamic UI properties in the display, it will show that string value, like: "SolarPanels\Tripoli\Tripoli[1].PanelVoltage"
To show the VALUE of attribute use the syntax Asset(<string with asset name>). Example: Asset(Client.Context.AssetName)
For advanced applications instead of using the Client.Context.AssetName variable, you can create any expression that results the string with the AssetName you want to monitor.
| Tip |
|---|
The properties presented in this table are automatically populated when a TAssetTree control is loaded in any display. In order to use that features, you must design your Operator UI having only AssetTree active at any given time. |
Map Update with Geo Location
The display showing the map , uses the TMapsOSM control, which is available for both WPF and HTML5 pages.
When running only in on Windows, it also available the TMapsESRI control and the TMapsGMap control are also available.
The DisplayIsOpen() task monitors the Client.Context.AssetName, and when ti it changes, it uses the map control API to zoom to the coordinates of the selected city.
| Tip |
|---|
This demo was created settings the Displays to the option StretchFill, which will resize to use the entire client area, but will distort the image with you resize to other aspect radios. You can also setup the system to various other OnResize options: StretchUniform, NoAction, Responsive, and ResizeChidren. For more information go to Display Settings page. |
Asset Information Page
When one specific SolarPanel is selected a Process Screen shows the detailed information about that asset.
This diagram was created using a Smart Symbol (see more about symbols).
In order to To set the Symbol Parameters to symbol parameters and bind the symbol the to a specific city, there are two ways to execute that the setup.:
- Using the TFlowPanel
- control
- Using the OnCreateDisplay
- method
Configuration of the Symbol Parameters
The TFlowPanel is an a UI control that allows you setup to set up multiple elements element types to added dynamic add dynamics to containers like WrapPanel, Grid, or StackPanels. StackPanel. However, in this case, it would not be not the a typical use of that control, as it would be adding the dynamic dynamics to just one object only, instead of multiple that rather than multiple, which is its main functionality. For more information see FlowPanel Control.
The second option, which is on Display involves display opening methods, was used in the demo. The The OnCreateDisplay(Canvas) method ) is called by the platform when the display is created, allowing you to customize the screen by adding custom elements to the screen.
| Code Block | ||
|---|---|---|
| ||
public void OnCreateDisplay(Canvas canvas)
{
Dictionary<string, object> labels = new Dictionary<string, object>();
string selectAsset = @Client.Context.AssetPath;
labels["Name"] = selectAsset + "Name";
labels["Current"] = selectAsset + "PanelCurrent";
labels["Voltage"] = selectAsset + "PanelVoltage";
labels["Power"] = selectAsset + "PanelPower";
labels["Temperature"] = selectAsset + "";
TSymbol.CreateSymbol("PanelSolarInfo", canvas, labels, 5, 5, false, false, false, false, null);
} |
Multiple Assets Page
When a city is selected, a dynamic page is creating show repetitions created to display multiple instances of the SolarPanelDashboard, each one mapping mapped to a unit on in the selected city.
Similarly Similar to the detailed page, there are two ways to setup that set this up in the configuration. Using : using the TFlowPanel control, as previously described, or by using the OnCreateDisplay internal method.
On with To use the OnCreateDisplay() methods method, use the following code:
| Code Block |
|---|
public void OnCreateDisplay(Canvas canvas)
{
double leftPosition = 5;
double topPosition = 5;
int len = TK.GetTagChildren(@Client.Context.AssetPath).Length;
string assetPath = @Client.Context.AssetPath;
for(int i = 0; i < len; i++) {
Dictionary<string, object> labels = new Dictionary<string, object>();
labels["Name"] = assetPath + "[" + i + "].Name";
labels["Current"] = assetPath + "[" + i + "].PanelCurrent";
labels["Voltage"] = assetPath + "[" + i + "].PanelVoltage";
labels["Power"] = assetPath + "[" + i + "].PanelPower";
labels["Temperature"] = assetPath + "[" + i + "].TemperaturePort";
if((leftPosition + symbolWidth) >= display.Width) {
topPosition = topPosition + symbolHeight;
leftPosition = 5;
}
symbol = TSymbol.CreateSymbol("SimplePanel_WPF", canvas, labels, leftPosition, topPosition, false, false, false, false, null);
leftPosition = leftPosition + symbolWidth;
} |
| Tip | ||
|---|---|---|
| ||
Using the built-in controls, like FlowPanel has , offers the advantages advantage of simplicity , or and requires no coding knowledge of coding required. The option using the code has the advantage to you . On the other hand, the code-based option provides full control and advanced customization options. |
AssetsMonitor Demo
Overview
The intent of this variation of the SolarPanel demo is to show case showcase a more comprehensive scenario, where you have external Historian tools in use, in the this case Canary, and , are in use, along with a distributed architecture where independent Edge solutions are publishing data to to the centralized Historian (or to the to centralized MQTT Broker), and another solution monitor monitors the aggregated data.
Out Our platform is used on both sides of that this architecture. The EDGE version of the product is used as the data collector and to publish the data. The publisher, while the unlimited product version is used the to monitor the entire system.
Architecture Diagram
the The following image has details the detail of components integrated in this example:
MQTT SparkplugB simulator
We used the FrameworX product EdgeGateway publishing that to publish data to the MQTT broker. The EdgeGateway software can collected collect data using multiple protocols, run scripts to normalize the data, and publish it to the centralized MQTT MQTT broker , or directly to the Canary historian Historian (or other systems) using Store and Forward protection.
The product's built-in MQTTspBSimulator MQTT SparkplugB Simulator was used to simulate multiple devices publishing data to the EdgeCollector.
MQTT Broker
For the Broker, we used the native MQTT Broker that is included with the framework. S ee See more at Built-In MQTT Broker page.
Certainly any Any other commercial MQTT broker would fit exactly the same in seamlessly into this solution. For For cloud deployments, we recommend the HiveMQ broker. See more at HiveMQ Broker page.
Secure Web Gateway
This application also showcases the SecureWebGateway Secure Web Gateway product , included in FrameworX, which allows safe routing of the data packets across network security zones. See more at Secure Multi-Port Gateway page.
Canary Historian
The collected data is archived in the Canary Historian, using the TagProvider connection that FrameworX has to with Historian Systemssystems.
Any other Historian historian could be useused, the Canary has the benefit for the but Canary offers benefits due to its partnership with Tatsoft, which includes free Historian Tags tags up to a certain quantity, easy integrated integration setup, and upgrade options. See more at the Canary Labs page.
Data Visualization
FrameworX unlimited Unlimited was used for the data Visualization visualization and data aggregation..
In this section:
| Page Tree | ||||
|---|---|---|---|---|
|
...