Um Qs en Webvisit 7361 en 01

AUTOMATIONWORX
Quick Start
UM QS EN WEBVISIT
Order No.: 2910020
WebVisit
AUTOMATIONWORX
Quick Start
WebVisit
09/2007
Designation: UM QS EN WEBVISIT
Revision: 01
Order No.: 2910020
This user manual is valid for:
Designation Version Order No.

WebVisit Basic 5 or higher 2985990
7361_en_01 PHOENIX CONTACT

WebVisit
Please Observe the Following Notes
In order to ensure the safe use of the product described, we recommend that you read this
manual carefully. The following notes provide information on how to use this manual.
User Group of This Manual

The use of products described in this manual is oriented exclusively to qualified application
programmers and software engineers, who are familiar with the safety concepts of auto-
mation technology and applicable standards.
Phoenix Contact accepts no liability for erroneous handling or damage to products from
Phoenix Contact or third-party products resulting from disregard of information contained
in this manual.
Explanation of Symbols Used

The attention symbol refers to an operating procedure which, if not carefully followed, could
result in damage to hardware and software or personal injury.
The note symbol informs you of conditions that must be strictly observed to achieve error-
free operation. It also gives you tips and advice on the efficient use of hardware and on
software optimization to save you extra work.
The text symbol refers to detailed sources of information (manuals, data sheets, literature,
etc.) on the subject matter, product, etc. This text also provides helpful information for the
orientation in the manual.
We Are Interested in Your Opinion

We are constantly striving to improve the quality of our manuals.
Should you have any suggestions or recommendations for improvement of the contents
and layout of our manuals, please send us your comments.
PHOENIX CONTACT GmbH & Co. KG

Documentation Services
32823 Blomberg
Germany
Phone +49 - 52 35 - 30 0
Fax + 49 - 52 35 - 34 20 21
E-mail tecdoc@phoenixcontact.com
PHOENIX CONTACT 7361_en_01

WebVisit
General Terms and Conditions of Use for Technical Documentation

Phoenix Contact GmbH & Co. KG reserves the right to alter, correct, and/or improve the
technical documentation and the products described in the technical documentation at its
own discretion and without giving prior notice, insofar as this is reasonable for the user.
The same applies to any technical changes that serve the purpose of technical progress.
The receipt of technical documentation (in particular data sheets, installation instructions,
manuals, etc.) does not constitute any further duty on the part of
Phoenix Contact GmbH & Co. KG to furnish information on alterations to products and/or
technical documentation. Any other agreement shall only apply if expressly confirmed in
writing by Phoenix Contact GmbH & Co. KG.
Please note that the supplied documentation is product-specific documentation only and
that you are responsible for checking the suitability and intended use of the products in
your specific application, in particular with regard to observing the applicable standards
and regulations.
Although Phoenix Contact GmbH & Co. KG makes every effort to ensure that the informa-
tion content is accurate, up-to-date, and state-of-the-art, technical inaccuracies and/or
printing errors in the information cannot be ruled out. Phoenix Contact GmbH & Co. KG
does not offer any guarantees as to the reliability, accuracy or completeness of the infor-
mation.
All information made available in the technical data is supplied without any accompanying
guarantee, whether expressly mentioned, implied or tacitly assumed. This information
does not include any guarantees regarding quality, does not describe any fair marketable
quality, and does not make any claims as to quality guarantees or guarantees regarding
the suitability for a special purpose.
Phoenix Contact GmbH & Co. KG accepts no liability or responsibility for errors or omis-
sions in the content of the technical documentation (in particular data sheets, installation
instructions, manuals, etc.).
The aforementioned limitations of liability and exemptions from liability do not apply, in so
far as liability must be assumed, e.g., according to product liability law, in cases of premed-
itation, gross negligence, on account of loss of life, physical injury or damage to health or
on account of the violation of important contractual obligations. Claims for damages for the
violation of important contractual obligations are, however, limited to contract-typical, pre-
dictable damages, provided there is no premeditation or gross negligence, or that liability
is assumed on account of loss of life, physical injury or damage to health. This ruling does
not imply a change in the burden of proof to the detriment of the user.
7361_en_01 PHOENIX CONTACT

WebVisit
Statement of Legal Authority

This manual, including all illustrations contained herein, is copyright protected. Use of this
manual by any third party is forbidden. Reproduction, translation, and public disclosure, as
well as electronic and photographic archiving or alteration requires the express written con-
sent of Phoenix Contact. Violators are liable for damages.
Phoenix Contact reserves all rights in the event of a patent being granted, in as far as this
concerns software of Phoenix Contact that meets the criteria of technicity or has technical
relevance. Third-party products are always named without reference to patent rights. The
existence of such rights shall not be excluded.
Windows 3.x, Windows 95, Windows 98, Windows NT, Windows 2000, and Windows XP
are trademarks of the Microsoft Corporation.
All other product names used are trademarks of the respective organizations.
Internet
Up-to-date information on Phoenix Contact products can be found on the Internet at:
www.phoenixcontact.com
Make sure you always use the latest documentation.

It can be downloaded at:
www.download.phoenixcontact.com
A conversion table is available on the Internet at:

www.download.phoenixcontact.com/general/7000_en_00.pdf
PHOENIX CONTACT 7361_en_01

Table of Contents
1 General....................................................................................................................................1-1
1.1 Introduction ........................................................................................................ 1-1
1.2 Information About This Manual ..........................................................................1-1
1.3 System Requirements ........................................................................................1-1
1.3.1 Supported Operating Systems ........................................................... 1-1
1.3.2 Hardware Requirements .....................................................................1-2
1.4 Supported Control Systems ............................................................................... 1-2
1.5 Ordering Data..................................................................................................... 1-2
2 Installing and Enabling the Software .......................................................................................2-1

2.1 Prior to Installation ............................................................................................. 2-1
2.2 AUTOMATIONWORX Software Suite................................................................ 2-1
2.3 Starting the Installation Program ........................................................................ 2-2
2.4 Starting WebVisit................................................................................................2-2
2.5 Enabling the WebVisit License........................................................................... 2-2
3 WebVisit ..................................................................................................................................3-1
3.1 Abbreviations Used ............................................................................................ 3-1
3.2 File Formats ....................................................................................................... 3-2
3.3 The WebVisit User Interface .............................................................................. 3-3
3.4 Menu Bar ........................................................................................................... 3-4
3.5 Toolbar for Graphic Icons...................................................................................3-6
3.5.1 Static Graphic Icons ........................................................................... 3-6
3.5.2 Dynamic Graphic Icons ...................................................................... 3-7
3.6 Properties Dialog Box ........................................................................................3-8
3.6.1 General ............................................................................................... 3-8
3.6.2 Repaints ............................................................................................. 3-9
3.6.3 Actions ..............................................................................................3-11
3.6.4 Border Advanced ..............................................................................3-12
3.6.5 Text Positions Advanced ..................................................................3-13
3.6.6 Bargraph Advanced .......................................................................... 3-13
3.6.7 Line Advanced .................................................................................. 3-14
3.6.8 On Condition ..................................................................................... 3-14
3.7 Group Properties Dialog Box ...........................................................................3-15
3.7.1 Advanced Select ............................................................................... 3-16
3.7.2 General ............................................................................................. 3-16
3.7.3 Cross Ref .......................................................................................... 3-17
7361_en_01 PHOENIX CONTACT i

WebVisit
4 Visualization With WebVisit .....................................................................................................4-1

