Introducing View of Things in TIA Portal

A first look at the new View of Things (VoT) mechanism for creating web applications for S7-1500 PLCs in TIA Portal v17 and greater.

One of the most interesting new features in TIA Portal v17 is the new system for creating user-defined web pages known as View of Things. View of Things allows a user to create user-defined web pages using the WinCC unified editor and pre-defined graphical elements in TIA Portal.

Previous versions of TIA Portal also supported the creation of user-defined web pages however, the creation of the web pages was a tedious process that required separate tools for creating HTML and JavaScript files. View of Things offers a massive improvement over the old way of working.

In this article, we’ll look at the advantages of working with View of Things, the limitations of View of Things, and run through a demonstration of how easy it is to create a web application for your PLC using View of Things.

Advantages of View of Things (VoT)

View of Things provides an easy way to create simple web visualizations for a PLC with no special programming tools using the WinCC Unified Editor. This makes View of Things an ideal way to create simple tools for monitoring and controlling data in a PLC for commissioning or maintenance.

If the functionality required evolves, then the VoT visualization can be migrated to a WinCC Unified application that runs on a WinCC Unified Panel or PC.

Limitations of View of Things

View of Things is designed to create simple web applications that run on the webserver of an S7–1500 controller. For CPU performance reasons, there is a limitation of 10 screens and 100 tags per CPU.

Since View of Things works with the webserver of a PLC, user management is done via the web server user configuration. We’ll see an example of managing users in the demo section of this article.

Finally, VoT is a new feature available for newer versions of TIA Portal and newer firmware of the S7–1500 controllers. To use VoT, you will need to have at least TIA Portal v17 and an S7–1500 controller with firmware version 2.9 or newer.

View of Things (VoT) Demo

With the introduction out of the way, let’s look at a hands-on demo of how to set up and use VoT in your projects.

Set-Up

In the example below, I’ve created a new project in TIA Portal v17 and added an S7–1500 controller to the project.

Create a New Project with an S7–1500 PLC

View of Things is used to create web applications that run on the web server of the PLC. For this reason, we have to enable the web server in the PLC. In the PLC settings, enable the PLC’s web server and permit access via HTTPS only as shown below.

Activate web server and only permit access via HTTPS

Next, we need to configure a user for the web server and give this user permission to read and write tags via the web server. We will use this user’s credentials to log in to the VoT application later on.

Create a user with permission to read and write tags

In the Project Tree, expand the PLC node. You can see a new folder here called Web Applications.

Double click Add new VoT application to add a new VoT application to the project. In this example, I will leave the application with its default name, ViewOfThings.

Add a new VoT Application

Expand the Screens node and add a screen. The new screen automatically opens.

Add a Screen to the VoT application

Slider

To demonstrate the functionality of VoT, we’ll use a slider to write a value to a tag in the PLC.

To start, drag a slider element onto the screen.

Add a slider to the screen

In the default tag table, create a new tag with a type Int. In this example, I’ve added a tag called Slider_Value. To connect this tag to the slider, drag the tag from the Details View and drop it onto the slider. Super easy, right?

Connect a tag to the slider

Dynamic Objects

Next, we’ll add a dynamic object to the screen. Drag a circle from the Toolbox onto the screen.

Add a circle to the screen

In the Appearance tab, specify that the Dynamitization is based on a tag. Then select the Slider_Value tag and the conditions to change the background color.

Update Dynamitization settings

Button

Next, we’ll add a button that uses JavaScript to write a tag value. To start, drag a button onto the screen.

Add a button

With the button selected, switch to the Events tab and navigate to the Click left mouse button event. Finally, click the button to switch to the JavaScript editor.

Open JavaScript editor

Right-click in the JavaScript editor to access the code snippets. Navigate to the Write Tag snippet.

Write tag snippet

Update the snippet so that it writes the value 0 to the Slider_Value tag.

Update snippet

Navigation

Finally, we’ll add a second screen to the application and add a navigation button to navigate from the first to the second screen.

Add a new screen to the web application and drag the new screen onto Screen_1 to create a navigation button.

Add navigation button

Compile

With our VoT application set up, compile the web application. This has to be done separately from the PLC compilation.

Compile VoT application

Once the compilation is complete, download to the PLC as normal. In the Load Preview window, be sure to select the option to download the web application to the PLC.

Select option to download Web applications

Access View of Things Application

With the VoT application download, you can now access the web application in your browser. Navigate to your browser at the IP address of the PLC followed by /~, the name of the application, and /index.html.

In my example, the address of the application is 192.168.0.1/~ViewOfThings/index.html.

Log in to the web application using the credentials that you created earlier.

Log in to VoT application

Once logged in, you can move the slider and see that the background color of the dynamic circle changes with the tag value.

See test slider and dynamic circle

Next, you can click on the Reset button to reset the value of the Slider_Value tag.

Test Reset button

Finally, you can click on the Screen_2 navigation button to navigate to Screen_2.

Navigate to Screen_2

Conclusion

In this article, I introduced the new View of Things web applications that are available in TIA Portal v17 for S7–1500 PLCs with firmware version 2.9 and greater.

Personally, I’m in love with VoT — I finally have a way to easily create web applications for my PLC without writing any custom code. This is an incredibly powerful feature for creating small visualizations for PLCs in production or tools for commissioning systems where the SCADA/HMI systems are not available yet.

Latest articles