WagoWebVisu
Table of Contents
Lab Session: Visualisation using Wago E!Cockpit Webvisu
Introduction:
Visualisation in terms of machine control is an important feature for the end user. A visualisation provides important machine information to the user. This can be achieved via a Human Machine Interface (HMI). Wago E!Cockpit gives the software engineer the possibility to create a Visualisation by using the WebVisu Tool.
Learning Outcome
- Learn the basics on Codesys and Wago E!Cockpit Webvisu
- Map Variables to the Webvisu
- Make the Webvisu react to changes in your controlller
Preparation:
- Check out Wago's Demo Video on thir Visualisation Tool : Link
Regarding the Festo MecLab Stations, what is the information that would need to be shown in a visualisation? (consider thinking about digital twins)
Draw a sketch of the visualisation you would like to implement in Wago E!Cockpit WebVisu!
Lab Task:
Assignement: Visualisation in E!Cockpit
Choose on of the previously programmed MecLab stations! If you're done with one visualisation, switch to the other station!
In this section, a visualization of the program will be created. Visualization help show what is going on in the real machine at a glance.
Right click on Application and choose Visualization to add a visualization to your program.
Check Active on both available symbol libraries and click Add.
Changing colors
In the visualization window, drag and drop some basic shapes from the Visualization Toolbox on the left. Try to draw a simple conveyor belt shape using the basic shapes. E.g., use lines for the belt and a circle for the workpiece, etc.
Variables can be assigned to shapes from within the Properties tab on the bottom left. E.g., variables can toggle a color change
of shapes or move the shapes along an axis in the visualization.
Drag and drop a simple rectangle. Assign the OPT sensor's variable as the color variable. In Colors, make the rectangle turn green when in alarm state. This makes the rectangle in the visualization turn green when the sensor is triggered. Upload your new program and check if it works.
Showing current state
From the Common Controls tab, drag and drop a Text Field.
Text fields can show dynamic variables that change during runtime. This is done by using placeholders.
In your main program, create a new STRING type variable to store the current state's name in. In every state's do code, assign the current state's name to that variable. In the visualization, show that variable by typing Current State : %s into a text field. In that text field's properties tab, link your newly created STRING variable as the Text variable.
Run the program and see if the current state is showed in the visualization.
The placeholder %s is used to hold a string type variable. A list of placeholders can be found here.
Moving an object
An object's position in the visualization can be coupled on an INT type variable from the program. This is done in Properties under
Absolute movement, Movement, and either X or Y for the corresponding axis.
Create a moving circle (represents the workpiece) that moves when the real band moves. Use a new INT type variable as your Absolute movement in X direction variable and a new TON type variable to increment it. Adjust the incrementation size and delay for a better visualization.
Final task
Put everything together to build a visualization of the conveyor belt. Show the current state as well as whether sensors are triggered or not (over color change). Moving parts should also move in the visualization. A color change is sufficient to show if the stopper solenoid is actuated or not.
You can use parameters to show/hide objects in the visualization.