4.1 PC WorX and WebVisit ...................................................................................... 4-1
4.2 Creating a New Project ...................................................................................... 4-1
4.3 Configuring a Project.......................................................................................... 4-2
4.4 Generating a Graphic View ................................................................................4-3
4.5 Inserting Graphic Visualization Objects.............................................................. 4-3
4.5.1 Graphic Icons for Visualization ........................................................... 4-4
4.5.2 Static Text for the Start, OUT3, Output V0 Headings ......................... 4-6
4.5.3 Static Text for Color Display of Start Variables .................................. 4-7
4.5.4 Rectangle as Background for Traffic Light .........................................4-8
4.5.5 Ellipses as Traffic Light .......................................................................4-9
4.5.6 Static Text for Displaying the Value of the V0 Variable .................... 4-10
4.5.7 Edit Box for the Manual Variable ...................................................... 4-11
4.5.8 Button for Toggling the Status of the Manual Variable ..................... 4-12
4.5.9 Static Text for Displaying the Value of the
Number_of_Toggles Container Variable .......................................... 4-14
4.5.10 Bargraph for V0 ................................................................................4-15
4.6 Generating a Second Graphic View ................................................................. 4-17
4.7 Inserting Graphic Visualization Objects............................................................ 4-17
4.8 Navigating Between Graphic Views ................................................................. 4-18
4.9 Saving Graphic Views ......................................................................................4-21
4.10 Generating an HTML Page ..............................................................................4-21
4.11 Initial Test in the Browser .................................................................................4-21
4.12 Specifying the Value Range for Edit Box ......................................................... 4-21
4.13 Initializing Container Variables ......................................................................... 4-23
4.14 Data Transmission to the Control System........................................................ 4-24
4.15 Display in Internet Browser ..............................................................................4-26
4.16 Changes to the Project..................................................................................... 4-27
4.17 HMI With Several Graphic Views .....................................................................4-27
A Appendix: Example Project in PC WorX................................................................................. A-1

A1 Description of the Project ................................................................................. A-1
A2 Developing a Project in PC WorX .................................................................... A-3
A 2.1 Building the Hardware Structure ........................................................ A-3
A 2.2 Creating the Program ........................................................................ A-4
A 2.3 Assigning Process Data .................................................................... A-9
A 2.4 Operation ........................................................................................... A-9
ii PHOENIX CONTACT 7361_en_01

General
1 General
1.1 Introduction
WebVisit is a software program used to generate websites. The software runtime

component is a web server, which is stored on the control system. The variable values are
actually visualized via a Java-compatible standard browser.
1.2 Information About This Manual
This document uses an example project to help you to get started with visualizing the
variables you have created in PC WorX. The example project created in the Quick Start
Guide for PC WorX is used. It is briefly described in "Appendix: Example Project in
PC WorX" on page A-1.
It is assumed the user has knowledge and experience in the operation of PCs and
Windows operating systems.
More detailed information about the individual functions of the WebVisit can be found in
the online help for the program. The help function can be called via "Help" in the menu
bar.
1.3 System Requirements
1.3.1 Supported Operating Systems
Windows 2000
Windows XP (recommended)
7361_en_01 PHOENIX CONTACT 1-1

WebVisit
1.3.2 Hardware Requirements
Hardware Requirements for WebVisit

CPU Pentium III 800 MHz
Main memory 128 MB, minimum
Hard disk space 100 MB free, minimum
CD-ROM drive Yes
Ethernet interface Yes
Monitor SVGA minimum, recommended resolution of 1024 x 768
Operating devices Keyboard, mouse
Web browser Java Standard Edition SE 6 (or higher) with at least Java
Runtime Environment JRE 6 (version 1.6.x or higher)
1.4 Supported Control Systems
You can use WebVisit to visualize projects running on the following control systems:
Control System Firmware Version

ILC 150 ETH 2.00
ILC 3xx PN ... 1.41
ILC 3xx ETH ... 1.20
CP 3xx 1.41
FC 350 PCI ... 1.41
1.5 Ordering Data
Products
Description Type Order No. Pcs./Pck.
Tool for creating websites for Phoenix Contact control systems WEBVISIT BASIC 2985990 1
Documentation
Description Type Order No. Pcs./Pck.
Quick Start Guide "PC WorX" UM QS EN PC WORX 2699862 1
1-2 PHOENIX CONTACT 7361_en_01

Installing and Enabling the Software
2 Installing and Enabling the Software
2.1 Prior to Installation
Prior to installation, close all open Windows applications.
2.2 AUTOMATIONWORX Software Suite
WebVisit is part of the AUTOMATIONWORX Software Suite.

The following programs belong to the AUTOMATIONWORX Software Suite:
Config+
Simple configuration and commissioning of INTERBUS networks
Diag+
User-friendly network diagnostics during commissioning and operation
Diag+ NetScan
User-friendly monitoring of multiple INTERBUS networks
PC WorX
Uniform IEC-61131 programming environment for all PHOENIX CONTACT control
systems
AX OPC Server
Software for exchanging data between distributed INTERBUS networks and
visualization systems
WebVisit
Tool for creating websites for PHOENIX CONTACT control systems
You can select the required programs individually or simultaneously for installation.
As you can use WebVisit to visualize variables from PC WorX, you should install these
two programs as a minimum.
You only need to select Diag+ if you want to use it independently of PC WorX. When
PC WorX is installed, Diag+ is installed as part of PC WorX.
When one of the programs in the Software Suite is started for the first time, it runs in demo
mode with limited resources. A registration code is required to enable the full version. You
will receive the registration code when a full version of the relevant program is purchased.

WebVisit
2.3 Starting the Installation Program
Usually, the installation program will start automatically a few seconds after you place the
CD-ROM in the CD drive.
If it does not, start the "SETUP.EXE" file from the "[Drive]:\SETUP\" directory on the
CD-ROM. This file calls the installation wizard, which guides you through the
installation process.
Follow the installation program instructions.
The installation program will generate all the directories necessary for operation and will
copy the files for the programs you have selected.
Following successful installation, restart your PC to apply the changes to the
configuration files. To do this, click "Finish" at the end of the installation process.
2.4 Starting WebVisit
For installation using the default settings, start WebVisit via

"Start/Programs/Phoenix Contact/AUTOMATIONWORX Software Suite .../WebVisit".
When started for the first time, WebVisit runs in demo mode.
If you wish to switch from demo mode to the full version, enable your WebVisit license.
2.5 Enabling the WebVisit License
Enable your license in the AUTOMATIONWORX Software Suite License Manager.

For installation using the default settings, start the License Manager via
"Start/Programs/Phoenix Contact/License Manager".
Select "WebVisit" as the version.
Enter your registration code.
Confirm your entry with "Apply Settings".
Close the License Manager.
Registration will come into effect when WebVisit is started again.

