Beijer Electronics Nexto Xpress BCS-XP340 Manual de usuario

Quick Start Guide

Nexto Xpress Compact PLC

SUEN00396 –WebVisualization with HTML5

Nexto Xpress Compact PLC –Web Visualisation with HTML5

SUEN00396 2020-12

2 (18)

Normal.dotm, 2020-09-09

1Function and area of use

This document provides guidelines when working with Web Visualization and Nexto Xpress.

2About this Startup document

This Startup document should not be considered as a complete manual. It is an aid to be able to

Startup a normal application quickly and easily.

Use the following hardware, software, drivers and utilities in order to obtain a stable application:

In this document we have used following software and hardware

•BCS Tools 3.30

•Nexto Xpress BCS-XP340

For further information refer to

•Nexto Xpress CPU User”s manual (Click here to download)

•Beijer Electronics knowledge database, HelpOnline

This document and other Startup documents can be obtained from our homepage.

Please use the address [email protected] for feedback about our Quick Start

documents.

This documentation (below referred to as ‘the material’) is the property of Beijer Electronics. The holder or user has a non-

exclusive right to use the material.

The holder is not allowed to distribute the material to anyone outside his/her organization except in cases where the material is

part of a system that is supplied by the holder to his/her customer.

The material may only be used with products or software supplied by Beijer Electronics.

Beijer Electronics assumes no responsibility for any defects in the material, or for any consequences that might arise from the use of

the material.

It is the responsibility of the holder to ensure that any systems, for whatever applications, which is based on or includes the

material (whether in its entirety or in parts), meets the expected properties or functional requirements.

Beijer Electronics has no obligation to supply the holder with updated versions.

Nexto Xpress Compact PLC –Web Visualisation with HTML5

SUEN00396 2020-12

3 (18)

Normal.dotm, 2020-09-09

3Table of Contents

1Function and area of use.........................................................................................2

2About this Startup document....................................................................................2

3Table of Contents..................................................................................................3

4Introduction ........................................................................................................4

Add Webvisu function to the project ....................................................................5

Add a visualization page...................................................................................7

Basic objects.................................................................................................8

Background templates ................................................................................... 13

Import external pictures ................................................................................ 14

Alarms ...................................................................................................... 15

Download .................................................................................................. 17

5About Beijer Electronics ....................................................................................... 18

Nexto Xpress Compact PLC –Web Visualisation with HTML5

SUEN00396 2020-12

4 (18)

Normal.dotm, 2020-09-09

4Introduction

Nexto Xpress model BCS-XP340 supports user-defined Web pages named “Web Visualization” created

by the WebVisu function in BCS Tools. This function allows you to implement HTML5 graphics directly

in the plc and browse to it using a HTML5 compatible browser . If there is a need for an industrial

terminal or terminal with marine approvals, the X2 Pro Web panels from Beijer Electronics covers these

requirements.

The web pages are designed in BCS Tools together with the plc application, this gives us a “one

development environment” solution. At download both logic and visualization is transfered to the plc.

This is a great solution for remote sites, installations without a need of permanent HMI or simply just a

way to get information without being present in front of the HMI.

One should take notice that the hardware resources a bit limited and if long term storage of data is needed,

thousands of tags etc this would not be a suitable solution.

Nexto Xpress Compact PLC –Web Visualisation with HTML5

SUEN00396 2020-12

5 (18)

Normal.dotm, 2020-09-09

Add Webvisu function to the project

Start BCS Tools and open the project where we will add the WbeVisu function.

The first step is to add the “Visualisation manager”. This object consists of generic

settings, shortcut keys, user definitions and more.

Right-click the “Application” , go to “Add object and the select the “Visualization

Manager” as shown in the screenshot.

Inside the “WebVisu” there are settings like the start page (html file), which by default is

“webvisu”

This is the page to use in the URL, http://192.168.15.1:8080/webvisu.htm

Nexto Xpress Compact PLC –Web Visualisation with HTML5

