Skip to Content

Wiki source code of 02 Cloud SCADA

Version 4.1 by Leo on 2022/06/16 16:25
Show last authors
1 = 1 Instruction =
2
3 The default page of the V-BOX WEB SCADA platform after login is shown as Figure 1-1. The main functions of this platform includes 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 Figure 1 ‑1
9
10 **Introduction**
11
12 1. Centralized monitoring: project list, that is displayed in groups;
13 1. Template management: add and edit templates;
14 1. Project management: add and edit project;
15 1. Authority management: assign a project with configuration authority for view-account
16
17 **✎Note:**
18
19 Google Chrome is recommended.
20
21 (((
22 = 2 Sign in =
23 )))
24
25 **Steps:**
26
27 1) Click Cloud SCADA under service in the upper right corner, or enter [http:~/~/web.v-box.net/web/html/user/login.html] on browser.
28
29 (% style="text-align:center" %)
30 [[image:1617874518342-186.png||height="357" width="200" class="img-thumbnail"]]
31
32 Figure 2 ‑1
33
34 2)The account of the V-box WEB SCADA platform is the same as the V-BOX account.
35
36 **✎Note:**
37
38 Google Chrome is recommended.
39
40 (((
41 = 3 Centralized monitoring =
42 )))
43
44 Centralized monitoring is the default home page of the platform. As shown as Figure 3-1.
45
46 (% style="text-align:center" %)
47 [[image:1617874482390-379.png||height="421" width="800" class="img-thumbnail"]]
48
49 Figure 3 ‑1
50
51 This page shows projects under each group by switching groups. User could add, delete and modify the group.
52
53 == 3.1 Group management ==
54
55 The centralized monitoring module classifies the project by group. As shown in Figure 3-2.
56
57 (% style="text-align:center" %)
58 [[image:1617933161760-158.png||height="35" width="900" class="img-thumbnail"]]
59
60 Figure 3 ‑2
61
62 1. **Switch group:** Click group name to switch group.
63 1. **Add a group:** Click [[image:V-BOX cloud configuration user manual_html_b2953a9d44427091.png||height="29" width="30" class="img-thumbnail"]] to add a new group.
64 1. **Edit group:** Click [[image:V-BOX cloud configuration user manual_html_516339bb09efc553.png||height="28" width="30" class="img-thumbnail"]] to edit the group name.
65 1. **Delete group:** Click [[image:V-BOX cloud configuration user manual_html_c92089cb54d385cd.png||height="28" width="30" class="img-thumbnail"]] to delete the current group.
66 1. **More group:** Click [[image:V-BOX cloud configuration user manual_html_df266f0fa8d8536e.png||height="16" width="30" class="img-thumbnail"]] to display the previous or next group.
67
68 == 3.2 Assign project ==
69
70 The centralized monitoring module includes 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 in Figure 3-3.
71
72 (% style="text-align:center" %)
73 [[image:1617948660671-429.png||height="270" width="800" class="img-thumbnail"]]
74
75 Figure 3 ‑3
76
77 1. **Add project:** Click [[image:1617948869319-850.png||class="img-thumbnail"]] in the project list area to assign a project in the group.
78 1. **Delete project: **Click [[image:1617948891768-154.png||class="img-thumbnail"]] in the upper right corner of a project thumbnail in the project list to move the project out of the group.
79 1. **Preview project:** Click on [[image:1617948906340-294.png||class="img-thumbnail"]] to view the configuration screen of the project. For details, please refer to chapter 3.3.
80
81 == 3.3 Browse project ==
82
83 Click on [[image:1617948906340-294.png||class="img-thumbnail"]] in the project list to view the configuration screen. See Figure 3-4.
84
85 (% style="text-align:center" %)
86 [[image:V-BOX cloud configuration user manual_html_72b4c2044c0ab2fe.png||height="365" width="600" class="img-thumbnail"]]
87
88 Figure 3 ‑4
89
90 1. **Real-time data: **Click the [Real-time Data] to view the device name and state. Or view the current value, encoding, description, etc. of each data.
91 1. **Alarm data: **Click the [alarm data] button to pop up the alarm record page and view the current alarm status and historical alarm information.
92 1. **Historical data:** Click the [History Data] button to pop up the history report interface of the data. User could view all the historical data.
93 1. **Multi-language:** multi-language drop-down menu, one object could support three language at the same time, user could switch language by this menu.
94 1. [[image:V-BOX cloud configuration user manual_html_f89481c3d93517fb.png||height="26" width="28" class="img-thumbnail"]] : Zoom in screen
95 1. [[image:V-BOX cloud configuration user manual_html_4836056a73da4491.png||height="27" width="28" class="img-thumbnail"]] : Zoom out screen
96
97 = **4 Template management** =
98
99 == **4.1 Template management** ==
100
101 Click the template management module on the left menu to enter the template management module, as Figure 4-1 shows.
102
103 (% style="text-align:center" %)
104 [[image:1617949183137-615.png||height="205" width="800" class="img-thumbnail"]]
105
106 Figure 4 ‑1
107
108 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 .
109
110 == **4.2 Add, edit and delete template** ==
111
112 1. **Add template: **Click the [Add] to add a template, as Figure 4-2 shows.
113 1. **Edit template: **Click the [Edit] to edit the name and resolution of the template.
114 1. **Delete template: **Click the [Delete] to delete the template.
115
116 (% style="text-align:center" %)
117 [[image:1617933432286-367.png||height="347" width="600" class="img-thumbnail"]]
118
119 Figure 4 ‑2
120
121 == **4.3 Design template** ==
122
123 Click the [Template Design] in the template list to access the V-box configuration platform editor page. User could edit the template in this page. More details about how to design the project please refer to Chapter 6.
124
125 (((
126 = **5 Project management** =
127 )))
128
129 == **5.1 Project management** ==
130
131 Click the [Project management] on the left menu to enter the project list, as Figure 5-1 shows.
132
133 (% style="text-align:center" %)
134 [[image:1617949499753-859.png||height="401" width="800" class="img-thumbnail"]]
135
136 Figure 5 ‑1
137
138 == **5.2 Add, edit, delete and preview project** ==
139
140 1. **Add project:** Click the [Add] in the upper right corner of [Project Management] to add a project (Set project name and cross-box options).
141 1. **Edit project:** Click the [Edit] in a specific project line of the project list to modify the project (Set project name and cross-box options).
142 1. **Delete project:** Click the [Delete] to delete the corresponding project.
143 1. **Preview project: **Click the [Browse] to browse the project.
144
145 == **5.3 Login-free browse** ==
146
147 Click the [Login-free browse] in a specific project line of the project list to pop up window, set the expiration time, then user could get the browsing address and QR code (just need a scan to browse).
148
149 == **5.4 Project design** ==
150
151 Click the [Design] button in a specific project line of the project list to access the WEB SCADA editor. For more details please check Chapter 6.
152
153 (((
154 = **6 V-box WEB SCADA design** =
155 )))
156
157 == **6.1 Main screen and Menu** ==
158
159 Click [Design] (or Template design) in [Project Management] (or Template Management) screen to access WEB SCADA editor.
160
161 (% style="text-align:center" %)
162 [[image:1617949467765-343.png||height="393" width="800" class="img-thumbnail"]]
163
164 Figure 6 ‑1
165
166 The function partition of WEB SCADA editor is shown in Figure 6-2.
167
168 (% style="text-align:center" %)
169 [[image:V-box 1.png||alt="V-BOX cloud configuration user manual_html_cb0c19aefec34494.png" height="315" width="600" class="img-thumbnail"]]
170
171 Figure 6 ‑2
172
173 1. **Toolbar:** A function bar that provides pages operations and objects operations;
174 1. **Project Manager:** It shows all pages for project;
175 1. **Objects Library: **It provides 7 basic shapes objects and 13 common objects for creating SCADA page;
176 1. **Design Area: **Design area for SCADA page and template;
177
178 == **6.2 Operating procedures of design** ==
179
180 1. Create new page and set the property;
181 1. Select the object and drag the mouse in design area;
182 1. Edit object property and set the variable etc;
183 1. Save the screen;
184
185 == **6.3 Project Screen** ==
186
187 A project or template is composed of one or several screens. And all screens are listed on [Project Manager] as Figure 6-3 shows. Select screen name, its page would be displayed on [Design Area].
188
189 (% style="text-align:center" %)
190 [[image:1617949566099-340.png||height="705" width="250" class="img-thumbnail"]]
191
192 Figure 6 ‑3
193
194 Project Manager would display two kinds of screen. One is page screen, and the other is Thumbnail. A project or template could contain several screens, but only one thumbnail. Thumbnail is used for displayed project on [Centralized Monitoring] as Figure 6-4 shows.
195
196 (% style="text-align:center" %)
197 [[image:1617949620811-522.png||height="469" width="800" class="img-thumbnail"]]
198
199 (% style="text-align:center" %)
200 [[image:1617949663298-790.png||height="413" width="800" class="img-thumbnail"]]
201
202 Figure 6 ‑4
203
204 **Operating procedures of creating thumbnail**
205
206 1)Click [[image:V-BOX cloud configuration user manual_html_287ead7d4c995a28.png||height="30" width="30" class="img-thumbnail"]] on [Project Manager];
207
208 (% style="text-align:center" %)
209 [[image:1617949820581-164.png||height="386" width="500" class="img-thumbnail"]]
210
211 Figure 6 ‑14
212
213 2)Select [Page Type] as [Thumbnail] on screen attribute window;
214
215 3)Set background display and color according to real situation;
216
217 4)Click [Save] to complete operation;
218
219 **Operating procedures of creating page screen**
220
221 1)Click [[image:V-BOX cloud configuration user manual_html_287ead7d4c995a28.png||height="30" width="30" class="img-thumbnail"]] on [Project Manager];
222
223 (% style="text-align:center" %)
224 [[image:1617949844339-186.png||height="547" width="400" class="img-thumbnail"]]
225
226 Figure 6 ‑15
227
228 2)Fill in properties of screen;
229
230 3)Click [Save] to complete;
231
232 **✎Note:**
233
234 When a thumbnail page is not created, the default picture would be displayed on [Centralized Monitoring].
235
236 **Operating procedures of modifying screen**
237
238 1. Select the page to be modified;
239 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];
240 1. Modify screen on [Design Area];
241 1. Click [[image:V-BOX cloud configuration user manual_html_5970eb09902bd1a3.png||height="30" width="30" class="img-thumbnail"]] on [Toolbar] to complete modification;
242 1.
243
244 **Operating procedures of deleting screen**
245
246 1)Select screen on [Project Manager];
247
248 2)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;
249
250 (% style="text-align:center" %)
251 [[image:V-BOX cloud configuration user manual_html_1e7f9096426ebeca.png||height="161" width="300" class="img-thumbnail"]]
252
253 Figure 6 ‑16
254
255 3)Click [OK] to delete page;
256
257 **Operating procedures of sort screen**
258
259 1. Select page screen on [Project Manager];
260 1. Click [[image:V-BOX cloud configuration user manual_html_1ab5c888bfd536c.png||height="19" width="40"]] to sort screen upwards or downwards;
261
262 **✎Note:**
263
264 Thumbnail does not support sorting.
265
266 == **6.4 Object** ==
267
268 The WEB SCADA platform provides a variety of visualizations for users to design screen. All objects listed on [Object Library].
269
270 === **6.4.1 Basic Operations** ===
271
272 **Operating procedures of adding objects on screen**
273
274 1. Select and click the desired object on [Objects Library];
275 1. Move the cursor to the [Design Area];
276 1. When cursor changes as + symbol, hold down left click draw the desired size;
277
278 **Operating procedures of moving object**
279
280 1. Select object on [Design Area];
281 1. Hold down the left click and move object to desired position, as shown in Figure 6-8.
282
283 (% style="text-align:center" %)
284 [[image:V-BOX cloud configuration user manual_html_4a7ca599f8cf89c5.png||height="141" width="200" class="img-thumbnail"]]
285
286 Figure 6 ‑8
287
288 **Operating procedures of scaling object**
289
290 1)Select object, the positioning control point would appear around object;
291
292 2)Click any control point;
293
294 3)Move point to scale object;
295
296 **Operating procedure of editing object**
297
298 1)Select object;
299
300 2)Double-click it to open property window as Figure 6-9 shows;
301
302 (% style="text-align:center" %)
303 [[image:V-BOX cloud configuration user manual_html_45a8e3cf3e1113fe.png||height="352" width="600" class="img-thumbnail"]]
304
305 Figure 6 ‑18
306
307 3)Edit object settings;
308
309 4)Click [Save] to complete operation;
310
311 === **6.4.2 Introduction** ===
312
313 **1)Basic**
314
315 (% style="text-align:center" %)
316 [[image:1617949894556-149.png||height="402" width="250" class="img-thumbnail"]]
317
318 Figure 6 ‑10
319
320 * **Line: **a common line, user could set color, line type and thickness for it;
321
322 * **Rectangles: **User could set transparency, Rounded Conner, color of filled and border, line type and thickness for it;
323
324 * **Circle:** User could set transparency, color of filled and border, line type and thickness for it.
325
326 * **Ellipse: **User could set transparency, color of filled and border, line type and thickness for it.
327
328 * **Triangle: **User could set transparency, color of filled and border, line type and thickness for it.
329
330 * **Text: **It is used for displaying text content. User could set text styles, background styles, also it supports three languages at the same time.
331
332 * **Picture: **It is used for displaying the picture, support the user defined picture.
333
334 (% class="table-bordered" %)
335 |**Property**|**Description**
336 |Gallery|Choose the picture from the gallery
337 |Angle|Rotation angle (0~~360)
338 |Scale|(((
339 Yes: the aspect ratio is fixed
340
341 No: the aspect ratio is not fixed
342 )))
343
344 **2)Common**
345
346 (% style="text-align:center" %)
347 [[image:V-BOX cloud configuration user manual_html_c84a5d0032df07e2.png||height="420" width="250" class="img-thumbnail"]]
348
349 Figure 6 ‑11
350
351 * **Display Frame**
352
353 (% border="2" %)
354 |**Item**|**Description**
355 |Monitoring Point|Set operating address for this object (Read and write can be different);
356 |Read-write permission|There are three modes for it, users could select according to requirements;
357 |Set Text|It is used for setting style of text and display direction
358 |Style|It is used for setting object display, like background color;
359 |Expansion|It is used for setting expansion function, like lock position;
360 |Display|It is used for setting object position and size
361
362 * **Bit /Word Indicator**
363
364 Indicator could monitor and display the specified PLC or HMI bit address, and its state changes according to the specified address value.
365
366 (((
367 (% border="2" %)
368 |**Items**|**Description**
369 |Monitor Point|Set reading address for this object;
370 |Status|Set text for every status;
371 |Picture|Set picture for every status;
372 |Expansion|Set display expansion function, such as blink
373 |Display|Set object position and size
374 )))
375
376 * **Bit/ Word Switch**
377
378 Switch could operate the specified PLC or HMI bit address, and its state changes according to the specified address value.
379
380 (((
381 (% border="2" %)
382 |**Items**|**Description**
383 |Monitor Point|Set operating address for this object (Read and write can be different);
384 |Read-write permission|There are three modes for it, users could select according to requirements;
385 |Pop up a confirmation box|Check it to enable confirmation box for operating;
386 |Status|Set text for every status;
387 |Picture|Set picture for every status;
388 |Expansion|Set display expansion function, such as blink
389 |Display|Set object position and size
390 )))
391
392 * **Dashboard**
393
394 Display the value of address in real time using the dashboard.
395
396 (((
397 (% border="2" %)
398 |**Items**|**Description**
399 |Monitor Point|Set operating address for this object (Read and write can be different);
400 |Select|Set dashboard display range, there are two modes, Constant and Variable
401 |Scale value|Check it to display value;
402 |Select Language|Set text for object;
403 |Style|Set object display style such as color, scales number;
404 |Alarm Zone|Set range and color for alarm
405 |Display|Set object position and size
406 )))
407
408 * **Bar graph**
409
410 Use the length or height of the rectangle to reflect the value of reading address so that the value could be visualized.
411
412 (((
413 (% border="2" %)
414 |**Items**|**Description**
415 |Monitor Point|Set operating address for this object (Read and write can be different);
416 |Digit Display|Check it to display digit value on bar;
417 |Progress bar direction|Select display direction;
418 |Scales|Set object scales display type and color;
419 |Bar color|Set color for bar;
420 |Background Display|Set color of bar background;
421 |Alarm Zone|Set range and color for alarm
422 |Display|Set object position and size
423 )))
424
425 * **Real-Time Trend Chart**
426
427 Use the curve to show the trend of the data over time. X-axis is time, Y-axis is variable.
428
429 (((
430 (% border="2" %)
431 |**Items**|**Description**
432 |Monitor Point|Set operating address for this object (Read and write can be different);
433 |Digit Display|Check it to display digit value on bar;
434 |Progress bar direction|Select display direction;
435 |Scales|Set object scales display type and color;
436 |Bar color|Set color for bar;
437 |Background Display|Set color of bar background;
438 |Alarm Zone|Set range and color for alarm
439 |Display|Set object position and size
440 | |
441 )))
442
443 * **Flow pipe**
444
445 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;
446
447 (((
448 (% border="2" %)
449 |**Items**|**Description**
450 |Border color|Set object background color;
451 |Color|Set flowing block color;
452 |Speed|Three modes for flowing block speed;
453 |Flow direction|Two modes for flowing direction;
454 |Monitor Point|Set trigger address;
455 |Trigger Condition|(((
456 Bit address: Select ON or OFF;
457
458 Word address: Set value range;
459 )))
460
461 (% border="2" %)
462 |Color Block Width|Set flowing block size;
463 |Color Block Length|Set flowing block size;
464 |Color Block Spacing|Set the spacing between flow blocks;
465 |Display Border|Select display or hide border;
466 |Alarm Zone|Set range and color for alarm
467 |Display|Set object position and size
468 )))
469
470 **Tips for designing flow bar**
471
472 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.
473
474 * **Video object**
475
476 Video object is used for playing the video file provided in the video source.
477
478 (((
479 (% border="2" %)
480 |**Items**|**Description**
481 |Border color|Set object background color;
482 |Color|Set flowing block color;
483 |Speed|Three modes for flowing block speed;
484 |Flow direction|Two modes for flowing direction;
485 |Monitor Point|Set trigger address;
486 |Trigger Condition|(((
487 Bit address: Select ON or OFF;
488
489 Word address: Set value range;
490 )))
491
492 (% border="2" %)
493 |Color Block Width|Set flowing block size;
494 |Color Block Length|Set flowing block size;
495 |Color Block Spacing|Set the spacing between flow blocks;
496 |Display Border|Select display or hide border;
497 |Alarm Zone|Set range and color for alarm
498 |Display|Set object position and size
499 )))
500
501 * **Hyperlink**
502
503 The object for link website;
504
505 (((
506 (% border="2" %)
507 |**Items**|**Description**
508 |Link address|Enter website;
509 |Open with|There are two options, user could select open with new window or current window;
510 |Select Language|One object could support three language, user could enter text for note object;
511 |Style|Set object display style such as color, use picture as background or not
512 |Display|Set object position and size
513 )))
514
515 * **Function Switch**
516
517 Function switch is designed to switch screens, and call and close sub screen.
518
519 (((
520 (% border="2" %)
521 |**Items**|**Description**
522 |Screen|Select the target screen for switch;
523 |Sub-screen|There are two options, user could select open with new window or current window;
524 |Previous|Switch to the previous screen
525 |Next|Switch to the next screen
526 |Return|Return to the screen before switch
527 |Text|Set text for object, including text font, color direction and so on;
528 |Style|Set object display style such as color, use picture as background or not
529 |Display|Set object position and size
530 )))
531
532 * **Combination Switch**
533
534 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.
535
536 (((
537 (% border="2" %)
538 |**Items**|**Description**
539 |Bit operation|It provides [Bit copy], [Set ON], [Set OFF], [Switch] and [Bit Copy] functions.
540 |Word operation|It provides [Word copy], [Word set], [Increase] and [Decrease] functions,
541 |Arithmetic|[Add], [Subtract], [Multiply] and [Divide] functions
542 |Screen change|It provides screen switch function as [Function Switch], it supports [Previous], [Next], [Return], [Change to], and open, close sub-screen operations
543 |Delete|Delete selected item function;
544 |Empty|Delete all items in operation list;
545 |Up|Move the selected item up one row in operation list;
546 |Down|Move the selected item down one row in operation list;
547 )))
548
549 **Time**
550
551 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.
552
553 (((
554 (% border="2" %)
555 |**Items**|**Description**
556 |Monitoring box|Link a box for the time part
557 |Pattern|Two types, one is digit and the other is clock
558 |Format settings|Set format for time and date in digit pattern
559 |Background|Set display or hide background of object
560 |Set text|Set text display style;
561 |Display|Set object position and size
562 )))
563
564 **Histogram**
565
566 It is used for display more than one tag value in Bar graph format.
567
568 (((
569 (% border="2" %)
570 |**Items**|**Description**
571 |Add new group|Maximum is 8, add items for this object, also set colors
572 |Add monitoring point|Set read tag for every item,
573 |Style|Set object display style such as color, use picture as background or not
574 |Display|Set object position and size
575 )))
576
577 **Alarm record display**
578
579 It is used for display alarm information of V-BOX. It can support current and history alarm.
580
581 (((
582 (% border="2" %)
583 |**Items**|**Description**
584 |Select box|Link to V-BOX
585 |Alarm type|Select current alarm or history alarm or all
586 |Start date|Alarm display start date
587 |End date|Alarm display end date
588 |Format|Set display format for date and time
589 |Sequence|It provides two type, one is order, and the other is reverse order
590 |Display content|Users could select display contents by check them
591 |Style|Set colors for different parts
592 |Display|Set object position and size
593 )))
594
595 **History trend chart**
596
597 The history trend will display data record with graph. X axis represents as time, and Y axis represents as data.
598
599 (((
600 (% border="2" %)
601 |(% colspan="2" %)**Items**|**Description**
602 |(% colspan="2" %)Basic|Set numbers of curve in object and select style for every curves including color, link tag
603 |(% rowspan="11" %)Style|Display form|Two type, one is curve, and the other is table
604 |Start date|Start date of history data
605 |End date|End date of history data
606 |Format|Time and date format for display
607 |Sequence|Two types, order or reverse order
608 |Y range|Two types, fixed and adaptive
609 |Set text|Set font size, color and other styles.
610 |Transparency|Set transparency of object
611 |Background color|Two types, translucent or transparent
612 |Gradient way|Set display way and color
613 |Display bar|Check it to display screen bar
614 |(% colspan="2" %)Display|Set object position and size
615 )))
616
617 **Indirect screen display**
618
619 This object is used for calling screens when condition is met.
620
621 (((
622 (% border="2" %)
623 |(% colspan="2" %)**Items**|**Description**
624 |(% rowspan="4" %)Basic|Conditional trigger|It provides bit, word condition and unconditional
625 |Bind monitoring point|Link to tag for triggering
626 |Trigger condition|for bit address, it requires ON or OFF, for word address, different value corresponds to different screens.
627 |Designated screen|Only for bit address as trigger. When condition is met, display this screen
628 |(% colspan="2" %)Style|Set object display style such as display title bar or display or hide background
629 |(% colspan="2" %)Display|Set object position and size
630 )))
631
632 **Ring chart**
633
634 Display value as ring chart
635
636 (((
637 (% border="2" %)
638 |(% colspan="2" %)**Items**|**Description**
639 |(% rowspan="7" %)Basic|Monitor point|Link to tag for data reading
640 |Range|Set fixed range or variable range
641 |Scales|Set scales such as major and minor numbers, colors and so on
642 |Designated screen|Only for bit address as trigger. When condition is met, display this screen
643 |Numerical scale display|Check it to display scale
644 |Start angle|Set start angle for scale
645 |Color|Color setting for bar and background
646 |(% colspan="2" %)Alarm Zone|Set alarm range and colors
647 |(% colspan="2" %)Display|Set object position and size
648 )))
649
650 **Pie chart**
651
652 Display more than one value in one pie chart
653
654 (((
655 (% border="2" %)
656 |(% colspan="2" %)**Items**|**Description**
657 |(% colspan="2" %)Monitor point|Add read addresses, the maximum is 8
658 |(% rowspan="3" %)Style|Pattern|Set alarm range and colors
659 |Numerical scale|Check it to display value in object
660 |Monitoring name display|Check it to display name in object
661 |(% colspan="2" %)Display|Set object position and size
662 )))
663
664 == **6.5 Tool bar** ==
665
666 The toolbar has the same function as the tool list. (right-click on the canvas to pop up tool list)
667
668 (((
669 (% border="2" %)
670 |**Tool**|**Description**
671 |[[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.
672 |[[image:V-BOX cloud configuration user manual_html_867a000ba1161424.png||height="21" width="69" class="img-thumbnail"]]|Save current canvas
673 |[[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.
674 |[[image:V-BOX cloud configuration user manual_html_e5d36271faf64986.png||height="21" width="73" class="img-thumbnail"]]|Copy the selected parts.
675 |[[image:V-BOX cloud configuration user manual_html_97033b77500d6b5e.png||height="21" width="75" class="img-thumbnail"]]|Paste the selected parts
676 |[[image:V-BOX cloud configuration user manual_html_53bc6f617b145720.png||height="22" width="148" class="img-thumbnail"]]|The property of the current screen
677 |[[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
678 |[[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.
679 |[[image:V-BOX cloud configuration user manual_html_6aae3377add443ff.png||height="38" width="150" class="img-thumbnail"]]|Align left edge of multiple parts
680 |[[image:V-BOX cloud configuration user manual_html_dc8fb256a13e2f91.png||height="40" width="150" class="img-thumbnail"]]|Align right edge of multiple parts
681 |[[image:V-BOX cloud configuration user manual_html_bec295f2d25219f9.png||height="39" width="150" class="img-thumbnail"]]|Align top edge of multiple parts
682 |[[image:V-BOX cloud configuration user manual_html_4a0c10157943d534.png||height="39" width="150" class="img-thumbnail"]]|Align bottom edge of multiple parts
683 |[[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
684 |[[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
685 )))
686
687 (((
688 = **7 Authority management** =
689 )))
690
691 Click the Authority management on the left menu to enter the Authority management module, as Figure 7-1 shows.
692
693 [[image:1617949992819-138.png||class="img-thumbnail"]]
694
695 Figure 7 ‑11
696
697 This module is used for assigning project and configuring permissions for sub-accounts.
698
699 **1)How to assign project for sub-account**
700
701 * 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.
702 * 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.
703
704 (% style="text-align:center" %)
705 [[image:1617934946822-979.png||height="421" width="800" class="img-thumbnail"]]
706
707 Figure 7 ‑2
708
709 (% style="text-align:center" %)
710 [[image:1617950026178-538.png||height="375" width="600" class="img-thumbnail"]]
711
712 Figure 7 ‑3
713
714 **2)How to unassigned project for sub-account**
715
716 In the list of assigned projects in the sub-account, click “Unbind Project” to unbind the project for the account.
717
718 = **8 Cloud SCADA demo account** =
719
720 **1)What is Cloud SCADA platform?**
721
722 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.
723
724 **2)How to access?**
725
726 Asean URL: [[http:~~/~~/asean.v-box.net/web/htmlnew/user/login.html>>url:http://asean.v-box.net/web/htmlnew/user/login.html]]
727
728 Asean account&password: weconuser 123123
729
730 EU URL: [[http:~~/~~/eu.v-box.net/web/htmlnew/user/login.html>>url:http://eu.v-box.net/web/htmlnew/user/login.html]]
731
732 EU account&password: weconuser weconuser123
733 **✎Note1: **users can edit Cloud SCADA project freely, and the modified results will not be saved.
734
735 **✎Note2: **users can enter the Cloud SCADA page by clicking the following positions:
736
737 (% style="text-align:center" %)
738 [[image:1648577581177-590.png||height="408" width="800" class="img-thumbnail"]]
739
740 **3)Industry classification**
741
742 There are 20 Cloud SCADA projects created in demo account, including HVAC system, water treatment system, smart farm, smart factory and smart city.
743
744 (% style="text-align:center" %)
745 [[image:1648577644453-821.png||height="377" width="800" class="img-thumbnail"]]
746
747 **4)Part of the project introduction**
748
749 4.1 Heating Monitoring System
750
751 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.
752
753 (% style="text-align:center" %)
754 [[image:1648577724164-599.png||height="393" width="800" class="img-thumbnail"]]
755
756 (% style="text-align:center" %)
757 [[image:1648577744837-247.png||height="450" width="800" class="img-thumbnail"]]
758
759 4.2 Water Treatment System
760
761 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.
762
763 (% style="text-align:center" %)
764 [[image:1648577778435-311.png||height="450" width="800" class="img-thumbnail"]]
765
766 4.3 Smart City Monitoring
767
768 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.
769
770 (% style="text-align:center" %)
771 [[image:1648577825813-481.png||height="452" width="800" class="img-thumbnail"]]
772
773 (% style="text-align:center" %)
774 [[image:1648577843849-690.png||height="452" width="800" class="img-thumbnail"]]
775
776 4.4 Smart Building Monitoring
777
778 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.
779
780 (% style="text-align:center" %)
781 [[image:1648577874801-932.png||height="408" width="800" class="img-thumbnail"]]
782
783 (% style="text-align:center" %)
784 [[image:1648577894932-957.png||height="408" width="800" class="img-thumbnail"]]