WebVisit
3 WebVisit
3.1 Abbreviations Used
HMI Human Machine Interface, e.g., a WebVisit graphic view displayed on a touch panel or in
a PC browser.
*.prj File extension for WebVisit projects created using the WebVisit editor. A WebVisit project
contains all information required in order to create an HMI on a touch panel or in a browser.
Graphic view A WebVisit graphic view is comprised of WebVisit graphic icons and represents the HMI.
A graphic view of this type is stored in a *.teq file.
*.teq File extension of a WebVisit graphic view generated by the WebVisit editor.
Graphic icon A graphic icon is a visualization object used by the WebVisit editor to draw graphic views.
These objects are programmed in Java. The objects of a graphic view are saved on the
target system in a Java applet.
Java applet (applet) Small program written in Java programming language that is loaded from a server (in this
case a control system) and interpreted and executed in a user browser that has Java
capability.
PDP (PPO) Process Data Point. A PDP is any application-software variable that is to be made visible
and/or enabled for operation in a WebVisit graphic view. The designation PPO is used as
a data type in WebVisit.
Container A container is a local variable within the WebVisit editor. A variable of the CONTAINER
type is used to exchange data between the graphic icons of one or more graphic views.

WebVisit
3.2 File Formats
All the file formats required to generate an HMI based on WebVisit are listed below.
The browser addresses an html page as follows:
http://<target system ip address>/<project>.html. This file is generated by WebVisit
("Project... Generate HTML..." menu). The file contains a reference to a Java applet that is
responsible for visualization. If the project's html page is called entry.html, its file name
does not need to be entered. In this case, only the IP address of the target system needs
to be entered for addressing purposes.
Other references point to *.teq files, which are generated by the WebVisit editor for every
graphic view and determine the layout of those graphic views. All Java classes are saved
in a Java archive called IMaster.jar.
The following files must be saved in the target system in order to obtain a visualization
based on an embedded web server:
The homepage of "<project>.html"
The Java class library "IMaster.jar"
All graphic views (*.teq)
All additional user-specific HTML files (help pages, for example)
All view files that are used
The variable initialization files "<project>.tcr" and "<project>.itq"
Please note that for web pages created by users, paths are not used as references, as
subdirectories are not supported.

WebVisit
3.3 The WebVisit User Interface
The user interface appears when WebVisit is started. The main window is divided into two
sections. All open project files are displayed on the left-hand side. On the right-hand side,
the graphic views for the open project are displayed and can be edited.
Menu bar
Toolbar for
graphic icons
Project files
Graphic views
Toolbar
Status bar
Figure 3-1 User interface

WebVisit
3.4 Menu Bar
Standard menu commands are not described here.
File
New Project... Creates a new HMI project.
Open Project... Opens an existing HMI project.
Close Project Closes the active HMI project.
Save All Saves the active HMI project.
Project
Add To Project Adds a graphic view or file to the project.
New Creates a new graphic view.
File Adds a file to the project.
Remove From Project... Removes a file from the project.
Remove/Delete From Project... Removes a file from the project.
Project Configurations... Configures the project's basic settings. Changes to the settings can
only be made by means of new graphic views.
Teq Configurations Default settings for new graphic views
Width Standard width of a graphic view in pixels
Height Standard height of a graphic view in pixels
Background Color Standard background color
Foreground Color Standard font/outline color
Font Standard font type for graphic icons
Background Teq Defines a graphic view as the background view for new graphic
views.
applet params Parameters for the Java applet
period Update rate for the process data points in ms
Main teq Start screen when the HMI is loaded
Debug When debug mode is activated, you can use advanced debug
information. You must have a Java Console installed to take
advantage of this feature, which is called in the Internet Explorer, for
example, via "Tools... Sun Java Console".
Message Box When the message box is activated, error messages are displayed.
HTML Parameters in csv Currently not supported.
File
Order Per View Updates process data points for each view
(see also "Applet params" on page 4-2).
Teq archive Do not use, not supported in later versions.
Encode Special Chars When activated (recommended), special characters in the
PPO name are processed correctly.

WebVisit
Phoenix PC WORX Project Project settings for connecting to PC WorX (see also
Settings "Phoenix PC WORX Project Settings" on page 4-3).
*.mwt path Path to PC WorX project
PDD.CSV Path Path to the file with variables from PC WorX for WebVisit
Grid Configurations... Configures the auxiliary grid. When the grid is activated, only new or
selected graphic icons are snapped to the grid.
Grid Visible Switches the grid on/off.
Grid Snap Snaps the icons to the grid.
X Horizontal grid spacing
Y Vertical grid spacing
Grid Color Color of the grid
Init Containers... Initializes variables of the CONTAINER type.
Init PPOs... Initializes variables of the PPO type.
Generate HTML... Generates the homepage of the HTML file, which contains the
WebVisit applet.
Download Project... Downloads the project to the target system.
Library Currently not supported.
Layout
Align Aligns the selected graphic icons. At least two graphic icons must be
selected in order for these functions to work.
Left Aligns the graphic icons to the left edge.
Right Aligns the graphic icons to the right edge.
Top Aligns the graphic icons to the top edge.
Bottom Aligns the graphic icons to the bottom edge.
Center Centers the graphic icons in the graphic view.
Horizontally Centers the graphic icons horizontally.
Vertically Centers the graphic icons vertically.
Make Same Size Makes the graphic icons the same size. At least two graphic icons
must be selected in order for these functions to work.
Width Makes the widths of the graphic icons the same.
Height Makes the heights of the graphic icons the same.
Both Makes the heights and widths of the graphic icons the same.
Order Sets the order of the graphic icons.
To Back Moves the graphic icon back one level.
To Front Moves the graphic icon forward one level.
Group Groups/separates graphic icons.
Group Groups the selected graphic icons.
UnGroup Ungroups a selected group.
Edit Polygon Points The points of the selected polygon can be edited.
Cross Ref... Displays cross-references.

WebVisit
3.5 Toolbar for Graphic Icons
Proceed as follows to select and configure a graphic icon:

Select the required icon from the graphic toolbar.
Hold the mouse button down and drag the graphic icon from the top left corner to the
bottom right corner.
Double-click the graphic icon to open the Properties dialog box and configure the
graphic icon (see also "Properties Dialog Box" on page 3-8).
All available graphic icons appear on the graphic toolbar.
Figure 3-2 Toolbar for graphic icons
Selection Selection of a graphic icon
3.5.1 Static Graphic Icons
Line, Rectangle, Ellipse, Line, rectangle, ellipse, polygon

Polygon
These icons are purely drawing elements. You can link the color properties to a process
data point or container in order to change the color. However, these graphic icons cannot
be used to display process data points or containers.
Figure 3-3 Line, rectangle, ellipse, polygon
Image Image
You can use this graphic icon to display an image that is linked to the icon as an external
file. The "GIF" file format is supported.
Figure 3-4 Image
You can also link two images, one of which is displayed dependent upon a condition.
The image is scaled according to the size of the graphic icon and, if the image has a
transparent background, the background color of the graphic icon will be visible.

WebVisit
3.5.2 Dynamic Graphic Icons
You can link dynamic graphic icons to a process data point or container. This provides a
means of displaying and modifying process data points or containers. You can configure
colors dependent upon a process data point or container.
Static text Static text

Text field for outputting a static text (as a STRING or HTML TAG) associated with a
process data point or a container variable.
Figure 3-5 Static text
Edit box Edit box

An edit box can be used to display and modify a process data point (PDP) or a container
variable.
Figure 3-6 Edit box
Button Button
A button can be used to set process data points, switch graphic views, call external web
pages, and toggle or increment variables.
Figure 3-7 Button
Bargraph Bargraph
A bargraph can be used to display a process data point or a container variable graphically
and dynamically. The value range of the bargraph can be parameterized.
Figure 3-8 Bargraph

