Skip to Content

Wiki source code of 02 Cloud SCADA

Version 24.11 by Stone Wu on 2022/07/15 15:34
Show last authors
1 = **1 Introduction** =
2
3 The default page of the V-BOX web SCADA platform after login is shown as below. The main functions of this platform include the centralized monitoring, template management, project management, and authority management. The user could switch between the function modules through the left navigation bar, and the specific content of each function module will be displayed on the right side.
4
5 (% style="text-align:center" %)
6 [[image:1617874482390-379.png||height="421" width="800" class="img-thumbnail"]]
7
8 **Introduction**
9
10 1. **Centralized monitoring:** project list, that is displayed in groups;
11 1. **Template management**: add and edit templates;
12 1. **Authority management:** assign a project with configuration authority for view-account
13
14 = 2 Log in =
15
16 Click Cloud SCADA under service in the upper right corner, or enter [[http:~~/~~/web.v-box.net/>>http://web.v-box.net/]] on browser.
17
18 [[image:image-20220714150826-1.jpeg]]
19
20 The account of the V-box web SCADA platform is the same as the V-BOX account.
21
22 (% style="text-align:center" %)
23 [[image:1617874518342-186.png||height="357" width="200" class="img-thumbnail"]]
24
25 (((
26 = **3 Centralized monitoring** =
27 )))
28
29 Centralized monitoring is the default home page of the platform. As shown as the figure below.
30
31 (% style="text-align:center" %)
32 [[image:1617874482390-379.png||height="421" width="800" class="img-thumbnail"]]
33
34 This page displays projects under each group by switching groups. You could add, delete and modify the group. In addition, you ccoul add or remove projects from groups, browse projects, and configure project parameters.
35
36 == Group management ==
37
38 The centralized monitoring module classifies the project by group.
39
40 [[image:image-20220714151453-2.jpeg||height="394" width="795"]]
41
42
43 1. **Switch group:** Click group name to switch group.
44 1. **Add a group:** Click [[image:V-BOX cloud configuration user manual_html_b2953a9d44427091.png||height="33" width="35" class="img-thumbnail"]] to add a new group.
45 1. **Edit group:** Click [[image:V-BOX cloud configuration user manual_html_516339bb09efc553.png||height="32" width="35" class="img-thumbnail"]] to edit the group name.
46 1. **Delete group:** Click [[image:V-BOX cloud configuration user manual_html_c92089cb54d385cd.png||height="33" width="35" class="img-thumbnail"]] to delete the current group.
47 1. **More group:** Click [[image:V-BOX cloud configuration user manual_html_df266f0fa8d8536e.png||height="33" width="35" class="img-thumbnail"]] to display the previous or next group.
48
49 == New project ==
50
51 Click "New project" on the upper right corner to create a new project. You could input the project name, select a group and whether it is cross-box.
52
53 [[image:image-20220715094953-3.jpeg]]
54
55 Click "Thumbnail" to upload a thumbnai. It will be displayed as the preview image of the project.
56
57 [[image:image-20220715094733-2.jpeg]]
58
59 (% class="box infomessage" %)
60 (((
61 **✎Note: ** A project can upload no thumbnails or up to one thumbnail. When no thumbnail is uploaded, the project list will be displayed with the system default image
62 )))
63
64 == Manage project ==
65
66 The centralized monitoring module includes the following functions: add new projects, delete projects and preview projects for each group. Click on the corresponding group to display the list of projects in the group, as shown below.[[image:image-20220715100603-4.jpeg]]
67
68 **Manage project:** Click "manage project" to assign a project in the group.
69
70 **Delete project: **Click [[image:1617948891768-154.png||class="img-thumbnail"]] on the upper right corner of a project thumbnail in the project list to move the project out of the group.
71
72 **Preview project:** Click on [[image:1617948906340-294.png||class="img-thumbnail"]] to view the configuration screen of the project.
73
74 **Display mode: ** You could switch the display mode by clicking the icons on the upper right corner of page, shown as below.
75
76 (% style="text-align:center" %)
77 [[image:image-20220715101053-5.jpeg]]
78
79 == Browse project ==
80
81 Click on [[image:1617948906340-294.png||class="img-thumbnail"]] in the project list to view the configuration screen.
82
83 (% style="text-align:center" %)
84 [[image:V-BOX cloud configuration user manual_html_72b4c2044c0ab2fe.png||height="365" width="600" class="img-thumbnail"]]
85
86 **Real-time data: **Click the "Real-time Data" to view the device name and state, current value, encoding, description, etc.
87
88 **Alarm data: **Click the "Alarm data" button to pop up the alarm record page and view the current alarm status and historical alarm information.
89
90 **Historical data:** Click the "History Data" button to pop up the history report interface of the data. You could view all the historical data.
91
92 **Multi-language:** multi-language drop-down menu, one object could support three language at the same time, you could switch language by this menu.
93
94 [[image:image-20220715101731-6.jpeg||height="50" width="50" class="img-thumbnail"]] Open or close the alarm sound of the alarm record object.
95
96 [[image:image-20220715101736-7.jpeg||height="52" width="51" class="img-thumbnail"]] Full screen display or restore configuration screen.
97
98 [[image:image-20220715101741-8.jpeg||height="51" width="50" class="img-thumbnail"]] Hide or show the top blue menu bar.
99
100 [[image:image-20220715101747-9.jpeg||height="50" width="50" class="img-thumbnail"]] Zoom in the screen.
101
102 [[image:image-20220715101753-10.jpeg||height="51" width="50" class="img-thumbnail"]] Zoom out the screen.
103
104 == Project setting ==
105
106 [[image:image-20220715103031-11.jpeg]]
107
108 [[image:image-20220715104640-1.jpeg||height="34" width="41"]]**Configuration design:** Click  the button  to enter the configuration programmer to design the configuration screen for that project. Please refer to [[5 V-box WEB SCADA design>>||anchor="H6V-boxWEBSCADAdesign"]] for details.
109
110 [[image:image-20220715104711-2.jpeg||height="32" width="40"]]**Preview project:** Click the project preview image or click the button to browse the configuration screen of the project.
111
112 [[image:image-20220715104745-3.jpeg]]**Login-free browse: **Click the button and set the expiration time in the pop-up box to generate the browsing address and QR code (scan to browse, but not to operate).
113
114 [[image:image-20220715104944-7.jpeg]]**Copy project:** Click the button to set the name and group of the new project to add a new project.
115
116 [[image:image-20220715105016-8.jpeg]]**Export project:** Click the button to export the project.
117
118 [[image:image-20220715105102-9.jpeg]]**Edit project:** Click the button to modify the project (project name and whether or not to cross V-BOX option), upload and delete thumbnails.
119
120 [[image:image-20220715105139-10.jpeg]]**Delete project:** Click the button to delete the project.
121
122 [[image:image-20220715105152-11.jpeg||height="36" width="43"]]**Assigned to a group: **Click the button to assign the project to a group.
123
124 = 4 Template =
125
126 == Template management ==
127
128 Click the template management module on the left menu to enter the template management module.
129
130 (% style="text-align:center" %)
131 [[image:1617949183137-615.png||height="205" width="800" class="img-thumbnail"]]
132
133 The V-box Web SCADA platform provides a template management module that could save the designed configuration screen as a template and user could import the template to design the project more efficiently.
134
135 [[image:image-20220715105925-1.jpeg||height="46" width="45"]]**Add template: **Click the button to add a template as below.
136
137 [[image:image-20220715110054-4.jpeg]]
138
139 [[image:image-20220715105933-2.jpeg||height="37" width="45"]]**Edit template: **Click the button to edit the name and resolution of the template.
140
141 [[image:image-20220715105937-3.jpeg||height="42" width="42"]]**Delete template: **Click the button to delete the template.
142
143 == Template design ==
144
145 Click the "Template Design" in the template list to access the V-box configuration platform editor page. You could edit the template in this page. More details about how to design the project please refer to [[5 V-box WEB SCADA design>>||anchor="H6V-boxWEBSCADAdesign"]].
146
147 (% class="box infomessage" %)
148 (((
149 **✎Note: **
150
151 * Only templates of the same resolution can be imported into the configuration screen of the project;
152 * Template design only supports single screen design;
153 * Template screen does not support import and export, preview, compile, import other templates, and bind monitoring point functions.
154 )))
155
156 (((
157 = **5 Web SCADA design** =
158 )))
159
160 == Main screen ==
161
162 Click "Design" (or Template design) in "Project Management" (or Template Management) screen to access WEB SCADA editor.
163
164 (% style="text-align:center" %)
165 [[image:1617949467765-343.png||height="393" width="800" class="img-thumbnail"]]
166
167 The function partition of WEB SCADA editor.
168
169 (% style="text-align:center" %)
170 [[image:V-box 1.png||alt="V-BOX cloud configuration user manual_html_cb0c19aefec34494.png" height="315" width="600" class="img-thumbnail"]]
171
172 1. **Toolbar:** A function bar that provides pages operations and objects operations;
173 1. **Project Manager:** It shows all screens for project and operations.
174 1. **Objects Library: **It provides 8 basic shapes objects and 20 common objects for creating SCADA page;
175 1. **Design Area: **Design area for SCADA page and template;
176
177 == Design process ==
178
179 1. Create new screen and set the property;
180 1. Select the object and drag the mouse in design area;
181 1. Edit object property and set the variable etc;
182 1. Save the screen;
183
184 == Screen management ==
185
186 A project or template is composed of one or several screens. A template contains only one screen, whereas a project can be composed of one or more screens (only take project as an example.). All screens are listed on "Project Manager". Select screen name, its page would be displayed on "Design Area".
187
188 [[image:image-20220715113713-9.jpeg]]
189
190 The screens are divided into normal screens and sub-screens, as shown above.
191
192 * The normal screen will be displayed when viewing a project or template.
193 * Sub-screen is embedded in the pop-up box of the normal screen, and the function switch and other objects are used to click the popup display.
194
195 In the project browsing page, the default display is the top common screen in the screen list, i.e., the main screen in the figure above, and the other screens will be switched through screen jumping or linking, etc.
196
197 **Create screens**
198
199 Click [[image:image-20220715114850-12.jpeg||height="30" width="48"]] to create a new screen. Set the porperties in the pop-up box, select the screen type (normal screen and sub-screen) and save.
200
201 [[image:image-20220715114601-11.jpeg]]
202
203 (% class="box infomessage" %)
204 (((
205 **✎Note:** When a thumbnail page is not created, the default picture would be displayed on "Centralized Monitoring".
206 )))
207
208 **Modifying screen**
209
210 1. Select the page to be modified;
211 1. Click [[image:V-BOX cloud configuration user manual_html_a5f920d2d144472c.png||height="30" width="30" class="img-thumbnail"]] on "Project Manager" or [[image:V-BOX cloud configuration user manual_html_56ae321f2d4418ac.png||height="24" width="147" class="img-thumbnail"]] on "Toolbar";
212 1. Modify screen on [Design Area];
213 1. Click [[image:V-BOX cloud configuration user manual_html_5970eb09902bd1a3.png||height="30" width="30" class="img-thumbnail"]] on "Toolbar" to complete modification;
214
215 **Deleting screen**
216
217 1. Select screen on "Project Manager";
218 1. Click[[image:V-BOX cloud configuration user manual_html_dca942a0244f9912.png||height="29" width="30"]] , and following message would pop up to prevent accidental deletion;
219
220 (% style="text-align:center" %)
221 [[image:V-BOX cloud configuration user manual_html_1e7f9096426ebeca.png||height="161" width="300" class="img-thumbnail"]]
222
223 (% start="3" %)
224 1. Click "OK" to delete page.
225
226 **Sort screen**
227
228 1. Select page screen on "Project Manager";
229 1. Click [[image:V-BOX cloud configuration user manual_html_1ab5c888bfd536c.png||height="25" width="53"]] to sort screen upwards or downwards.
230
231 (% class="box infomessage" %)
232 (((
233 **✎Note:** Thumbnail does not support sorting.
234 )))
235
236 == Object ==
237
238 The Web SCADA platform provides a variety of visualizations for users to design screen. All objects listed on "Object Library“.
239
240 The screen is made up of objects.All the objects are provided in the object bar, and control points will appear around all the objects selected in the canvas.
241
242 Only the special attributes of the objects are listed for explanation, and the basic attributes of the objects, such as position, style, lock, etc., are not listed.
243
244 === Adding object ===
245
246 1. Select and click the object on ”Objects Library“;
247 1. Move the cursor to the "Design Area";
248 1. When cursor changes as + symbol, hold down left click draw the desired size;
249
250 The initial object is bound to V-BOX by default, and its monitoring point information list also displays V-BOX by default. After device switching, the device type of the last binding will be remembered. When the monitoring point information of the object is opened next time, it will be displayed according to the current type, and operations such as copying the object will also give the newly copied object the same binding type as the original object.
251
252 **Current object: **If you click a object, it will be in the selected state, that is, the current part.** **Control points with red background and black edge will appear around the current obejct.
253
254 **Selected object:** Click the blank space of the canvas, left-click the mouse to select an area, or hold down the Ctrl key and click the desired part. Objects with red or white dots around them are collectively referred to as selected parts.
255
256 [[image:image-20220715141718-1.jpeg]]
257
258 === Moving object ===
259
260 1. Select object on "Design Area";
261 1. Hold down the left click and move object to desired position.
262
263 (% style="text-align:center" %)
264 [[image:V-BOX cloud configuration user manual_html_4a7ca599f8cf89c5.png||height="141" width="200" class="img-thumbnail"]]
265
266 === Scaling object ===
267
268 1. Select object, the positioning control point would appear around object;
269 1. Click any control point;
270 1. Move point to scale object.
271
272 === Editing object ===
273
274 **Select device type**
275
276 Double-click the object to open property window, and click the button [[image:image-20220715144518-2.jpeg]] to select the device to be bound. One object can only bind one device type.
277
278 (% class="box infomessage" %)
279 (((
280 **✎Note:** If the SCADA project is selected as cross-box, then all the objects in the project can bind to V-BOX or ig series HMI.
281 )))
282
283 (% style="text-align:center" %)
284 [[image:V-BOX cloud configuration user manual_html_45a8e3cf3e1113fe.png||height="352" width="600" class="img-thumbnail"]]
285
286 If you choose V-BOX, the HMI of the current account will be filtered out in the multi-level grouping of the device selection drop-down box, and only the V-BOX bound to the current account will be displayed.
287
288 If you choose to bind an ig HMI, only the HMI bound by the current account will be displayed.
289
290 **Object state modification**
291
292 Double-click the object to open property window, modify the parameters, and save.
293
294 [[image:image-20220715150846-2.jpeg]]
295
296 **Object device modifcation**
297
298 * **Common object:** you have bound the monitoring point information belonging to the V-BOX at the monitoring monitoring point of the object. If you modify the monitoring point, there will be a reminder to confirm the switching device binding type. (If "Clear Original Configuration" is selected, then all the monitoring point information of the box bound to the object will be cleared, and switch the binding type of the object from V-BOX to HMI.
299 * **Time object: **Because HMI can't report the time, the monitoring equipment function of the time object can't be compatible with HMI. Therefore, when selecting the monitoring point of the monitoring device, there is only the option of V-BOX, and its multi-level grouping will only display the information of V-BOX. The display and hide function of this object can still bind HMI, but if the display and hide monitoring points are bound, the monitoring point binding to the monitoring device will be cleared.
300 * **Alarm record object:** Because the operation of binding monitoring point is different from other objects, no matter what the binding type before the object is, when switching between V-BOX and HMI, a switching reminder will be given. At the same time, when switching the binding device type at "display/conditional hide", the monitoring point information of the object binding will also be cleared, and the device type display will be switched.
301 * **Report object: **When you switchinW the device type of report binding at the monitoring point binding of the report, as shown in the figure; At the same time, if you switch the binding device type at "Show/Conditional Hide", the monitoring point information of the component binding will also be cleared, and the device type display here will be switched, as shown in Figure 5-14 below.
302
303 === 6.4.2 Introduction ===
304
305 **1)Basic**
306
307 (% style="text-align:center" %)
308 [[image:1617949894556-149.png||height="402" width="250" class="img-thumbnail"]]
309
310 Figure 6 ‑10
311
312 * **Line: **a common line, user could set color, line type and thickness for it;
313
314 * **Rectangles: **User could set transparency, Rounded Conner, color of filled and border, line type and thickness for it;
315
316 * **Circle:** User could set transparency, color of filled and border, line type and thickness for it.
317
318 * **Ellipse: **User could set transparency, color of filled and border, line type and thickness for it.
319
320 * **Triangle: **User could set transparency, color of filled and border, line type and thickness for it.
321
322 * **Text: **It is used for displaying text content. User could set text styles, background styles, also it supports three languages at the same time.
323
324 * **Picture: **It is used for displaying the picture, support the user defined picture.
325
326 (% class="table-bordered" %)
327 |=(% scope="row" %)**Property**|=**Description**
328 |=Gallery|Choose the picture from the gallery
329 |=Angle|Rotation angle (0~~360)
330 |=Scale|(((
331 Yes: the aspect ratio is fixed
332
333 No: the aspect ratio is not fixed
334 )))
335
336 **2)Common**
337
338 (% style="text-align:center" %)
339 [[image:V-BOX cloud configuration user manual_html_c84a5d0032df07e2.png||height="420" width="250" class="img-thumbnail"]]
340
341 * **Display Frame**
342
343 |**Item**|**Description**
344 |Monitoring Point|Set operating address for this object (Read and write can be different);
345 |Read-write permission|There are three modes for it, users could select according to requirements;
346 |Set Text|It is used for setting style of text and display direction
347 |Style|It is used for setting object display, like background color;
348 |Expansion|It is used for setting expansion function, like lock position;
349 |Display|It is used for setting object position and size
350
351 * **Bit /Word Indicator**
352
353 Indicator could monitor and display the specified PLC or HMI bit address, and its state changes according to the specified address value.
354
355 (((
356 |**Items**|**Description**
357 |Monitor Point|Set reading address for this object;
358 |Status|Set text for every status;
359 |Picture|Set picture for every status;
360 |Expansion|Set display expansion function, such as blink
361 |Display|Set object position and size
362 )))
363
364 * **Bit/ Word Switch**
365
366 Switch could operate the specified PLC or HMI bit address, and its state changes according to the specified address value.
367
368 (((
369 |**Items**|**Description**
370 |Monitor Point|Set operating address for this object (Read and write can be different);
371 |Read-write permission|There are three modes for it, users could select according to requirements;
372 |Pop up a confirmation box|Check it to enable confirmation box for operating;
373 |Status|Set text for every status;
374 |Picture|Set picture for every status;
375 |Expansion|Set display expansion function, such as blink
376 |Display|Set object position and size
377 )))
378
379 * **Dashboard**
380
381 Display the value of address in real time using the dashboard.
382
383 (((
384 |**Items**|**Description**
385 |Monitor Point|Set operating address for this object (Read and write can be different);
386 |Select|Set dashboard display range, there are two modes, Constant and Variable
387 |Scale value|Check it to display value;
388 |Select Language|Set text for object;
389 |Style|Set object display style such as color, scales number;
390 |Alarm Zone|Set range and color for alarm
391 |Display|Set object position and size
392 )))
393
394 * **Bar graph**
395
396 Use the length or height of the rectangle to reflect the value of reading address so that the value could be visualized.
397
398 (((
399 |**Items**|**Description**
400 |Monitor Point|Set operating address for this object (Read and write can be different);
401 |Digit Display|Check it to display digit value on bar;
402 |Progress bar direction|Select display direction;
403 |Scales|Set object scales display type and color;
404 |Bar color|Set color for bar;
405 |Background Display|Set color of bar background;
406 |Alarm Zone|Set range and color for alarm
407 |Display|Set object position and size
408 )))
409
410 * **Real-Time Trend Chart**
411
412 Use the curve to show the trend of the data over time. X-axis is time, Y-axis is variable.
413
414 (((
415 |**Items**|**Description**
416 |Monitor Point|Set operating address for this object (Read and write can be different);
417 |Digit Display|Check it to display digit value on bar;
418 |Progress bar direction|Select display direction;
419 |Scales|Set object scales display type and color;
420 |Bar color|Set color for bar;
421 |Background Display|Set color of bar background;
422 |Alarm Zone|Set range and color for alarm
423 |Display|Set object position and size
424 | |
425 )))
426
427 * **Flow pipe**
428
429 This is a flowing animation object, users could set animation trigger condition for it, the monitor point could be both bit address and word address;
430
431 (((
432 |**Items**|**Description**
433 |Border color|Set object background color;
434 |Color|Set flowing block color;
435 |Speed|Three modes for flowing block speed;
436 |Flow direction|Two modes for flowing direction;
437 |Monitor Point|Set trigger address;
438 |Trigger Condition|(((
439 Bit address: Select ON or OFF;
440
441 Word address: Set value range;
442 )))
443 |Color Block Width|Set flowing block size;
444 |Color Block Length|Set flowing block size;
445 |Color Block Spacing|Set the spacing between flow blocks;
446 |Display Border|Select display or hide border;
447 |Alarm Zone|Set range and color for alarm
448 |Display|Set object position and size
449 )))
450
451 **Tips for designing flow bar**
452
453 When user need to simulate the flow of water in a pipe, please put the pipe picture at first, then hide the flow border and place it onto the pipe picture.
454
455 * **Video object**
456
457 Video object is used for playing the video file provided in the video source.
458
459 (((
460 |**Items**|**Description**
461 |Border color|Set object background color;
462 |Color|Set flowing block color;
463 |Speed|Three modes for flowing block speed;
464 |Flow direction|Two modes for flowing direction;
465 |Monitor Point|Set trigger address;
466 |Trigger Condition|(((
467 Bit address: Select ON or OFF;
468
469 Word address: Set value range;
470 )))
471 |Color Block Width|Set flowing block size;
472 |Color Block Length|Set flowing block size;
473 |Color Block Spacing|Set the spacing between flow blocks;
474 |Display Border|Select display or hide border;
475 |Alarm Zone|Set range and color for alarm
476 |Display|Set object position and size
477 )))
478
479 * **Hyperlink**
480
481 The object for link website;
482
483 (((
484 |=**Items**|=**Description**
485 |Link address|Enter website;
486 |Open with|There are two options, user could select open with new window or current window;
487 |Select Language|One object could support three language, user could enter text for note object;
488 |Style|Set object display style such as color, use picture as background or not
489 |Display|Set object position and size
490 )))
491
492 * **Function Switch**
493
494 Function switch is designed to switch screens, and call and close sub screen.
495
496 (((
497 |=**Items**|=**Description**
498 |Screen|Select the target screen for switch;
499 |Sub-screen|There are two options, user could select open with new window or current window;
500 |Previous|Switch to the previous screen
501 |Next|Switch to the next screen
502 |Return|Return to the screen before switch
503 |Text|Set text for object, including text font, color direction and so on;
504 |Style|Set object display style such as color, use picture as background or not
505 |Display|Set object position and size
506 )))
507
508 * **Combination Switch**
509
510 The combination switch supports the collection of multiple functions onto one object. When the object is pressed, multiple functions are arranged in sequence to meet the special requirements of user.
511
512 (((
513 |=**Items**|=**Description**
514 |Bit operation|It provides [Bit copy], [Set ON], [Set OFF], [Switch] and [Bit Copy] functions.
515 |Word operation|It provides [Word copy], [Word set], [Increase] and [Decrease] functions,
516 |Arithmetic|[Add], [Subtract], [Multiply] and [Divide] functions
517 |Screen change|It provides screen switch function as [Function Switch], it supports [Previous], [Next], [Return], [Change to], and open, close sub-screen operations
518 |Delete|Delete selected item function;
519 |Empty|Delete all items in operation list;
520 |Up|Move the selected item up one row in operation list;
521 |Down|Move the selected item down one row in operation list;
522 )))
523
524 **Time**
525
526 It is used for displaying the time of the V-BOX, when the V-BOX is offline, the time will stay at the time when it is offline.
527
528 (((
529 |=**Items**|=**Description**
530 |Monitoring box|Link a box for the time part
531 |Pattern|Two types, one is digit and the other is clock
532 |Format settings|Set format for time and date in digit pattern
533 |Background|Set display or hide background of object
534 |Set text|Set text display style;
535 |Display|Set object position and size
536 )))
537
538 **Histogram**
539
540 It is used for display more than one tag value in Bar graph format.
541
542 (((
543 |=**Items**|=**Description**
544 |Add new group|Maximum is 8, add items for this object, also set colors
545 |Add monitoring point|Set read tag for every item,
546 |Style|Set object display style such as color, use picture as background or not
547 |Display|Set object position and size
548 )))
549
550 **Alarm record display**
551
552 It is used for display alarm information of V-BOX. It can support current and history alarm.
553
554 (((
555 |=**Items**|=**Description**
556 |Select box|Link to V-BOX
557 |Alarm type|Select current alarm or history alarm or all
558 |Start date|Alarm display start date
559 |End date|Alarm display end date
560 |Format|Set display format for date and time
561 |Sequence|It provides two type, one is order, and the other is reverse order
562 |Display content|Users could select display contents by check them
563 |Style|Set colors for different parts
564 |Display|Set object position and size
565 )))
566
567 **History trend chart**
568
569 The history trend will display data record with graph. X axis represents as time, and Y axis represents as data.
570
571 (((
572 |=(% colspan="2" %)**Items**|=**Description**
573 |(% colspan="2" %)Basic|Set numbers of curve in object and select style for every curves including color, link tag
574 |(% rowspan="11" %)Style|Display form|Two type, one is curve, and the other is table
575 |Start date|Start date of history data
576 |End date|End date of history data
577 |Format|Time and date format for display
578 |Sequence|Two types, order or reverse order
579 |Y range|Two types, fixed and adaptive
580 |Set text|Set font size, color and other styles.
581 |Transparency|Set transparency of object
582 |Background color|Two types, translucent or transparent
583 |Gradient way|Set display way and color
584 |Display bar|Check it to display screen bar
585 |(% colspan="2" %)Display|Set object position and size
586 )))
587
588 **Indirect screen display**
589
590 This object is used for calling screens when condition is met.
591
592 (((
593 |=(% colspan="2" %)**Items**|=**Description**
594 |(% rowspan="4" %)Basic|Conditional trigger|It provides bit, word condition and unconditional
595 |Bind monitoring point|Link to tag for triggering
596 |Trigger condition|for bit address, it requires ON or OFF, for word address, different value corresponds to different screens.
597 |Designated screen|Only for bit address as trigger. When condition is met, display this screen
598 |(% colspan="2" %)Style|Set object display style such as display title bar or display or hide background
599 |(% colspan="2" %)Display|Set object position and size
600 )))
601
602 **Ring chart**
603
604 Display value as ring chart
605
606 (((
607 |=(% colspan="2" %)**Items**|=**Description**
608 |(% rowspan="7" %)Basic|Monitor point|Link to tag for data reading
609 |Range|Set fixed range or variable range
610 |Scales|Set scales such as major and minor numbers, colors and so on
611 |Designated screen|Only for bit address as trigger. When condition is met, display this screen
612 |Numerical scale display|Check it to display scale
613 |Start angle|Set start angle for scale
614 |Color|Color setting for bar and background
615 |(% colspan="2" %)Alarm Zone|Set alarm range and colors
616 |(% colspan="2" %)Display|Set object position and size
617 )))
618
619 **Pie chart**
620
621 Display more than one value in one pie chart
622
623 (((
624 |=(% colspan="2" %)**Items**|=**Description**
625 |(% colspan="2" %)Monitor point|Add read addresses, the maximum is 8
626 |(% rowspan="3" %)Style|Pattern|Set alarm range and colors
627 |Numerical scale|Check it to display value in object
628 |Monitoring name display|Check it to display name in object
629 |(% colspan="2" %)Display|Set object position and size
630 )))
631
632 == **6.5 Tool bar** ==
633
634 The toolbar has the same function as the tool list. (right-click on the canvas to pop up tool list)
635
636 (((
637 |=**Tool**|=**Description**
638 |[[image:V-BOX cloud configuration user manual_html_668218d361cc54ba.png||height="21" width="76" class="img-thumbnail"]]|Mouse tool for selecting parts. Hold Ctrl key and click on the part to select multiple parts at the same time.
639 |[[image:V-BOX cloud configuration user manual_html_867a000ba1161424.png||height="21" width="69" class="img-thumbnail"]]|Save current canvas
640 |[[image:V-BOX cloud configuration user manual_html_f5dbf6b889320d6c.png||height="21" width="81" class="img-thumbnail"]]|Delete the selected parts. Multiple selected parts can be deleted at the same time.
641 |[[image:V-BOX cloud configuration user manual_html_e5d36271faf64986.png||height="21" width="73" class="img-thumbnail"]]|Copy the selected parts.
642 |[[image:V-BOX cloud configuration user manual_html_97033b77500d6b5e.png||height="21" width="75" class="img-thumbnail"]]|Paste the selected parts
643 |[[image:V-BOX cloud configuration user manual_html_53bc6f617b145720.png||height="22" width="148" class="img-thumbnail"]]|The property of the current screen
644 |[[image:V-BOX cloud configuration user manual_html_44a3e98a692aee6a.png||height="21" width="157" class="img-thumbnail"]]|Import the configured template for the current screen
645 |[[image:V-BOX cloud configuration user manual_html_30f2f1591b0a9e66.png||height="22" width="89" class="img-thumbnail"]]|Browse the current project interface. The default home page is the top screen in the project page list.
646 |[[image:V-BOX cloud configuration user manual_html_6aae3377add443ff.png||height="38" width="150" class="img-thumbnail"]]|Align left edge of multiple parts
647 |[[image:V-BOX cloud configuration user manual_html_dc8fb256a13e2f91.png||height="40" width="150" class="img-thumbnail"]]|Align right edge of multiple parts
648 |[[image:V-BOX cloud configuration user manual_html_bec295f2d25219f9.png||height="39" width="150" class="img-thumbnail"]]|Align top edge of multiple parts
649 |[[image:V-BOX cloud configuration user manual_html_4a0c10157943d534.png||height="39" width="150" class="img-thumbnail"]]|Align bottom edge of multiple parts
650 |[[image:V-BOX cloud configuration user manual_html_378cd8ba635ed3f4.png||height="38" width="150" class="img-thumbnail"]]|Place the selected part on top of the other parts
651 |[[image:V-BOX cloud configuration user manual_html_6a594344368f5276.png||height="38" width="150" class="img-thumbnail"]]|Place the selected part on the bottom of the other parts
652 )))
653
654 (((
655 = **7 Authority** =
656 )))
657
658 Click the Authority management on the left menu to enter the Authority management module, as Figure 7-1 shows.
659
660 [[image:1617949992819-138.png||class="img-thumbnail"]]
661
662 Figure 7 ‑11
663
664 This module is used for assigning project and configuring permissions for sub-accounts.
665
666 **1)How to assign project for sub-account**
667
668 * Click the button [[image:V-BOX cloud configuration user manual_html_d96aea12cdb7cdb1.png||height="26" width="150" class="img-thumbnail"]] at the end of the sub-account line to enter the project list page of the sub-account, as shown in Figure 7-2.
669 * Click the button [[image:V-BOX cloud configuration user manual_html_5fd249946ccb44cc.png||height="34" width="150" class="img-thumbnail"]] on the top right corner of window, select the project of the pop window and then click save to get the permissions of the selected project for the account, as shown in Figure 7-3.
670
671 (% style="text-align:center" %)
672 [[image:1617934946822-979.png||height="421" width="800" class="img-thumbnail"]]
673
674 Figure 7 ‑2
675
676 (% style="text-align:center" %)
677 [[image:1617950026178-538.png||height="375" width="600" class="img-thumbnail"]]
678
679 Figure 7 ‑3
680
681 **2)How to unassigned project for sub-account**
682
683 In the list of assigned projects in the sub-account, click “Unbind Project” to unbind the project for the account.
684
685 = **8 Demo account** =
686
687 **1)What is Cloud SCADA platform?**
688
689 Cloud SCADA is an IoT platform that can realize terminal equipment data collection, real-time control, alarm push, group management, configuration design and other functions. With this platform, users can monitor terminal equipment more conveniently.
690
691 **2)How to access?**
692
693 Asean URL: [[http:~~/~~/asean.v-box.net/web/htmlnew/user/login.html>>url:http://asean.v-box.net/web/htmlnew/user/login.html]]
694
695 Asean account&password: weconuser 123123
696
697 EU URL: [[http:~~/~~/eu.v-box.net/web/htmlnew/user/login.html>>url:http://eu.v-box.net/web/htmlnew/user/login.html]]
698
699 EU account&password: weconuser weconuser123
700 **✎Note1: **users can edit Cloud SCADA project freely, and the modified results will not be saved.
701
702 **✎Note2: **users can enter the Cloud SCADA page by clicking the following positions:
703
704 (% style="text-align:center" %)
705 [[image:1648577581177-590.png||height="408" width="800" class="img-thumbnail"]]
706
707 **3)Industry classification**
708
709 There are 20 Cloud SCADA projects created in demo account, including HVAC system, water treatment system, smart farm, smart factory and smart city.
710
711 (% style="text-align:center" %)
712 [[image:1648577644453-821.png||height="377" width="800" class="img-thumbnail"]]
713
714 **4)Part of the project introduction**
715
716 4.1 Heating Monitoring System
717
718 Collect the analog signals of the temperature, pressure and flow rate of the outlet water of the heat exchanger, and use PID to control the valve diameter of the heat exchanger and the rotation speed of the circulating pump to achieve the purpose of automatic temperature adjustment.
719
720 (% style="text-align:center" %)
721 [[image:1648577724164-599.png||height="393" width="800" class="img-thumbnail"]]
722
723 (% style="text-align:center" %)
724 [[image:1648577744837-247.png||height="450" width="800" class="img-thumbnail"]]
725
726 4.2 Water Treatment System
727
728 Industry introduction: water treatment system.Mainly to improve waterquality, to meet certain water quality standards, such as drinking water, industrial wastewater discharge.In order to ensure the stable operation of the water treatment system, it is necessary to monitor the water pressure and water level, and adjust the   appropriate water pressure and water level by remote control of the pumpspeed.
729
730 (% style="text-align:center" %)
731 [[image:1648577778435-311.png||height="450" width="800" class="img-thumbnail"]]
732
733 4.3 Smart City Monitoring
734
735 The multi-functional city monitoring system can be applied to multiple scenarios such as HVAC, factory, and pump station monitoring. Monitor and control common industrial parameters such as voltage, current, power, frequency, temperature, liquid level, etc.
736
737 (% style="text-align:center" %)
738 [[image:1648577825813-481.png||height="452" width="800" class="img-thumbnail"]]
739
740 (% style="text-align:center" %)
741 [[image:1648577843849-690.png||height="452" width="800" class="img-thumbnail"]]
742
743 4.4 Smart Building Monitoring
744
745 It is used in community management to monitor various facilities in the community such as elevator equipment, lighting system, parking lot, fire fighting equipment, etc. In the event of an abnormality in the equipment, such as elevator damage, insufficient fire water, etc., an alarm prompt is sent to the manager.
746
747 (% style="text-align:center" %)
748 [[image:1648577874801-932.png||height="408" width="800" class="img-thumbnail"]]
749
750 (% style="text-align:center" %)
751 [[image:1648577894932-957.png||height="408" width="800" class="img-thumbnail"]]