Creating a New Solution
If you want to create your own solution, simply click "New" in the Solution Manager, and follow the
Wizardwizard steps.
Once
theloading is complete, you'll see
thethe Designer
Home Page, that contains all of the basic information for this solutionhomepage, the main UI for editing your solutions.
| Expand | ||
|---|---|---|
| ||
In On the homepage, you can change the Theme theme you'll be using: ; we offer five different options (Light, Dark, Indigo, Blue, and Live). By default, Light will be selected. On the right side of the screen, you'll find the common steps to start exploring our platform, from DataExplorer Data Explorer to Runtime. Those These basic features are explored covered in the Designer Tutorial. I By default, our Solution Explorer Navigation navigation is filtered by All Modules and Features. If you wish to work with a simplified version of the platform, simply change the filter in the first box.
|
Data Explorer and MQTT Tools
The DataExplorer tools allow you to easily perform data mining and monitoring from various data sources, including MQTT Brokersbrokers, OPC-UA, PLCs, and SQL databases. Here, let's see how you can connect to our MQTT Simulator to browse its data.
Go to Data Explorer → MQTT Tools to start. You can connect to your own broker , or use own our built-in MQTT Brokerbroker.
Out Our platform also offers a an MQTT Publisher Simulator, that which has customizable data being published. Simply click both of the green "startStart" buttons to start the Broker broker and Simulatorsimulator.
When first starting the MQTT Brokerbroker, it does an auto-connectconnects, but anytime is necessary, you can manually Connect connect and Disconnect, disconnect anytime using the Play and Stop buttons.
Once you've done sothis, click "Connect" to see view and browse the generated data.
Creating Tags and Device Points
We'll be using this simulated data to make it easier to build a simple solution. Select "DeviceD1, " from the list of simulated data , and click "Export to Solution." This will create a new Data Model with the device properties. In this example, we named the new Data Template "SolarPanel." In the Module option, we'll leave the first option selected, which represents the traditional behavior of mapping tags to external devices.
| Tip |
|---|
The platform also has the TagProviders functionality, which allows consuming directly data from other sources , without having to create tags. |
Unified Namespace and Tags
In the Unified Namespace section, you'll be able to define the data models you'll use in the solution.
The AssetsTree is the central point , where you can manage Asset Foldersasset folders, Create create and Edit Tagsedit tags, and link data from TagsProvider ConnectionsTagProvider connections.
In this Getting Started guide, as you can see on in the RootTags folder, the Export of the DataExplorer export has already created already a Tag tag "Device01."
You can go ahead to review the Devices configuration, or explore a bit more functionalities on in the Unified Namespace:.
| Expand | ||
|---|---|---|
| ||
When building a new solution, it's a good practice is to start by creating Data Templatesdata templates. In this case, the SolarPanel data template will have already been created , since we exported it from the MQTT Simulator. You can also create your data templates manually or import them from csv CSV files or other libraries.
|
| Expand | ||
|---|---|---|
| ||
Once you have your Data Modeldata model, the next step would be is to create tags and map it them to a Devicedevice. This was has already been done automatically, but once again, you can do it manually if you wish. Here, you'll find that the tag "DeviceD1" has already been created , with the type "DataModel1," , that contains containing all of the properties of the device from the MQTT Simulator.
To create a New Tagnew tag, simply click the "New Item" option in the Tags menu.
|
| Anchor | ||||
|---|---|---|---|---|
|
The Wizard wizard from Data Explorer automatically created automatically a connection with the MQTT Brokerbroker, but it's important to understand what happened behind the scenes.
In addition to MQTT, OPC, Rockwell PLCs and Codesys devices, we offer 70+ native industrial communication protocols.
The use of those Using these communication protocols is a straight forward straightforward process:
- Create a Channel, which is an instance of the Protocol protocol with optional configuration settings.
- Create a Node within that Channel, which specifies specifying the device's location of that Device in your network , using the PrimaryStation Fieldfield.
- Map a Tag tag in your application to an Address address in the Device Node.
The Export Wizard we used on the DataExplorer did those 3 in Data Explorer completed these three steps automatically to for you.
| Expand | ||
|---|---|---|
| ||
In this case, since we mapped the MQTT Simulator to the solution, creating a Channel was created using the MQTT SparkPlugB protocol protocol.
|
As an Exercise exercise you can create one more Tag tag and its mapping.
| Expand | ||
|---|---|---|
| ||
Simply click on the main toolbar to create a new Tag1 in the upper menu of the Points section and create tag on top of the page. Create a new Tag1 as a "SolarPanel" type.
Once you do that, add it to the Points table and map it to a specific Addressaddress. You can either type in the address or browse the available data. A An important thing to consider is that you only need to map at the device level, as the system will automatically read all of the properties associated with that device.
|
Creating a Simple Display with Symbols
Let's start by exploring the Draw Environmentenvironment. To access it, go to Displays → Draw, or simply click the Draw button at in the top menu.
This opens the main Draw Environment. By default, the first page created will be the MainPage, where your main content should go.
On the left side of the screen, you'll find all of the components you can use to build your display. They're categorized by different types of graphical components, such as icons, charts, navigation, and symbols (incluindo including high-performance graphics). You can also search for something specific in our library using the search input.
In this example, add a button from the Symbol Library . Follow the by following these steps:
- Navigate the tree to Symbols / Library / HMI , and select the red button , by clicking on it.
- Go to the position on the screen where you want to place it, and do a left-mouse click to insert it on the display.
- Double-Click in top of Symbol click on the symbol to open its configuration popup, where you can map the component's properties to your tags.
- In this example, there is only one exposed property, IsPressed, map . Map that property to Tag.Device01.State. Either either by using Intelisense IntelliSense when typing , or by using the button (...) to open a Tag Selection dialog.
That is That’s all you have to do! The value of Tag the tag is now connected to drive the visual of the Select Symbolselected symbol.
Optional exercices:
| Expand | ||
|---|---|---|
| ||
Another way of creating to create your UI is by dragging tags directly into the display. On the right side of the screen, you'll find all of your tags - if tags—if you drag them into the display, it 'll will automatically create a text output, but you can also map them to specific symbols to create those automatically. To do thatthis, select the tag (or the whole entire Device) you'd like to map and click "Map to Symbol." You'll then be able to select symbols you've created to display your data. Once that's done, if you drag the tag into the Displaydisplay, it 'll will automatically create a symbol. In this example, I've already added a CircularGauge to my library to showcase the device temperature.
|
| Expand | ||
|---|---|---|
| ||
Another unique feature of our platform is the ability to customize any symbol with a great number wide range of dynamic properties. Those include custom Actions, Scripts, Visibility, Rotation, and more. For this example, add a simple rectangle to the display and double-click it to look at explore the available properties. For this example, I created a simple expression to change the fill color depending based on the value with using a simulation tag in the expression.
You can create a new symbol combining those two components and save it into your Symbol Library. To do thatthis, first, break apart the button symbol and , then select all the parts and select choose "Create New Symbols Symbol with Select Selected Elements." . This gives you more flexibility to use our library as a base to create for creating custom symbols that fit your industrial application.
As you make changes, make be sure to save your display by clicking on the save button on at the top of the page.
|
Create a Real-Time Alarm
To test out the Alarming alarming functionalities in the platform, let's create an alarmAlarm.
On Alarms → Items, simply type on the first line of the table to create a new Alarm. Type "DeviceD1." and you'll see the available properties associated with that Device - for . For this example, establish a condition, set a limit, select a group (there will be a few are available as by default), and add a message to showcase display when that limit is reached.
On Draw, using the left panel, navigate to pickup the component Module > AlamViewerAlarmViewer. Alternatively, you can use the Search Box to find the component.
Running your Solution
It's time to run your solution by clicking on the Runtime module (or selecting the play icon on at the top of the page for a quick shortcut). In On this page, you'll find information regarding the solution, including redundancy settings and , command lines, and URL URLs for the clients.
To run your solution, simply click "Run Startup.".
| Warning |
|---|
The first time you Open edit and Run run solutions after a new installation, Windows Firewall may request you authorize its useauthorization. Just press OK if a User Authorization user authorization request , or firewall message , is prompted. |
| Tip |
|---|
Click on the Play button for HTML5 Client URL to see your solution running also as a Web Client! |
In this section:
| Page Tree | ||||
|---|---|---|---|---|
|