WebVisit
3.6 Properties Dialog Box
You can configure the properties of graphic icons using the Properties dialog box.
Open the Properties dialog box for a graphic icon by double-clicking the icon.
The properties are grouped on several tabs. Each graphic icon has its own properties so
not all tabs of the Properties dialog box will always be available.
Figure 3-9 Possible tabs in the Properties dialog box (in this case for Button)
3.6.1 General
This tab is available for all graphic icons.
Figure 3-10 "General" tab
You specify general format properties on this tab. These include the position, size, interior
and outline color, line width and style, and font type.
The x-axis runs from left to right and the y-axis from top to bottom, so the zero point is
located in the top left corner.
The font types originate from the Java Virtual Machine. PC fonts cannot be used. Different
systems (browsers) may display fonts differently.

WebVisit
3.6.2 Repaints
Figure 3-11 "Repaints" tab
Edit a Source (2) The "Edit a Source" and "Edit a Source 2" properties are available for all graphic icons,
which can display an external data source, such as Static text (text field), Edit box, Image,
Bargraph or Button. This means that you can connect up to two external data items to a
graphic icon and, if required, include a link to a condition (On Condition).
When you activate the data source, a list appears from which you can specify the type and
name of the external data source.

WebVisit
The following types exist, although not all types are available for all graphic icons:
Table 3-1 Types for graphic icons
Type Meaning
FILE An image file of the *.gif type can be entered as the name.
PPO A graphic icon can be linked to a process data point (PDP). The PDP
can be entered in the "Name" field.
CONTAINER A graphic icon can be linked to a WebVisit internal variable. These
variables are only visible within the HMI and can be initialized using the
"Project... InitContainers..." menu command.
STRING A simple text string can be displayed.
HTML_TAG This function has not yet been implemented in this version of WebVisit.
If you select HTML_TAG as the type, it is interpreted internally as a
string.
Figure 3-12 Examples of types of graphic icon: Static text type
A connection must have been established with a corresponding PC WorX file in the
project configuration in order to select "PPO" as the type (see "Configuring a Project" on
page 4-2).
Hide Painter The "Hide / Disable Painter On Condition" (hidden if condition is true) and "Hidden Painter"
(hidden) properties are available for all icons. You can use these properties to show/hide
a graphic icon, linked to a condition if required.

WebVisit
3.6.3 Actions
This tab is only available for the Button graphic icon.
Figure 3-13 "Actions" tab
On this tab you set the action to be triggered when the mouse clicks a button.
Table 3-2 Actions for the Button graphic icon
Action Effect
Set Var on Mouse Left-clicking the button assigns the value of "Value" to a variable
DOWN (PPO or CONTAINER).
Set Var on Mouse Left-clicking the button assigns the value of "Value" to a variable
UP (PPO or CONTAINER) when the mouse button is released.
Toggle Button Depending on the status of the button, a variable is alternately set
to "1" or "0".
Increment Clicking the button increments a variable (PPO or CONTAINER)
by the value of "Value".
View Jump This allows you to switch to a different graphic view.
View Name Name of the graphic view, to which you want to switch
Back Button Clicking the button switches to the graphic view specified in "Actual
Page".
URL Jump This allows you to implement an HTML hyperlink to call an HTML
page of your choice.

WebVisit
3.6.4 Border Advanced
Figure 3-14 "Border Advanced" tab
On this tab you set the color properties dependent upon a variable (process data point or
container).
Three colors can be used to test a variable against a minimum and a maximum value. This
results in three cases, each of which can be assigned its own color. This applies to both
the interior color and the outline color.
You can use the "2 Colors on conditions" option to set whether you want to control two or
three colors dependent upon a variable. With two colors, a variable can be tested at 0 or 1
and a different color can be assigned to each case. This applies to both the interior color
and the outline color.
The interior color and the outline color can be shown or hidden, dependent upon a variable.

WebVisit
3.6.5 Text Positions Advanced
This tab is only available for the Static text or Button graphic icons.
Figure 3-15 "Text Positions Advanced" tab
On this tab you set the text alignment dependent upon a variable.
3.6.6 Bargraph Advanced
This tab is only available for the Bargraph graphic icon.
Figure 3-16 "Bargraph Advanced" tab
On this tab you can set the minimum, maximum, orientation, and scale of the bargraph.

WebVisit
3.6.7 Line Advanced
This tab is only available for the Line graphic icon.
Figure 3-17 "Line Advanced" tab
On this tab you specify whether the start and end of a line are to be marked with an arrow
or not.
3.6.8 On Condition
Certain properties of graphic icons can be linked to a condition, for example, the data
sources in the Properties dialog box under "Repaints" or the color change under "Border
Advanced".
The format of these conditions is always the same and is described below.
First, in the "Type" field, select the type of the variable on which the condition is to
depend. This can be the PPO (process data point) type or the CONTAINER
(HMI internal variable) type.
Enter the name of the variable in the "Name" field.
Select the comparison type in the "Select" field. The following options are available:
!= does not equal

< less than
<= less than or equal to
== equals
>= greater than or equal to
> greater than
Enter the value with which the variable is to be compared in the "Value" field.

WebVisit
3.7 Group Properties Dialog Box
Grouping can be used to change the properties of several graphic icons at the same time.
Select the required icons. To do this, draw a border around the graphic icons or left-
click them while holding down the shift key.
Figure 3-18 Grouping graphic icons
Select the "Group... Group" command from the "Layout" menu or click the icon in the
toolbar at the bottom of the screen.
Figure 3-19 "Layout... Group... Group" menu command
Figure 3-20 "Group Selected Objects" toolbar command
To dissolve a group, select it and then select the "Layout... Group... UnGroup" menu
command or click the icon in the toolbar at the bottom of the screen.
To change the general properties of a group, simply double-click the group and the Group
Properties dialog box will appear. You can open the dialog box by clicking the icon in the
toolbar at the bottom of the screen. The dialog box features the following tabs:

WebVisit
3.7.1 Advanced Select
Figure 3-21 "Advanced Select" tab
The graphic icons in the group are listed.

Double-click an entry to open that icon's Properties dialog box.
3.7.2 General
Figure 3-22 "General" tab
You can change the general format properties for all graphic icons in the group at the same
time on this tab.
You can specify whether each property is to be changed for all elements in the group or
not.

WebVisit
3.7.3 Cross Ref
Figure 3-23 "Cross Ref" window
All references associated with the graphic icons in the group are listed in this window.

WebVisit

Visualization With WebVisit
4 Visualization With WebVisit

This section describes how to visualize a current project. The example project from
"Appendix: Example Project in PC WorX" on page A-1 is used as a basis for this.
4.1 PC WorX and WebVisit
To visualize variables from a PC WorX project using WebVisit, the following requirements
must be met:
You have created a project on a controller with the appropriate firmware (see
"Supported Control Systems" on page 1-2).
The variables to be visualized have been created as global variables (VAR_GLOBAL
or VAR_EXTERNAL).
The "PDD" attribute is marked for the variable.
You make these settings when creating the variables (see also "Programming" on
page A-6).
4.2 Creating a New Project
Select the "New Project..." command from the "File" menu.

Give your project a name (in this case quickstart) in the dialog box that appears, and
save the project.
A *.prj project file and all other required files are then created and displayed in the "Project
Files" window.

WebVisit
4.3 Configuring a Project
Select the "Project... Project Configurations..." menu command.