SUEN00396 2020-12

6 (18)

Normal.dotm, 2020-09-09

Start Visualization

Name of the visualization where the start is displayed as CODESYS WebVisu.

Name of the .htm file

Base URL of the web page. The URL is also specified as the address in the web browser.

Example: http://localhost:8080/webvisu.htm

Use as default page

The page specified in Name of .htm file is preset as the default page. Now this page will

always open when a user specified in the web browser the IP address and port of the web

server that is running on the controller: http://<IP address web server>:<port web

server>.

Example: http://localhost:8080

Update rate (ms)

Refresh rate (in milliseconds) in the web browser

Further details about the options can be read in the online help.

Nexto Xpress Compact PLC –Web Visualisation with HTML5

SUEN00396 2020-12

7 (18)

Normal.dotm, 2020-09-09

Add a visualization page

To create a new page right-click the Application select Add Object and Visualization. A

new empty page will be added to the project tree.

To start working with the components on the page the ToolBox provides you with the

available objects and functions. Chapter 4.3 contains information of the most basic

objects. For further details please refer to the online help in BCS Tools.

Nexto Xpress Compact PLC –Web Visualisation with HTML5

SUEN00396 2020-12

8 (18)

Normal.dotm, 2020-09-09

Basic objects

Label

The ”Label”object is used to visualize static texts, identify buttons, text fields, titles, etc. When

it is entered on the screen, the properties of the object will be displayed on the right side of the

editor. Here you can change properties such as text, font, size, color etc.

Rectangle, Round rectangle, Ellipse

These objects are used as drawing elements, but can also be used to visualize states using colors.

To change the color of an object, use the ”Toggle color”property associated with a Boolean

variable.

Nexto Xpress Compact PLC –Web Visualisation with HTML5

SUEN00396 2020-12

9 (18)

Normal.dotm, 2020-09-09

Lamp

Another object used to visualize a digital state is the ”Lamp”. The condition is linked to a

Boolean variable.

Button

The ”Button”object is used to generate events from operator input. Pressing ”Configure”

connects the desired events to the selected input.

Nexto Xpress Compact PLC –Web Visualisation with HTML5

SUEN00396 2020-12

10 (18)

Normal.dotm, 2020-09-09

Push Switch

Another object that can be used to control a digital variable is the ”Push Switch”object. A

Boolean variable is entered in the ”Variable”property. This will be set high as long as the

button is pressed and reset when the button is released.

Textfield

The ”Textfield”object is used to display and change text or values of variables. The variable is

selected in the ”Text Variable”property. The value can be changed in ”Inputconfiguration”in

the same way as for the ”Button”object.

Tabla de contenidos

Manuales populares de Hardware de computadora de otras marcas

EMC2

EMC2 VNX Series Manual del propietario

Panasonic

Panasonic DV0PM20105 Manual de usuario

Mitsubishi Electric

Mitsubishi Electric Q81BD-J61BT11 Manual de usuario

Gigabyte

Gigabyte B660M DS3H AX DDR4 Manual de usuario

Raidon

Raidon iT2300 Manual de usuario

National Instruments

National Instruments PXI-8186 Manual de usuario

Hauppauge

Hauppauge WinTV-HVR-2250 Manual de usuario

Kontron

Kontron CP6002 Manual de usuario

Manhattan

Manhattan 702843 Manual de usuario

Aphex

Aphex 230 Manual de usuario

AMD

AMD Phenom II Manual operacional

Intel

Intel NUC 12 Pro Manual de usuario

dbx

dbx Zone Pro 1260 Manual de usuario

Galaxy

Galaxy GHDX2-2430S-24F4D Manual de usuario

Intel

Intel AXXRMFBU4 Manual de usuario

Kontron

Kontron DIMM-PC/MD Manual de usuario

ST X-NUCLEO-SAFEA1B Instrucciones de funcionamiento

STEINWAY LYNGDORF

STEINWAY LYNGDORF SP-1 Manual de usuario