Specify the basic settings for the project in the window that appears.
If these settings are changed during the course of the project, the new settings will only
be applied to new graphic views! Therefore, you must make the change for all existing
graphic views, if necessary.
Figure 4-1 Configuring a project
Teq Configurations Default settings for new graphic views (size, background and foreground color, text
settings, background file)
Select the size ("Width" and "Height"; in Figure 4-1 640 x 480 pixels) in accordance with
the size of your browser window.
Applet params Applet parameters

Period: Update period for the process data points:
Process data points are scanned and updated on the server periodically by default. You
set this period under "period".
Main teq (homepage): Start screen when the HMI is loaded

Order per view (update per view):

Every graphic view can contain several process data points. You have two options for
updating process data points:
Update all PDPs at once (checkbox not activated)
In order to perform the update efficiently, all PDPs associated with all graphic views
are scanned on the target system (control system) at the same time by default. This
uses fewer communication resources and speeds up the initialization of a new graphic
view, since all the required values are already known.
Update PDPs per graphic view (checkbox activated)
Alternatively, the "Order per view" (update per view) option can be activated. In this
case, only process data points required for the active graphic view are scanned on the
server. If there are a large number of PDPs to update, this can be the more efficient
method.
Phoenix PC WORX Project In this section of the dialog box, you specify where WebVisit gets its variables from. There
Settings are two options:
1. The PC WorX project is located on the same PC as WebVisit.
Use "Browse" to select the path to the PC WorX project file (*.mwt) in the "*.mwt path"
field.
If the PC WorX project has been installed and named as standard in accordance with
Section A, "Appendix: Example Project in PC WorX", you will find the file under
"C:\Programs\ PHOENIX CONTACT\Software Suite ...\Projects\qs_webvisit.mwt".
Entering this path updates the path for the pdd.csv file automatically.
2. The PC with WebVisit contains only one file with the required variables (pdd.csv)
generated using PC WorX.
Use "Browse" to select the path to the pdd.csv file in the "pdd.csv path" field.
4.4 Generating a Graphic View
To add an empty graphic view to the project, select the "Project... Add to Project...
New..." menu command.
The editor suggests a file name comprising the project name, a consecutive number and
the extension *.teq (in this case "quickstart1.teq").
Use the suggested file name or edit it and then confirm your entry with "Add".
4.5 Inserting Graphic Visualization Objects
You can now insert your graphic visualization objects. You can use the items on the toolbar
for graphic icons to do this (see "The WebVisit User Interface" on page 3-3).

WebVisit
4.5.1 Graphic Icons for Visualization
The following graphic objects are used for graphic view 1 in the example:
Table 4-1 Visualization elements used
No. in Element Visualized Dynamics Effect Example

Figure Variable in Section
4-2
1 Static text None Static text as a heading: Start 4.5.2
2 Static text Onboard_ Text and Changes the text and color 4.5.3
Input_Bit10 color Onboard_Input_Bit10 = False: Red with text "False"
Onboard_Input_Bit10 = True: Green with text "True"
3 Static text None Static text as a heading: OUT3 4.5.2
4 Rectangle None Background for traffic light 4.5.4
5 Ellipse OUT3 Color Changes the color 4.5.5
OUT3 = 0: Red; OUT3 = 1: Black
6 Ellipse OUT3 Color Changes the color 4.5.5
OUT3 = 0: Black; OUT3 = 1: Green
7 Static text None Static text as a heading: OUT1 4.5.2
8 Static text V0 Text The current value of the V0 variable is displayed. 4.5.6
9 Bargraph V0 Bargraph The height of the bargraph changes according to the 4.5.10
output value V0.
10 Button Jump If pressed: Switchover to another graphic view, which 4.8
shows an enlarged version of the bargraph.
11 Edit box Text and The current value of the Manual variable is displayed 4.5.7
color and can be changed.
The color changes too.
Manual = False: Dark red
Manual = True: Dark green
12 Button Toggle If pressed: 4.5.8
and Changes the status of the Manual variable
increment between 0 and 1.
Increments the Number_of_Toggles container
variable.
13 Static text Text The current value of the Number_of_Toggles 4.5.8
container variable is displayed.

Figure 4-2 Example graphic view

WebVisit
4.5.2 Static Text for the Start, OUT3, Output V0 Headings
Select a text field from the toolbar for graphic icons and place it in the graphic view.
Double-click the graphic icon to open the Properties dialog box.
Specify the general properties under "General".
Figure 4-3 General properties of the text field (in this case for "Start")
Specify what the icon is to display under "Repaints".
Figure 4-4 Display via the text field (in this case for "Start")
Table 4-2 Settings for all headings used in the example

Setting Start OUT3 Output V0
X 80 80 400
Y 50 150 50
W 100 100 200
H 50 50 50
Type STRING STRING STRING
Name Start OUT3 Output V0

4.5.3 Static Text for Color Display of Start Variables
Select a text field from the toolbar for graphic icons and place it in the graphic view.
Figure 4-5 General properties for the text field

Select two sources ("Edit a Source"), as different colors and texts are to be displayed
subject to the status of the Start variable.
Activate the "On Condition" checkbox.
Enter the type and name of the condition variable. Click the "Select" field adjacent to
the "Name" field. Select the name for the process data point (in this case
@GV.ONBOARD_INPUT_BIT10).
Select all other settings as shown in Figure 4-6.
Figure 4-6 Text field displays

WebVisit
4.5.4 Rectangle as Background for Traffic Light
Select the rectangle from the toolbar for graphic icons and place it in the graphic view.
Figure 4-7 General properties of the rectangle
Since the rectangle only acts as a background, no other settings are required.

4.5.5 Ellipses as Traffic Light
Select the ellipse from the toolbar for graphic icons and place two instances of it in the
graphic view.
Figure 4-8 General properties of the two ellipses
Settings do not have to be made under "Repaints".

Specify the color settings under "Border Advanced".
The comparison is selected here such that if OUT2 = 0, the top indicator is red and the
other is off. If OUT2 = 1, the bottom indicator is green and the top indicator is off.
Figure 4-9 Color settings for the two ellipses

WebVisit
4.5.6 Static Text for Displaying the Value of the V0 Variable
Select the text field from the toolbar for graphic icons and place it in the graphic view.
Figure 4-10 General properties of the text field

Check that the "Edit a Source" (data source) checkbox is activated and the "PPO" type
is selected in the "Type" selection box.
Click the "Select" field adjacent to the "Name" field. Select the name for the process
data point (in this case @GV.V0).
Figure 4-11 Text field displays for V0

4.5.7 Edit Box for the Manual Variable
Select the edit box from the toolbar for graphic icons and place it in the graphic view.
Figure 4-12 General properties of the edit box

Click the "Select" field adjacent to the "Name" field. Select the name for the process
data point (in this case @GV.Manual).
Figure 4-13 Manual edit box displays
Figure 4-14 Color settings for the edit box

WebVisit
4.5.8 Button for Toggling the Status of the Manual Variable
Select the button icon from the toolbar for graphic icons and place it in the graphic
view.
Figure 4-15 General properties of the button
Give the button a name under "Repaints" (in this case TOGGLE).
Figure 4-16 Button displays
Select the "Actions" tab.

In the "Toggle Button" section, activate the "Toggle" checkbox.
Select "PPO" as the type.
Select the name for the process data point under "Name"
(in this case @GV.Manual).
You have now specified that pressing the button switches the status between 0 and 1.
In the "Increment" section, activate the "Increment a variable" checkbox.

Select "CONTAINER" as the type.
Select or enter the variable name under "Name" (in this case Number_of_Toggles).
Enter the increment value under "Value" (in this case 1).

You have now created/selected a container variable that is used only within the
visualization. Its value increases by 1 every time the button is pressed.
Figure 4-17 Action executed by means of the button
Figure 4-18 Color settings
Provided that the Number_of_Toggles variable is less than or equal to 10, the button
remains green. If the variable is greater than 10, the button changes to yellow. The variable
can be reset in the visualization by refreshing the browser window.
Additional settings are not required.

WebVisit
4.5.9 Static Text for Displaying the Value of the

Number_of_Toggles Container Variable
Select the text field from the toolbar for graphic icons and place it in the graphic view.
Figure 4-19 General properties of the text field

Check if the "Edit a Source" (data source) checkbox is activated.
Select the "CONTAINER" type in the "Type" selection box.
Select the container variable (in this case Number_of_Toggles) in the "Name" field.
Figure 4-20 Text field displays for Number_of_Toggles
Specify the color settings under "Border Advanced". In this example, the same color
settings have been made as for the toggle button (see Figure 4-18).

4.5.10 Bargraph for V0
Select the bargraph from the toolbar for graphic icons and place it in the graphic view.
Figure 4-21 General properties of the bargraph

Activate the box with the three dots next to the "Name" field. Select the name for the
process data point (in this case @GV.ONBOARD_INPUT_BIT10).
Figure 4-22 Bargraph displays

WebVisit
Specify the settings under "Bargraph Advanced".
Figure 4-23 Bargraph settings

The limits here are set so that a level of 1 to <1024 is displayed in green. From 1024 to
2049, the level is displayed in red. The default color of red is displayed for values above
2049 (see Figure 4-24).
Figure 4-24 Bargraph color settings

4.6 Generating a Second Graphic View
A second graphic view is to be generated in which the bargraph for displaying V0 is shown
in a larger format.
Select the "Add to Project... New..." command from the "Project" menu.
Use the suggested file name or edit it and then confirm your entry with "Add".
4.7 Inserting Graphic Visualization Objects
You can now insert graphic visualization objects as described above. However, because
a magnified view is also to be displayed here, with other properties remaining the same,
you can also copy the bargraph from page 1 and only adapt the items of data, which need
to be modified. In this case, this only affects the size of the bargraph. The corresponding
procedure is described below.
Switch to the first graphic view. To do this, select the appropriate file (in this case
quickstart1.teq) under "Project Files" on the left-hand side of the screen.
Highlight the bargraph and copy it (Ctrl+C or "Edit... Copy").
Under "Project Files", switch to the file for the second graphic view (in this case
quickstart2.teq).
Insert the bargraph (Ctrl+V or "Edit... Paste").
Adapt the settings under "General".
Figure 4-25 General bargraph settings in the second graphic view
All other settings are retained.

WebVisit
4.8 Navigating Between Graphic Views
The "Button" graphic icon supports navigation between graphic views.

A button supports three navigation options:
Jump to a given page ("View Jump")
Jump to the last page selected ("Back Button")
Jump to a website via a hyperlink ("URL Jump")
You need one button in each graphic view to navigate between the two graphic views
generated.
Switch to the first graphic view. To do this, select the appropriate file (in this case
quickstart1.teq) under "Project Files" on the left-hand side of the screen.
Select the button icon from the toolbar for graphic icons and draw a button in the first
graphic view.
Figure 4-26 General properties of the button
Give the button a name under "Repaints" (in this case >> (for magnification)).
Figure 4-27 Button displays

Select the "Actions" tab. In the "Jump" section, activate the "View Jump" checkbox.
Select the name of your second graphic view from the list in the "view name" field.
Figure 4-28 Action executed by means of the button
Additional settings are not required.

The complete graphic view 1 is shown in Figure 4-29.
Figure 4-29 Graphic view 1

WebVisit
Copy the button from graphic view 1. This ensures that it will be located in the same
position in graphic view 2.
Under "Project Files", select the file for graphic view 2 (in this case quickstart2.teq) and
insert the button.
Enter the name of the button under "Repaints".
Figure 4-30 Adaptation under "Repaints" for the button in graphic view 2
Make the adaptations under "Actions". In this case the jump is back to the previous
page, not to any other specific page.
Figure 4-31 Adaptations under "Actions" for the button in graphic view 2
The complete graphic view 2 is shown in Figure 4-32.
Figure 4-32 Graphic view 2
You can now navigate between both graphic views.

4.9 Saving Graphic Views
Save the graphic views using "File... Save All".
4.10 Generating an HTML Page
Select the "Project... Generate HTML..." menu command.

Accept the suggested file name (in this case entry.html) or enter your own file name.
Save your project using the "File... Save All" menu command.
4.11 Initial Test in the Browser
Please note that the visualization is started only with the following setting in the Windows
control panel.
Start the Java control panel from the Windows control panel.
Select in the temporary files settings that temporary files are not stored.
Open the entry.html file for an initial test with a PC browser (e.g., MS Internet Explorer,
Netscape Navigator, Mozilla, Opera).
Test the function of the pages.
Process data points are not yet displayed. To display them, the container variables first
have to be initialized and the project transferred to the target system's web server.
4.12 Specifying the Value Range for Edit Box
If you are using edit boxes, you need to specify the value range for the entries.
Select the "Project... Init PPOs..." command.
All the variables used and their parameter settings are listed in the dialog box that appears.
Figure 4-33 "PPOs Initialization" window

WebVisit
"Min Val" and "Max Val"

The lower and upper limits for graphic icons of the "Edit box" type can be specified here.
"Format Val"
This parameter specifies the formatting of the screen output for a process data point. It can
accept "Int" or "String" values.
Unit Val
The unit for a process data point is specified here.
In the example, the field for displaying the Manual variable is an edit box. The values only
have to be specified for this process data point.
Enter the values given in Figure 4-34 in the dialog box.
Figure 4-34 Values for initializing PPOs
If you make an incorrect entry in the visualization edit box (undershooting or overshooting
the limits, incorrect formatting), WebVisit will display an input error.
Figure 4-35 Error message in the event of an edit box input error

4.13 Initializing Container Variables
Container variables are local variables that are only visible within one or more graphic
views. They are not related to the PC WorX project.
Once the variables have been created in a graphic object, they have to be initialized.
Select the "Project... Init Containers..." command.
All the local variables used and their initializations are listed in the dialog box that appears.
Figure 4-36 "Containers Initialization" window
Select your container variable and set the initial value.

Close the window with "OK".
A container initialization file called <project>.itq is then generated.

WebVisit
4.14 Data Transmission to the Control System
All files generated when the project was created and subsequently transferred to the target
system are displayed under "Project Files".
Figure 4-37 Project files for the example
If changes have been made to the project since the last time the HTML file was
generated, save the project ("File... Save All") and generate an HTML file ("Project...
Generate HTML").
Select the "Project... Download Project..." command.

Enter your control system's IP address in the dialog box that appears.
Figure 4-38 "FTP Download Project" window
Click the "Connect" button.

In the window that appears, click the "Download Project" button.
Figure 4-39 "FTP Download Project" window
Once the file has been transferred successfully, exit the window by clicking the "Exit"
button.

WebVisit
4.15 Display in Internet Browser
You can now open your project in an Internet browser. Internet Explorer is used in the
example below.
Please note that the visualization is started only with the following setting in the Windows
control panel.
Start the Java control panel from the Windows control panel.
Select in the temporary files settings that temporary files are not stored.
Enter your control system's IP address in the browser in the following format:
http://<control system ip address> (e.g., http://192.168.0.2).
If the project's html page is called entry.html, its file name does not need to be entered.
If you have selected a different file name, enter the following in the browser:
http://<control system ip address>/<project>.html.
Confirm the entry by clicking "Enter".

The result of the visualization is shown in Figure 4-40.
Figure 4-40 Visualization in Internet Explorer
Pressing the "TOGGLE" button toggles the Manual variable from the visualization. You can
also set the Manual variable directly by entering the value 0 or 1 in the edit box. All other
values are controlled automatically by the program running on the control system.

4.16 Changes to the Project
If you have added new variables to the PC WorX project after creating the WebVisit
project:
Open the "Project... Project Configurations..." menu.
Confirm the settings with "OK".
After each change in WebVisit:
Save the changes using "File... Save All".
Regenerate the HTML file via "Project... Generate HTML...".
Download the changed project to the control system via "Project... Download
Project...".
Refresh the display in the browser.
4.17 HMI With Several Graphic Views
There are two ways to generate an HMI with several graphic views. Either all the graphic
views are located in a Java applet or you are working with HTML links to the various views.
Several Graphic Views in a Java Applet

Users generally access a single HTML page via a browser. This is generated via the
"Project... Generate HTML..." menu command and is typically called
"<projectname>.html". This page references a Java applet, which contains the WebVisit
technology and is called "IMaster<target system>.jar" (e.g., IMasterPhoenix5_00_00.jar).
This applet references all graphic views (*.teq files) belonging to the HMI.
This is the fastest method, since all views and the applet are loaded when first accessed.
Several Graphic Views With HTML Links

It is also possible to reference HTML links on other pages from the "<projectname>.html"
homepage. The disadvantage is that these pages are only loaded when they are called,
which can lead to a delay in the display appearing.
This option can be beneficial in the following cases:
Links to help files (saved as HTML)
Links to HMIs on other web servers in order to form a joint HMI
Links to other applets or pages not generated using WebVisit

WebVisit

Appendix: Example Project in PC WorX
A Appendix: Example Project in PC WorX

This document describes an example project, whose variables are to be visualized in
WebVisit.
This Quick Start Guide assumes knowledge of PC WorX. Only basic project creation steps
are illustrated and reference is only made to essential points, which must be known in order
to be able to use WebVisit.
For more information about creating a project, please refer to the Quick Start Guide for
PC WorX.
A1 Description of the Project
In this document, an example project is developed using function block diagram (FBD).
In order to obtain the best possible results, please use the same identifiers and names
as used in this manual.
Project name qs_webvisit
Project hardware The example system is shown in Figure A-1.
7361_en_01 PHOENIX CONTACT A-1

WebVisit
ILC 350 PN FL SWITCH MCS 16TX

1 PLC
MRESET
RUN FL SWITCH MCS 16TX
1 3 5 7 9 11 13 15
PC
STP FAIL I1 I5 I9 Q1 E US 1 D Ord. No. 28 32 70 0
I2 I6 I10 Q2 UM 2
RUN / PROG I3 I7 I11 UL
ETH Q3
I4 I8 I12 Q4
10/100 DO2
MODE
PC WorX
LNK
ACT INLINE CONTROL
ILC 350 PN 11 22 11 22 11 22 11 22 11 22 11 22 2 4 6 8 10 12 14 16
100
Ord. No.: 2876928
MAC US1 US2 FAIL
WebVisit
1 11 11 11 11 11 1 Address 00.A0.45.1B.D2.1D
RESET
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16
X17 X18 X19
2 22 22 22 22 22 2 US1 GND US2 GND R1 R2 V.24 ACT 100 FD
xxxxxxx (Seriennr.)
PRG IL 3 33 33 33 33 33 3
RDY / RUN
BSA
4 44 44 44 44 44 4
FAIL
RF
5 55 55 55 5
6 66 66 66 6
IB IL 24 DO 2
ILB PN 24 DI16
FL IL 24 BK-PN-PAC DIO16-2TX
US D D
1 1
UM 2 2
3 3
RESET UL 4 4
DO4 DI4
100
1 2 1 2 1 2
FD
COL 1 1 1 1
XMT
2 2 2 2
RCV
LNK 3 33 3 3 3
10/100
4 44 4 4 4
7361A001
IB IL 24 DI 4-ME
IB IL 24 DO 4-ME
Figure A-1 Example system
Table A-1 Inputs and outputs used in the example including process data and assigned variables
Device Connected To Input/Output Signal At Variable Process

According to Data
the Device
Data Sheet
ILC 350 PN Input IN11 Co 3 TP 1.4 ONBOARD_ 3.1.4
INPUT_BIT10
ILB PN 24 DI16 DIO16-2TX Outputs OUT1 Co 1 to 4 V0 ~DO16
to OUT16 TP x.1 and x.4
Input IN21 Co 8 IN3 IN21
TP 2.1
IB IL 24 DO 4-ME FL IL 24 BK-PN-PAC Output OUT3 TP 1.4 OUT1 1.4
IB IL 24 DI 4-ME FL IL 24 BK-PN-PAC Input IN1 TP 1.1 IN2 1.1
IB IL 24 DO 2 ILC 350 PN Output OUT2 TP 2.1 OUT2 2.1
No assignment required T1
T2
Co Connector TP Terminal Point

The variables in bold type are to be visualized in WebVisit.
A-2 PHOENIX CONTACT 7361_en_01

Developing a Project in PC WorX
A2 Developing a Project in PC WorX
Perform the following steps in accordance with the Quick Start Guide for PC WorX.
A 2.1 Building the Hardware Structure
Create a new project with the control system (in this case
ILC 350 PN Version >01/4.6F/1.41) and save it with the name "qs_webvisit".
Adapt the project information as appropriate for your project and assign the "Domain
Postfix" (in this case qs.de).
Check/modify the IP settings for the controller (in this case 192.168.0.2).
If required, assign an IP address to the PROFINET IO controller.
Read in the PROFINET IO devices.
If required, assign the PROFINET device names and IP addresses.
Read in the INTERBUS.
In order to detect any errors, compile the project once the bus topology has been
completed.
The structure of the bus configuration is illustrated in Figure A-2.
Figure A-2 Bus structure for the example project

WebVisit
A 2.2 Creating the Program
A 2.2.1 Program Description

The program is created in function block diagram (FBD).
The program controls the following sequence:
On an edge change from FALSE to TRUE at input IN, a timer (TP function block)
generates a pulse, which is output at output Q for the duration PT. The associated output
is set for this time. The state of the output is indicated at the corresponding status LED.
The elapsed time is output at output ET.
If IN switches from FALSE to TRUE for a second time while the pulse is still active (within
PT), this does not affect the duration of the pulse generated at output Q. This signal is
ignored.
If a TRUE signal is present at output Q, the ROL function block is activated, which rotates
the operands associated with input parameter IN bit-by-bit to the left. This means that for
an initial value equal to 1, the associated outputs (e.g., OUT1 to OUT16 of a 16-bit module)
switch in succession from FALSE to TRUE and back again. This state change is indicated
by a "chasing light" at the corresponding status LEDs.
Once the pulse time has elapsed, the output that indicates the presence of the pulse and
the chasing light are switched off.
Independent of this, inputs IN1 and IN2 are logically ANDed. IN1 and IN2 map the status
of the inputs to which the toggle switches are connected. The result of ANDing is output at
output OUT.
Additional variable compared to the example program in the Quick Start Guide for
PC WorX:
The "Manual" variable is also used to facilitate editing in the program of entries made in
the visualization. The variable is ANDed with inputs IN1 and IN2. The result is output at
output OUT.
A 2.2.2 Function Blocks Used
Timer Format conversion Rotate to left ANDing

The variables in bold type in the tables below are to be visualized in WebVisit.

TP Timer Function Block
Table A-2 Timer TP_1

Parameter Variable Data Type Application Initial Value Description
Name
IN ONBOARD_ BOOL VAR_EXTERNAL Start: If a rising edge is detected, a
INPUT_BIT10 pulse is generated.
PT T1 TIME VAR T#15000ms Pulse time
setting: 15 seconds = 15,000 ms
Q OUT1 BOOL VAR_EXTERNAL Pulse output
TRUE if IN = TRUE and ET < PT;
FALSE if IN = FALSE or ET >= PT
ET T2 TIME VAR_EXTERNAL Elapsed time
BOOL_TO_DINT Format Conversion Function Block

To use the output signal of the TP_1 block as the input signal for the ROL block, the format
must be converted from BOOL to DINT.
Variables are not declared for this block.
ROL Rotation Function Block
Table A-3 Rotate to left ROL

Name
IN V0 WORD VAR_EXTERNAL Input value
N DINT Number of characters to be rotated
(in the example 0 or 1,
defined by OUT1)
(Output) V0 WORD VAR_EXTERNAL Output value ROL
AND ANDing Function Block
Table A-4 AND ANDing function block

Name
IN1 IN2 BOOL VAR_EXTERNAL Input value 1
IN2 IN3 BOOL VAR_EXTERNAL Input value 2
IN3 Manual BOOL VAR_EXTERNAL Manual input from the visualization
OUT OUT2 BOOL VAR_EXTERNAL AND output value

WebVisit
A 2.2.3 Programming
Programming of this example, excluding the Manual variable, is described in detail in the
Quick Start Guide for PC WorX. First, proceed in accordance with the example. Then insert
the Manual variable afterward.
When creating variables that are to be visualized in WebVisit, please note:
Create the variables as global variables (VAR_GLOBAL or VAR_EXTERNAL).
Activate the "PDD" checkbox.
Figure A-3 ONBOARD_INPUT_BIT10 variable properties
Figure A-4 V0 variable properties
In contrast to the description contained in the Quick Start Guide for PC WorX, in this case
the initial value was set to 1 as soon as the variables were created.

Figure A-5 OUT2 variable properties
You can check the setting under "Global Variables".
Figure A-6 Identification of variables for visualization in WebVisit
The complete program is shown in Figure A-7.
Figure A-7 Program without Manual variable

WebVisit
If it has not already been done when the V0 variable was created, set the initial value
for the V0 variable to 1.
Inserting the Additional Manual Variable:

Switch to the "IEC programming" workspace.
Select the "AND" function block.
Click the right mouse button to open the context menu for the function block.
Open the "Object Properties..." menu.
Select the IN2 formal parameter and click on "Duplicate".
You will thus obtain the IN3 formal parameter.
Double-click the new input on the function block and specify its properties.
Set the initial value to 1. Provided that no entries have been made in the visualization,
in this case OUT is only dependent on the positions of the two switches (variables IN2
and IN3).
Figure 0-1 Manual variable
Figure A-8 Complete program (including Manual variable)
In order to detect any errors, compile the project once the program has been created.

A 2.3 Assigning Process Data
Assign the process data in accordance with the Quick Start Guide for PC WorX.
The result of the process data assignment process is shown in Figure A-9.
Figure A-9 All used process data assigned to variables
Since the ONBOARD_INPUT_BIT10 variable is a system variable, it does not appear in

Figure A-9.
Compile the project, send it to the control system and perform a cold restart.
A 2.4 Operation
Change the task properties to "Cyclic" with an interval of 250 ms in accordance with
the Quick Start Guide for PC WorX.
Compile the project, send it to the control system and perform a cold restart.
Your program should now work. If you press the appropriate switch, the function will run.
You can also check the function in debug mode in accordance with the Quick Start Guide
for PC WorX.

WebVisit

Um Qs en Webvisit 7361 en 01

Transféré par

Informations du document

Copyright

Formats disponibles

Partager ce document

Partager ou intégrer le document

Options de partage

Avez-vous trouvé ce document utile ?

Ce contenu est-il inapproprié ?

Droits d'auteur :

Formats disponibles

Um Qs en Webvisit 7361 en 01

Transféré par

Droits d'auteur :

Formats disponibles

AUTOMATIONWORX

Order No.: 2910020

This user manual is valid for:

Designation Version Order No.

7361_en_01 PHOENIX CONTACT

Please Observe the Following Notes

User Group of This Manual

Explanation of Symbols Used

We Are Interested in Your Opinion

PHOENIX CONTACT GmbH & Co. KG

PHOENIX CONTACT 7361_en_01

General Terms and Conditions of Use for Technical Documentation

7361_en_01 PHOENIX CONTACT

Statement of Legal Authority

Make sure you always use the latest documentation.

A conversion table is available on the Internet at:

PHOENIX CONTACT 7361_en_01

2 Installing and Enabling the Software .......................................................................................2-1

7361_en_01 PHOENIX CONTACT i

4 Visualization With WebVisit .....................................................................................................4-1

A Appendix: Example Project in PC WorX................................................................................. A-1

ii PHOENIX CONTACT 7361_en_01

WebVisit is a software program used to generate websites. The software runtime

1.2 Information About This Manual

1.3 System Requirements

1.3.1 Supported Operating Systems

7361_en_01 PHOENIX CONTACT 1-1

1.3.2 Hardware Requirements

Hardware Requirements for WebVisit

1.4 Supported Control Systems

Control System Firmware Version

1.5 Ordering Data

1-2 PHOENIX CONTACT 7361_en_01

2 Installing and Enabling the Software

2.1 Prior to Installation

Prior to installation, close all open Windows applications.

2.2 AUTOMATIONWORX Software Suite

WebVisit is part of the AUTOMATIONWORX Software Suite.

7361_en_01 PHOENIX CONTACT 2-1

2.3 Starting the Installation Program

2.4 Starting WebVisit

For installation using the default settings, start WebVisit via

2.5 Enabling the WebVisit License

Enable your license in the AUTOMATIONWORX Software Suite License Manager.

2-2 PHOENIX CONTACT 7361_en_01

3.1 Abbreviations Used

7361_en_01 PHOENIX CONTACT 3-1

3.2 File Formats

3-2 PHOENIX CONTACT 7361_en_01

3.3 The WebVisit User Interface

Figure 3-1 User interface

7361_en_01 PHOENIX CONTACT 3-3

3.4 Menu Bar

Standard menu commands are not described here.

3-4 PHOENIX CONTACT 7361_en_01

Library Currently not supported.

7361_en_01 PHOENIX CONTACT 3-5

3.5 Toolbar for Graphic Icons

Proceed as follows to select and configure a graphic icon:

Figure 3-2 Toolbar for graphic icons

Selection Selection of a graphic icon

3.5.1 Static Graphic Icons

Line, Rectangle, Ellipse, Line, rectangle, ellipse, polygon

Figure 3-3 Line, rectangle, ellipse, polygon