Skip to Content

Wiki source code of 02 Cloud SCADA

Version 34.1 by Stone Wu on 2022/07/20 15:56
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-20220718085015-1.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 switch the device type of report binding at the monitoring point binding of the report, a switching reminder will be given.  At the same time, if you switch the binding device type at "display/conditional hide", the monitoring point information of the component binding will also be cleared, and the device type display here will be switched.
302 * **Map object:** You open the map and all the devices are selected by default. You could set according to your needs. At the same time, if you switch the binding device type in "display/conditional hide", the configuration will be cleared, and all devices will be displayed on the map by default.
303
304 === Object shape ===
305
306 (% style="text-align:center" %)
307 [[image:1617949894556-149.png||height="402" width="250" class="img-thumbnail"]]
308
309 **Line: **A line segment with a starting position and an ending position, which can be hidden by setting styles and conditions.
310
311 **Rectangle: **Used to display rectangular objects, and you can set its position, size, style, conditional hide, etc.
312
313 **Circle:** Used to display circular objects, and you can set its position, size, style, conditional hide, etc.
314
315 **Ellipse: **Used to display oval objects, and you can set its position, size, style, conditional hide, etc.
316
317 **Triangle: **Used to display triangle objects, and you can set its position, size, style, conditional hide, etc.
318
319 **Text: **Used to display text content parts, and you can set text style and background style, and support multi-language input.
320
321 (% class="table-bordered" %)
322 |=(% scope="row" style="width: 195px;" %)**Property**|=(% style="width: 483px;" %)**Description**
323 |=(% style="width: 195px;" %)Multilingual|(% style="width:483px" %)3 languages input and setting are supported, and each language can set the style and display mode of text separately. You need to select the language before setting the text content. The content of the text will be displayed according to the language selected when browsing the interface.
324 |=(% style="width: 195px;" %)Rounded corner|(% style="width:483px" %)Sets the rounded corners of appearance rectangle of the text object .
325 |=(% style="width: 195px;" %)Fill color|(% style="width:483px" %)Sets the fill color of appearance rectangle of the text object.
326 |=(% style="width: 195px;" %)Border color|(% style="width:483px" %)Sets the border color of the text object.
327 |=(% style="width: 195px;" %)Line type|(% style="width:483px" %)Sets the line type of the text object.
328 |=(% style="width: 195px;" %)(((
329 Thickness
330 )))|(% style="width:483px" %)Sets the thickness of the border of the text object. If you choose to hide the border, the border will not be displayed.
331 |=(% style="width: 195px;" %)Conditional hide|(% style="width:483px" %)Set monitoring points and triggering conditions when hiding the object. (conditions for bit address and word address configuration are different)
332
333 **Picture: **It is used for displaying the picture, and supports the user defined picture.
334
335 (% class="table-bordered" %)
336 |=(% scope="row" style="width: 195px;" %)**Property**|=(% style="width: 483px;" %)**Description**
337 |=(% style="width: 195px;" %)Gallery|(% style="width:483px" %)Choose the picture from the gallery
338 |=(% style="width: 195px;" %)Angle|(% style="width:483px" %)Rotation angle (0~~360)
339 |=(% style="width: 195px;" %)Conditional hide|(% style="width:483px" %)Set monitoring points and triggering conditions when hiding the object. (conditions for bit address and word address configuration are different)
340
341 **Table: **Custom table object. You could form the table quickly.
342
343 |=(% scope="row" style="width: 196px;" %)**Attribute**|=(% style="width: 482px;" %)**Description**
344 |=(% style="width: 196px;" %)Background color|(% style="width:482px" %)Sets the background color of the table object.
345 |=(% style="width: 196px;" %)Background transparency|(% style="width:482px" %)(((
346 Set the transparency of the background color in the table object (where the transparency is 0%, the background is full transparent).
347 )))
348 |=(% style="width: 196px;" %)Number of rows|(% style="width:482px" %)Sets the number of rows for the table object. (Limit the number of rows accordign to the object size)
349 |=(% style="width: 196px;" %)Number of columns|(% style="width:482px" %)Sets the number of columns in the table part.(Limit the number of columns accordign to the object size)
350 |=(% style="width: 196px;" %)Border color|(% style="width:482px" %)Sets the color of the border of the table object.
351 |=(% style="width: 196px;" %)Frame thickness|(% style="width:482px" %)Sets the thickness of the border of the table object.
352 |=(% style="width: 196px;" %)Row and column adaptation|(% style="width:482px" %)According to the object size, set the average distribution of width and height of the table.
353 |=(% style="width: 196px;" %)Hide line dividers|(% style="width:482px" %)If checked, the line showing the row is hidden.
354 |=(% style="width: 196px;" %)Hide column divider|(% style="width:482px" %)If checked, the line showing the column is hidden.
355
356 Table operation instructions:
357
358 |=(% style="width: 198px;" %)**Portable operation**|=(% style="width: 481px;" %)**Description**
359 |(% style="width:198px" %)Row control line segment|(% style="width:481px" %)Drag the  row control line to change the row height of the current row.
360 |(% style="width:198px" %)Column control line segment|(% style="width:481px" %)Drag the column control line to change the column width of the current column.
361
362 (% style="text-align:center" %)
363 [[image:V-BOX cloud configuration user manual_html_c84a5d0032df07e2.png||height="420" width="250" class="img-thumbnail"]]
364
365 === Display frame ===
366
367 After binding the monitoring point, the data of the monitoring point can be displayed in real time.
368
369 |=(% style="width: 178px;" %)**Property**|=(% style="width: 596px;" %)Description
370 |(% style="width:178px" %)Monitoring point|(% style="width:596px" %)(((
371 After binding the monitoring point, the data of the monitoring point can be obtained in real time and displayed. Only binding word monitoring points supported
372 )))
373 |(% style="width:178px" %)Write monitoring point|(% style="width:596px" %)(((
374 After binding the monitoring point, you can modify the data of the monitoring point on the browsing interface and write it synchronously to the device.
375 )))
376 |(% rowspan="3" style="width:178px" %)(((
377 Read-write permissions
378 )))|(% style="width:596px" %)Read-write: The display frame can display and write data.
379 |(% style="width:596px" %)Read-only: The display frame can only display data, but cannot write data.
380 |(% style="width:596px" %)Write only: The display frame can only write data, but cannot display data.
381 |(% rowspan="2" style="width:178px" %)(((
382 Background display and hide
383 )))|(% style="width:596px" %)Display: Set the background of the display frame. Background is divided into solid color background and picture background.
384 |(% style="width:596px" %)Hide: Hide the background of the display frame and display only real-time data.
385 |(% style="width:178px" %)Transparency settings|(% style="width:596px" %)(((
386 When the background is solid color background, set the transparency of the background color of the display frame. The default
387
388 transparency is set to 100% (where 0% transparency means that the background is fully transparent).
389 )))
390 |(% style="width:178px" %)(((
391 Object lock
392 )))|(% style="width:596px" %)(((
393 Check the object lock and set the monitoring point and trigger condition of the locking object at the same time. When browsing the interface, if the object lock condition is met, the object will be locked (the lock icon will be displayed on the object), that is, the component is not allowed to write.
394
395 If the hide object lock is checked, the locking function of the part lock will be retained, but the lock icon will not be displayed.
396 )))
397 |(% style="width:178px" %)Text setting|(% style="width:596px" %)Set the data display style of the display frame.
398 |(% style="width:178px" %)Conditional hiding|(% style="width:596px" %)Set the monitoring points and trigger conditions hidden by the object. When the condition is met, the object is hidden.
399
400 === Bit indicator ===
401
402 After the monitoring point is bound, it is used for displaying the state of the bit monitoring point. When the state of the bit monitoring point changes, the bit indicator displays according to the bit state picture pointed by the monitoring point.
403
404 |=(% colspan="1" scope="row" style="width: 250px;" %)**Property**|=(% style="width: 825px;" %)**Description**
405 |(% colspan="1" style="width:250px" %)Monitoring point|(% style="width:825px" %)Bind the monitoring point of bit indicator (only support bit monitoring points).
406 |(% colspan="1" rowspan="4" style="width:250px" %)(((
407 Flash
408 )))|(% style="width:825px" %)(((
409 Effect: When the flash condition is met, the object will use the set flash frequency as the time interval when browsing the interface, and the objects are displayed alternately.
410 )))
411 |(% style="width:825px" %)Select monitoring points: Bind the monitoring point of the trigger condition.
412 |(% style="width:825px" %)Edit conditions: Edit the condition that triggers this function.
413 |(% style="width:825px" %)Flash frequency: Set the time interval for flashing.
414 |(% colspan="1" rowspan="5" style="width:250px" %)(((
415 Status
416 )))|(% style="width:825px" %)(((
417 Function description: Set the multi-state of bit indicator. When the status of the monitoring point satisfies a trigger condition in multiple states, the object displays the style and information in the state.
418 )))
419 |(% style="width:825px" %)Conditions: Set the conditions that trigger this state. The bit indicator only has two states: 0 and 1, and each state contains text settings for three languages.
420 |(% style="width:825px" %)(((
421 Language: Sets the text in the three languages in the selected state, including the displayed text content, text style, text position, etc.
422 )))
423 |(% style="width:825px" %)(((
424 Select language: Select a language in the drop-down box to display text for that language (without style) in the status display list, and the content and style of the text in the language can be set in language setting.
425 )))
426 |(% style="width:825px" %)(((
427 Copy property: Copy the multilingual text and styles of one status to the corresponding multilingual of another status or all statues.
428 )))
429 |(% rowspan="5" style="width:250px" %)(((
430 Graphic
431 )))|(% style="width:825px" %)(((
432 Function description: Set the display picture of each status of the bit indicator. Status of graphics is displayed synchronously with the status setting of the monitoring point.
433 )))
434 |(% style="width:825px" %)(((
435 Modify pictures: Click on a picture in a certain state, and modify the color below the picture.
436
437 This function only works for pictures in the “System Gallery”.
438 )))
439 |(% style="width:825px" %)(((
440 Select pictures: Modify multi-state pictures. Note: When a picture is selected, the pictures in both states of the bit indicator will be replaced in sequence by the state in which the new picture exists. If the new picture has only one status, the status 1 will display no picture.
441 )))
442 |(% style="width:825px" %)Use the default appearance: Restore the pictures in the 0 and 1 states of the bit indicator to the default pictures
443 |(% style="width:825px" %)No appearance: Set the current state to no graph display.
444 |(% style="width:250px" %)Conditional hiding|(% style="width:825px" %)Set the monitoring points and trigger conditions hidden by the object. When the condition is met, the object is hidden.
445
446 === Word indicator ===
447
448 After the word monitoring point is bound, read the status of the monitoring point address and display it according to the set status word and status bitmap. The display picture of the object can be set, which can support 128 kinds of status display.
449
450 |=(% style="width: 191px;" %)**Property**|=(% style="width: 630px;" %)**Description**
451 |(% style="width:191px" %)Monitoring point|(% style="width:630px" %)Monitor point for binding word status (only monitor points of word type supported).
452 |(% rowspan="4" style="width:191px" %)(((
453 Flash
454 )))|(% style="width:630px" %)(((
455 Effect: When the flash condition is met, the object will use the set flash frequency as the time interval when browsing the interface, and the objects are displayed alternately.
456 )))
457 |(% style="width:630px" %)Select monitoring points: Bind the monitoring point of the trigger condition.
458 |(% style="width:630px" %)Edit conditions: Edit the condition that triggers this function.
459 |(% style="width:630px" %)Flash frequency: Set the time interval for flashing.
460 |(% colspan="1" rowspan="5" style="width:191px" %)(((
461 Status
462 )))|(% style="width:630px" %)(((
463 Function description: Set the multi-state display of word monitoring points. When the state of the monitoring point satisfies a trigger condition in multiple states, the object displays the style and information in the state. Word indicator has two states by default, and at least two states are required. A maximum of 128 states can be added. The condition of the last state is always other and cannot be set. Each status contains text settings in three languages.
464 )))
465 |(% style="width:630px" %)Conditions: Set the conditions that trigger this status. Click more conditions to set multiple conditions.
466 |(% style="width:630px" %)(((
467 Language: Sets the text in the three languages in the selected state, including the displayed text content,
468
469 text style, text position, etc.
470 )))
471 |(% style="width:630px" %)(((
472 Select language: Select a language in the drop-down box to display text for that language (without style) in the status display list, and the content and style of the text in the language can be set in language setting.
473 )))
474 |(% style="width:630px" %)(((
475 Copy property: Copy the multilingual text and styles of one status to the corresponding multilingual of another status or all statues.
476 )))
477 |(% rowspan="5" style="width:191px" %)(((
478 Graphic
479 )))|(% style="width:630px" %)(((
480 Function description: Set the picture displayed in each state of the word monitoring point. The state diagram of the graph and the status settings of monitoring points are displayed synchronously.
481 )))
482 |(% style="width:630px" %)(((
483 Modify pictures: Click on a picture in a certain state, and modify the color below the picture.
484
485 This function only works for pictures in the “System Gallery”.
486 )))
487 |(% style="width:630px" %)Select pictures: Modify multi-state pictures. Note that all existing state pictures of the word indicator will be replaced by each state of the new picture in sequence. If the number of states of the new picture is less than that of the current object, the current object will not display the picture of the corresponding state.
488 |(% style="width:630px" %)Use the default appearance: Restore the picture of all states of the word indicator to the default picture.
489 |(% style="width:630px" %)No appearance: Set the current state to no graph display.
490 |(% style="width:191px" %)Conditional hiding|(% style="width:630px" %)Set the monitoring points and trigger conditions hidden by the object. When the condition is met, the object is hidden.
491
492 === Bit switch ===
493
494 After the monitoring point is bound, it is used for controlling the state of the bit monitoring point. When the state of the bit monitoring point changes, the bit switch displays according to the bit state picture pointed by the monitoring point.
495
496 |=(% colspan="2" style="width: 255px;" %)**Property**|=(% colspan="1" style="width: 820px;" %)**Description**
497 |(% colspan="2" style="width:255px" %)Monitoring point|(% colspan="1" style="width:820px" %)Bind the monitoring point of the bit switch (only bit monitoring points are supported).
498 |(% colspan="2" style="width:255px" %)Write monitoring point|(% colspan="1" style="width:820px" %)Bind the write monitor point of the bit switch (only bit monitor points are supported).
499 |(% colspan="2" style="width:255px" %)The monitoring point is consistent with the write monitoring point|(% colspan="1" style="width:820px" %)(((
500 If this check box is checked, the bound write monitoring point the bound monitor monitoring point are consistent.
501 )))
502 |(% colspan="2" rowspan="3" style="width:255px" %)(((
503 Read-write permissions
504 )))|(% colspan="1" style="width:820px" %)Read-write: It can operate the monitoring point and read the state of the monitoring point synchronously. Operation mode: Set ON, set OFF, and switch.
505 |(% colspan="1" style="width:820px" %)(((
506 Read-only: The status of the monitoring point can only be read synchronously and displayed, but cannot be operated.
507 )))
508 |(% colspan="1" style="width:820px" %)Write only: The bit monitoring point can only be operated, but cannot be read.
509 |(% colspan="2" rowspan="2" style="width:255px" %)(((
510 Flash
511 )))|(% colspan="1" style="width:820px" %)Effect: When the flash condition is met, the object will use the set flash frequency as the time interval when browsing the interface, and the objects are displayed alternately.
512 |(% colspan="1" style="width:820px" %)Select monitoring points: Bind the monitoring point of the trigger condition.
513 |(% colspan="1" rowspan="2" style="width:256px" %)Flash|(% colspan="2" style="width:819px" %)Edit conditions: Edit the condition that triggers this function.
514 |(% colspan="2" style="width:819px" %)Flash frequency: Set the time interval for flashing.
515 |(% colspan="1" rowspan="5" style="width:256px" %)(((
516 Status
517 )))|(% colspan="2" style="width:819px" %)(((
518 Function description: Set the multi-state of bit indicator. When the state of the monitoring point satisfies a trigger condition in multiple states, the object displays the style and information in the state.
519 )))
520 |(% colspan="2" style="width:819px" %)Conditions: Set the conditions that trigger this state. The bit indicator only has two states: 0 and 1, and each state contains text settings for three languages.
521 |(% colspan="2" style="width:819px" %)(((
522 Language: Set the text in three languages in the selected state, including the displayed text
523 content, text style, text position, etc.
524 )))
525 |(% colspan="2" style="width:819px" %)(((
526 Select language: Select a language in the drop-down box to display text for that language (without style) in the status display list, and the content and style of the text in the language can be set in language setting.
527 )))
528 |(% colspan="2" style="width:819px" %)(((
529 Copy property: Copy the multilingual text and styles of one status to the corresponding multilingual of another status or all statues.
530 )))
531 |(% colspan="1" rowspan="5" style="width:256px" %)(((
532 Graphic
533 )))|(% colspan="2" style="width:819px" %)(((
534 Function description: Set the display picture of each status of the bit indicator. Status of graphics
535
536 The diagram is displayed synchronously with the status setting of the monitoring point.
537 )))
538 |(% colspan="2" style="width:819px" %)(((
539 Modify pictures: Click on a picture in a certain state, and modify the color of the picture below the picture. This function only works for the pictures in the "System Gallery".
540 )))
541 |(% colspan="2" style="width:819px" %)Select pictures: Modify multi-state pictures. Note: When a picture is selected, the pictures in both states of the bit indicator will be replaced in sequence by the state in which the new picture exists. If the new picture has only one state, the state 1 will display no picture.
542 |(% colspan="2" style="width:819px" %)Use the default appearance: Restore the pictures in the 0 state and 1 state of the bit indicator to the default pictures.
543 |(% colspan="2" style="width:819px" %)No appearance: Set the current state to no graph display.
544 |(% colspan="1" rowspan="4" style="width:256px" %)(((
545 Object lock
546 )))|(% colspan="2" style="width:819px" %)(((
547 Function description: Check the object lock and set the monitoring point and trigger condition of the locking object at the same time. When browsing the interface, if the object lock condition is met, the object will be locked (the lock icon will be displayed on the object), that is, the object is not allowed to write.
548 )))
549 |(% colspan="2" style="width:819px" %)Select monitoring points: Bind the monitoring point of the trigger condition.
550 |(% colspan="2" style="width:819px" %)Edit conditions: Edit the condition that triggers this function.
551 |(% colspan="2" style="width:819px" %)(((
552 Hide object lock icon: If the hide object lock is checked, the locking function of the object lock will be retained, but the lock icon will not be displayed.
553 )))
554 |(% colspan="1" style="width:256px" %)Conditional hiding|(% colspan="2" style="width:819px" %)(((
555 Set the monitoring points and trigger conditions hidden by the object. When the condition is met, the object is hidden.
556 )))
557
558 === Word switch ===
559
560 After the monitoring point is bound, it is used to set the data of the monitoring point.
561
562 (% style="width:1077px" %)
563 |=(% style="width: 252px;" %)**Property**|=(% style="width: 823px;" %)**Description**
564 |(% style="width:252px" %)Monitoring point|(% style="width:823px" %)Bind the monitoring point of the word switch.
565 |(% style="width:252px" %)Write monitoring point|(% style="width:823px" %)Bind the write monitoring point of the word switch.
566 |(% style="width:252px" %)The monitoring point is consistent with the write monitoring point|(% style="width:823px" %)(((
567 If this check box is checked, the bound write monitoring point the bound monitor monitoring point are consistent.
568 )))
569 |(% rowspan="3" style="width:252px" %)(((
570 Read-write permissions
571 )))|(% style="width:823px" %)(((
572 Read-write: It can operate the monitoring point and read the state of the monitoring point synchronously.
573
574 Operation mode: word setting, increase and decrease.
575 )))
576 |(% style="width:823px" %)(((
577 Read-only: The status of the monitoring point can only be read synchronously, and the monitor point cannot be operated.
578 )))
579 |(% style="width:823px" %)Write only: The monitoring point can only be operated, but the status cannot be read.
580 |(% rowspan="2" style="width:252px" %)(((
581
582
583 Word setting
584 )))|(% style="width:823px" %)when browsing the interface, click the object, the setting value will be written into the monitoring point.
585 |(% style="width:823px" %)Operand The value set to the write monitor point.
586 |(% rowspan="5" style="width:252px" %)(((
587 Increase
588 )))|(% style="width:823px" %)when browsing the interface, click the object, the value of the monitoring point is increased once.
589 |(% style="width:823px" %)Operand The value of each increase
590 |(% style="width:823px" %)Upper limit: The maximum value that can be written to the monitoring point.
591 |(% style="width:823px" %)(((
592 Return to destination: Whether to reset the specified value when the value written to the monitoring point reaches the maximum value.
593 )))
594 |(% style="width:823px" %)Destination value: The specified value is reset when the value of write monitoring reaches the upper limit.
595 |(% style="width:252px" %)Decrease|(% style="width:823px" %)The function is the same as increase.
596 |(% rowspan="4" style="width:252px" %)(((
597 Flash
598 )))|(% style="width:823px" %)Effect: When the flash condition is met, the object will use the set flash frequency as the time interval when browsing the interface, and the objects are displayed alternately.
599 |(% style="width:823px" %)Select monitoring points: Bind the monitoring point of the trigger condition.
600 |(% style="width:823px" %)Edit conditions: Edit the condition that triggers this function.
601 |(% style="width:823px" %)Flash frequency: Set the time interval for flashing.
602 |(% colspan="1" rowspan="5" style="width:252px" %)(((
603 Status
604 )))|(% style="width:823px" %)(((
605 Function description: Set the multi-state display of word monitoring points. When the state of the monitoring point satisfies a trigger condition in multiple states, the object displays the style and information in the state.
606
607 Word indicator has two states by default, and at least two states are required. A maximum of 128 states can be added, and the condition of the last status is always other and cannot be set.
608
609 Text setting Each status contains text settings in three languages.
610 )))
611 |(% style="width:823px" %)(((
612 Conditions: Set the conditions that trigger this status. Click more conditions to set multiple conditions combination.
613 )))
614 |(% style="width:823px" %)(((
615 Language: Set the text in three languages in the selected state, including the displayed text
616
617 content, text style, text position, etc.
618 )))
619 |(% style="width:823px" %)(((
620 Select language: Select a language in the drop-down box to display text for that language (without style) in the status display list, and the content and style of the text in the language can be set in language setting.
621 )))
622 |(% style="width:823px" %)(((
623 Copy property: Copy the multilingual text and styles of one status to the corresponding multilingual of another status or all statues.
624 )))
625 |(% rowspan="5" style="width:252px" %)(((
626 Graphic
627 )))|(% style="width:823px" %)Function description: Set the picture displayed in each state of the word monitoring point. The state diagram of the graph is displayed synchronously with the state settings of the monitoring points.
628 |(% style="width:823px" %)Modify pictures: Click on a picture in a certain state, and modify the color of the picture below the picture. This function only works for the pictures in the "System Gallery".
629 |(% style="width:823px" %)Select pictures: Modify multi-state pictures. Note that all existing state pictures of the word indicator will be replaced by each state of the new picture in sequence. If the number of states of the new picture is less than that of the current object, the current object will not display the picture of the corresponding state.
630 |(% style="width:823px" %)Use the default appearance: Restore the picture of all states of the word indicator to the default picture.
631 |(% style="width:823px" %)No appearance: Set the current state to no graph display.
632 |(% style="width:252px" %)Conditional hiding|(% style="width:823px" %)(((
633 Set the monitoring points and trigger conditions hidden by the object. When the condition is met, the object is hidden.
634 )))
635
636 === Dashboard ===
637
638 A object used to realize data visualization by reflecting the numerical changes of word monitoring points in the form of dials and pointers.
639
640 |=(% colspan="2" style="width: 227px;" %)**Property**|=(% colspan="2" style="width: 825px;" %)**Description**|=
641 |(% colspan="2" style="width:227px" %)Monitoring point|(% colspan="2" style="width:825px" %)Bind the monitoring point and get the value of the monitoring point in real time.|
642 |(% colspan="2" style="width:227px" %)(((
643
644
645 Constant, variable
646 )))|(% colspan="2" style="width:825px" %)(((
647 Types of the upper/lower limit values of dashboard
648
649 Constant: The data of the upper/lower limit value of the dashboard is constant.
650
651 Variable: The data of the upper/lower limit value of the dashboard is controlled by the corresponding monitoring point data.
652 )))|
653 |(% colspan="2" style="width:227px" %)Lower limit|(% colspan="2" style="width:825px" %)The value of the starting scale of dashboard.|
654 |(% colspan="1" style="width:238px" %)Upper limit|(% colspan="2" style="width:820px" %)The value of the destination scale of dashboard.|(% colspan="2" rowspan="18" %)
655 |(% colspan="1" style="width:238px" %)Background display and hide|(% colspan="2" style="width:820px" %)Set the display and hide of dashboard background.
656 |(% colspan="1" style="width:238px" %)Display background image|(% colspan="2" style="width:820px" %)It only works when the background is set to display. You can select the displayed background image from the gallery.
657 |(% colspan="1" style="width:238px" %)Select a picture|(% colspan="2" style="width:820px" %)When the background of dashboard is set to display and background picture display is checked, the background picture can be selected.
658 |(% colspan="1" style="width:238px" %)Scale value display|(% colspan="2" style="width:820px" %)Display and hide scale values of dashboard.
659 |(% colspan="1" style="width:238px" %)Scale color|(% colspan="2" style="width:820px" %)Sets the color of the scale value.
660 |(% colspan="1" style="width:238px" %)Scale display|(% colspan="2" style="width:820px" %)Display and hide scale values of dashboard.
661 |(% colspan="1" style="width:238px" %)Main scale|(% colspan="2" style="width:820px" %)Set the number and color of main scale on the dashboard.
662 |(% colspan="1" style="width:238px" %)Sub-scale|(% colspan="2" style="width:820px" %)Set the number and color of sub-scales on the dashboard.
663 |(% colspan="1" style="width:238px" %)Default color|(% colspan="2" style="width:820px" %)The default color of the dashboard.
664 |(% colspan="1" style="width:238px" %)Dashboard type|(% colspan="2" style="width:820px" %)Dashboard dial display within the set number of degrees
665 |(% colspan="1" style="width:238px" %)Numerical display|(% colspan="2" style="width:820px" %)Sets the display and hide of variable values.
666 |(% colspan="1" style="width:238px" %)Pointer style|(% colspan="2" style="width:820px" %)Sets the style of the pointer.
667 |(% colspan="1" style="width:238px" %)Select the language:|(% colspan="2" style="width:820px" %)Set the display and display style of dashboard name. Text in 3 languages can be configured
668 |(% colspan="1" rowspan="4" style="width:238px" %)(((
669 Alert area
670 )))|(% colspan="2" style="width:820px" %)(((
671 Function description: Divide the dial of the dashboard into several areas (1 to 4 zones), each of which can set the style of the partition and the starting value of the partition independently.
672 )))
673 |(% colspan="2" style="width:820px" %)(((
674 Alert value: The starting value of this partition. All values need to be limited to the dashboard starting value; Otherwise, the partition is invalid.
675 )))
676 |(% colspan="2" style="width:820px" %)Color of alert area: Set the dial color of the partition.
677 |(% colspan="2" style="width:820px" %)(((
678 Note: When the value of the monitoring point is not in the set partition, the dashboard and pointer will display the default color; When the monitoring point value is in the set partition, the pointer color is displayed as the set alert area color.
679 )))
680
681 === Bar graph ===
682
683 A object used to realize data visualization by reflecting the numerical changes of word monitoring points in the way of bar graph.
684
685 |=(% colspan="2" style="width: 235px;" %)**Property**|=(% colspan="2" style="width: 817px;" %)**Description**|=
686 |(% colspan="2" style="width:235px" %)Monitoring point|(% colspan="2" style="width:817px" %)It is used to obtain the data of the monitoring point in real time and display it in the bar graph.|
687 |(% colspan="2" style="width:235px" %)Numerical display|(% colspan="2" style="width:817px" %)Whether to display the data of the current monitoring point.|
688 |(% colspan="2" rowspan="2" style="width:235px" %)Progress bar direction|(% colspan="2" style="width:817px" %)0 degree: The bar graph is displayed horizontally, that is, the scale is on the X-axis.|
689 |(% colspan="2" style="width:817px" %)90 degrees: The bar graph is displayed vertically, that is, the scale is on the Y-axis.|
690 |(% colspan="2" style="width:235px" %)Scale display|(% colspan="2" style="width:817px" %)Display and hide of bar graph scale.|
691 |(% colspan="2" style="width:235px" %)Main scale|(% colspan="2" style="width:817px" %)Set the number and color of the main scale.|
692 |(% colspan="2" style="width:235px" %)Sub-scale|(% colspan="2" style="width:817px" %)Set the number and color of sub-scale.|
693 |(% colspan="2" style="width:235px" %)Lower limit|(% colspan="2" style="width:817px" %)The minimum value of the bar graph.|
694 |(% colspan="1" style="width:195px" %)Upper limit|(% colspan="2" style="width:609px" %)The maximum value of the bar graph.|(% colspan="2" rowspan="10" %)
695 |(% colspan="1" rowspan="3" style="width:195px" %)(((
696 Style
697 )))|(% colspan="2" style="width:609px" %)(((
698 Style 1: The scale is displayed on the outer side below the horizontal bar graph or on the outer left side of the vertical bar graph.
699 )))
700 |(% colspan="2" style="width:609px" %)(((
701 Style 2: The scale is displayed on the top, bottom and outside of the horizontal bar graph or on the left and right sides of the vertical bar graph.
702 )))
703 |(% colspan="2" style="width:609px" %)(((
704 Style 3: The scale is displayed on the inner side below the horizontal bar graph or on the inner left side of the vertical bar graph.
705 )))
706 |(% colspan="1" style="width:195px" %)(((
707 Color
708 )))|(% colspan="2" style="width:609px" %)(((
709 Color display of data filling area of monitoring point:
710
711 ~1. When the starting color is consistent with the ending color, the filling area is displayed as solid color;
712
713 2. When the starting color is inconsistent with the ending color, the fill area is displayed as a gradient of starting color - ending color - starting color.
714 )))
715 |(% colspan="1" style="width:195px" %)Background display and hide|(% colspan="2" style="width:609px" %)(((
716 The bar graph background color is displayed or not. The background color refers to the color displayed when the bar graph fill area is not filled.
717 )))
718 |(% colspan="1" rowspan="4" style="width:195px" %)(((
719 Alert area
720 )))|(% colspan="2" style="width:609px" %)(((
721 Function description: Divide the bar graph into several areas (1 to 4 areas), each of which can set the style of the area and the starting value and ending value of the partition independently.
722 )))
723 |(% colspan="2" style="width:609px" %)(((
724 Alert value: The starting and ending values of the partition. All values need to be limited to upper limit and lower limit of the bar graph, otherwise the partition is invalid.
725 )))
726 |(% colspan="2" style="width:609px" %)(((
727 Color of alert area: When the monitoring point value is within a certain partition value range, the bar graph represents the color of the fill area (displayed in solid color).
728 )))
729 |(% colspan="2" style="width:609px" %)(((
730 Note: When the monitoring point value is not in the set partition, the bar chart will display the default color.
731 )))
732
733 === Real-time trend chart ===
734
735 The trend chart takes time as the horizontal axis and data as the vertical axis, and displays the change of data of monitoring points with time in curve.
736
737 |=(% style="width: 230px;" %)**Property**|=(% style="width: 845px;" %)**Description**
738 |(% style="width:230px" %)Number of curves|(% style="width:845px" %)Set the number of curves to be displayed on the curve object.
739 |(% style="width:230px" %)Curve type|(% style="width:845px" %)There are 4 optional styles for curve display.
740 |(% style="width:230px" %)Curve color|(% style="width:845px" %)The color of the curve when it is displayed.
741 |(% style="width:230px" %)Curve name|(% style="width:845px" %)The name of the curve shown in the graph example on the right side of the curve object.
742 |(% style="width:230px" %)Bind monitoring point|(% style="width:845px" %)Select the monitoring points that the curve needs to bind.
743 |(% rowspan="2" style="width:230px" %)(((
744 Y-axis range
745 )))|(% style="width:845px" %)Fixed: Set the values of upper limit and lower limit of Y axis to fixed values.
746 |(% style="width:845px" %)(((
747 Adaptation: In the set time axis, the upper limit of Y-axis is 20% above the maximum of the monitoring point data, and the lower limit of Y-axis is 20% below the minimum of the monitoring point data
748 )))
749 |(% style="width:230px" %)Lower limit of Y-axis|(% style="width:845px" %)When the Y-axis range is fixed, set the minimum value of Y-axis.
750 |(% style="width:230px" %)Upper limit of Y axis|(% style="width:845px" %)When the Y-axis range is fixed, set the minimum value of Y-axis.
751 |(% style="width:230px" %)Grid color|(% style="width:845px" %)Sets the color of the graph grid.
752 |(% style="width:230px" %)Text setting|(% style="width:845px" %)Sets the display style of text in X/Y axis.
753 |(% style="width:230px" %)Start date|(% style="width:845px" %)Set the start time of the X axis of the graph.
754 |(% style="width:230px" %)End date|(% style="width:845px" %)Set the end time of the X axis of the graph.
755 |(% style="width:230px" %)(((
756 Recent days
757 )))|(% style="width:845px" %)(((
758 There are 4 choices (last 1 day, last 7 days, last 30 days, to be selected) for you to filter the time are conveniently and quick, and the corresponding start date and end date will become the current selected last few days. If the selected start and end dates are not within the last 1 day, last 7 days and the last 30 days, the state in recent days will be to be selected.
759 )))
760 |(% rowspan="3" style="width:230px" %)(((
761 Time sequence
762 )))|(% style="width:845px" %)The time sequence of viewing is divided into two kinds: time ascending and time descending.
763 |(% style="width:845px" %)(((
764 Time ascending: The start time is displayed at the left starting point of the X axis, and the time increases from the start time to the end time.
765 )))
766 |(% style="width:845px" %)(((
767 Time descending: The end time is displayed at the left starting point of the X axis, and the time decreases from the end time to the start time.
768 )))
769 |(% style="width:230px" %)Date format|(% style="width:845px" %)Sets the display format of X-axis time and date.
770 |(% style="width:230px" %)Background color of the filter bar|(% style="width:845px" %)Sets the background color of the filter bar row below the chart. There are two kinds of translucent and fully transparent.
771 |(% style="width:230px" %)(((
772 Starting color/End color
773 )))|(% style="width:845px" %)Set the background color of the graph.
774 |(% style="width:230px" %)Gradient type|(% style="width:845px" %)Sets the gradient type of the background color of the graph.
775 |(% style="width:230px" %)Transparency settings|(% style="width:845px" %)Set the transparency of the background color of the graph. The larger the value, the more transparent it is.
776 |(% style="width:230px" %)[[image:image-20220720144807-1.png||height="43" width="54"]]|(% style="width:845px" %)Display the color of this curve correspondingly. Clicking on the graph while browsing the interface will hide the corresponding curve display.
777
778 === Flow bar ===
779
780 The flow effect of color block is used to reflect the flow process in technological process production.
781
782 Select the starting point or end point of the flow bar positioning point, hold down the left mouse button, you can rotate to the corresponding position in the range of 0 to degrees.
783
784 |=(% style="width: 229px;" %)**Property**|=(% style="width: 846px;" %)**Description**
785 |(% style="width:229px" %)Monitoring point|(% style="width:846px" %)Control the flow status of the flow object according to the status of the monitoring point.
786 |(% style="width:229px" %)Trigger condition|(% style="width:846px" %)(((
787 Edit the trigger condition. When the status value of the monitoring point meets the trigger condition, the flow object flows; When the conditions are not met, the flow object will stop flowing.
788 )))
789 |(% style="width:229px" %)Speed|(% style="width:846px" %)The speed of the flow bar can be selected as fast, medium and slow.
790 |(% rowspan="3" style="width:229px" %)(((
791 Flow direction
792 )))|(% style="width:846px" %)The flow direction of the flow bar can be forward and reverse along the straight line.
793 |(% style="width:846px" %)Forward: Flows from left to right.
794 |(% style="width:846px" %)Reverse: Flows from right to left.
795 |(% style="width:229px" %)Color|(% style="width:846px" %)The color of the flowing color block in the flow bar.
796 |(% style="width:229px" %)Color block thickness|(% style="width:846px" %)The thickness of the flowing color block in the flow bar.
797 |(% style="width:229px" %)Color block length|(% style="width:846px" %)The length of the flowing color block in the flow bar.
798 |(% style="width:229px" %)Color block spacing|(% style="width:846px" %)The distance between two flowing color blocks in a flow bar.
799 |(% style="width:229px" %)Border display and hide|(% style="width:846px" %)Set the display and hide of the flow bar border.
800 |(% style="width:229px" %)Border color|(% style="width:846px" %)Sets the border color of the flow bar.
801
802 (% class="lead" id="HTipsforflowbardesign" %)
803 **Tips for flow bar design**
804
805 In order to obtain a more beautiful flow bar, when it is necessary to simulate the flow effect in the water pipe, the pipe picture object can be designed first, and then the hidden frame of the flow bar is placed on the pipe picture object.
806
807 **Video window**
808
809 A video playback object plays a video file provided in a video source. At present, this object only supports fluorite cloud video source, and this object does not support Z-axis sorting on browsing pages, so the video window will be placed on top of all objects when the interface is browsed.
810
811 **Hyperlink**
812
813 The objects with hyperlink function can jump the picture directly and realize the access function.
814
815 |=(% style="width: 245px;" %)**Property**|=(% style="width: 830px;" %)**Description**
816 |(% style="width:245px" %)Background display and hide|(% style="width:830px" %)Set the display and hiding of the object background.
817 |(% rowspan="2" style="width:245px" %)Display background image|(% style="width:830px" %)Check: Hyperlink object background will be displayed as a picture.
818 |(% style="width:830px" %)Uncheck: Hyperlink object background will be displayed in solid color.
819 |(% style="width:245px" %)Transparency settings|(% style="width:830px" %)(((
820 When the background is a solid color background, set the transparency of the background color of the hyperlink part, and the default transparency is set to 100% (0% transparency means that the background is fully transparent).
821 )))
822 |(% style="width:245px" %)Opening mode|(% style="width:830px" %)When you click the hyperlink object, the link address screen is opened in a new window or this window.
823 |(% style="width:245px" %)Link address|(% style="width:830px" %)The address of the linked screen when clicking the hyperlink object.
824 |(% style="width:245px" %)Select language:|(% style="width:830px" %)Select language, and set the text and style of hyperlinks in multilingual.
825
826 === Function switch ===
827
828 This object realizes the function of jumping the picture or popping up the sub-picture on the engineering picture.
829
830 |=(% style="width: 246px;" %)**Property**|=(% style="width: 829px;" %)**Description**
831 |(% style="width:246px" %)Jump to the specified screen|(% style="width:829px" %)Click on the function switch, and jump to the specified screen.
832 |(% style="width:246px" %)Pop-up sub-screen|(% style="width:829px" %)Click on the function switch, and the specified sub-screen will pop up on this screen.
833 |(% style="width:246px" %)Jump to the previous screen.|(% style="width:829px" %)(((
834 Click the function switch, and the screen will jump to the previous screen (the previous screen does not include thumbnail page and sub-screen).
835 )))
836 |(% style="width:246px" %)Jump to the next screen|(% style="width:829px" %)(((
837 Click the function switch, and the screen will jump to the next screen (the next screen does not include thumbnail page and sub-screen).
838 )))
839 |(% style="width:246px" %)Return to the previous screen|(% style="width:829px" %)(((
840 Click the function switch, and the screen jumps to the previous screen (the screen does not include thumbnail page and sub-screen).
841 )))
842 |(% style="width:246px" %)Select language:|(% style="width:829px" %)Select language, and set the text and style of hyperlinks in multilingual.
843 |(% style="width:246px" %)Background display and hide|(% style="width:829px" %)Display and hide the background of the object.
844 |(% style="width:246px" %)Transparency settings|(% style="width:829px" %)(((
845 When the background is a solid color background, set the transparency of the background color of the function switch object. The default transparency is set to 100% (0% transparency means the background is fully transparent)
846 )))
847 |(% rowspan="2" style="width:246px" %)Display background image|(% style="width:829px" %)Check: The object background will be displayed as a picture.
848 |(% style="width:829px" %)Uncheck: The object background will be displayed in solid color.
849
850 === Time ===
851
852 Display the system time object of V-BOX. When the V-BOX is online, the current time of the V-BOX can be displayed in real time. When the V-BOX is offline, the time will stay at the time when the V-BOX is offline. When the V-BOX is not bound, the local time will be displayed.
853
854 |=(% style="width: 240px;" %)**Property**|=(% style="width: 835px;" %)**Description**
855 |(% style="width:240px" %)Monitor V-BOX|(% style="width:835px" %)Bind the V-BOX for displaying the system time of the V-BOX.
856 |(% rowspan="2" style="width:240px" %)Style selection|(% style="width:835px" %)Numbers: The time object will be displayed numerically.
857 |(% style="width:835px" %)Clock: The time object will be displayed as a dial clock.
858 |(% style="width:240px" %)Text setting|(% style="width:835px" %)Set the text style of numeric type in time object.
859
860 === Combination switch ===
861
862 Combination switch supports multipurpose object that perform multiple different or identical events. Click this button to trigger the corresponding functions in turn according to the set event sequence. The functions of combination switch are: Bit operation, word operation, four operations, screen jump.
863
864 (% style="width:1077px" %)
865 |=(% style="width: 231px;" %)**Property**|=(% colspan="2" style="width: 844px;" %)**Description**
866 |(% rowspan="3" style="width:231px" %)(((
867 Bit operation
868 )))|(% colspan="2" style="width:844px" %)(((
869 Operate on the bit monitoring point. Operation type: Set ON, set OFF, and switch.
870
871 Bit replication.
872 )))
873 |(% colspan="2" style="width:844px" %)(((
874 Write monitoring point Write monitoring point when performing bit operation events, only for set ON, Set OFF and switch.
875 )))
876 |(% style="width:152px" %)Bit replication|(% style="width:692px" %)Writes the status value of the source monitoring point to the address of the target monitoring point.
877 |(% rowspan="3" style="width:231px" %)(((
878 Word operation
879 )))|(% colspan="2" style="width:844px" %)(((
880 Operate on word monitoring points. Operation type: Word setting, increase, decrease and word copy.
881 )))
882 |(% colspan="2" style="width:844px" %)Write monitoring point Write monitoring point when performing word operation events, only for word setting, increase and decrease.
883 |(% style="width:152px" %)Word replication|(% style="width:692px" %)Write the data of the source monitoring point to the address of the target monitoring point.
884 |(% rowspan="4" style="width:231px" %)(((
885 Four operations
886 )))|(% colspan="2" style="width:844px" %)(((
887 Four operations such as addition, subtraction, multiplication and division on objects. Operation type: addition, subtraction,
888
889 multiplication and division.
890 )))
891 |(% colspan="2" style="width:844px" %)Source operand 1: The data source to be operated, which is divided into constants and variables.
892 |(% colspan="2" style="width:844px" %)Source operand 2: The data source to be operated, which is divided into constants and variables.
893 |(% colspan="2" style="width:844px" %)Target monitoring point: The result of the operation on the source operands 1 and 2 is written to the monitoring point.
894 |(% style="width:231px" %)Screen jump|(% colspan="2" style="width:844px" %)(((
895 Realize the jump between engineering screens or the pop-up/close function of sub-screens. Specific functions
896
897 Same as "function switch", please refer to the parameter description of "function switch".
898 )))
899 |(% style="width:231px" %)(((
900 Event list
901 )))|(% colspan="2" style="width:844px" %)(((
902 Successful events will form an event list under the Basic Switch tab. Relevant operations and precautions are described as follows:
903
904 ~1. Click an event in the event list to activate the event as a selected event;
905
906 2. Hold down the “ctrl” key and click an event in the event list to select or cancel an event;
907
908 3. The target monitoring point of the above event cannot be used as the source monitoring point of the following event;
909
910 4. Only one screen jump event can be added at most, and it can only be the last one in the list and the last one to be executed.
911 )))
912 |(% style="width:231px" %)Pop-up confirmation box|(% colspan="2" style="width:844px" %)After checking the check box, click the button to execute the event, and the confirmation execution box will pop up.
913 |(% style="width:231px" %)Select the language:|(% colspan="2" style="width:844px" %)Set the text and style of the object in multilingual states.
914 |(% style="width:231px" %)Transparency settings|(% colspan="2" style="width:844px" %)When the background is a solid color background, set the transparency of the background color of the combination switch object, and the default transparency is set to 100% (0% transparency means that the background is fully transparent).
915
916 === Histogram ===
917
918 This object compares two or more numerical changes (at different times or under different conditions) in a bar graph mode, which is mainly used for data statistics and analysis. A object used to realize data visualization by reflecting the numerical changes of word monitoring points in the way of bar graph.
919
920 |=(% style="width: 230px;" %)**Property**|=(% style="width: 845px;" %)**Description**
921 |(% style="width:230px" %)Add group|(% style="width:845px" %)Classify the data to be compared by histogram. You can add up to 8 groups.
922 |(% style="width:230px" %)(((
923
924
925 Add monitoring points
926 )))|(% style="width:845px" %)(((
927 Adds a monitoring point to monitor for the current group.
928
929 The parameters included in the added monitoring point are: Monitor point name, display color, monitor point address. The monitoring point name can be empty.
930 )))
931 |(% style="width:230px" %)(((
932 Scale display
933 )))|(% style="width:845px" %)(((
934 Scale ranges can be set to constants and variables.
935
936 Constant: The scale range (upper/lower limit value) of histogram is fixed.
937
938 Variable: The data of the upper/lower limit value of jump is controlled by the corresponding monitoring point data.
939 )))
940 |(% style="width:230px" %)Scale display|(% style="width:845px" %)(((
941 If the check box is checked, the Y axis of the histogram will display the scale. The number of scales and scale color displayed in it require setting the primary and secondary scales and the color of the scales.
942 )))
943 |(% style="width:230px" %)(((
944 Numerical display
945 )))|(% style="width:845px" %)(((
946 If the check box is checked, the value of the monitoring point will be displayed at the top of the corresponding histogram. If the width of the value is larger than that of the rectangular column, it will be displayed “...,” and the value will be displayed when the mouse moves up.
947
948 If the check box is not checked, the data of the monitoring point will not be displayed.
949 )))
950 |(% style="width:230px" %)Spacing of monitoring points|(% style="width:845px" %)The distance between histograms displayed by each monitoring point.
951 |(% style="width:230px" %)(((
952 Group spacing
953 )))|(% style="width:845px" %)(((
954 The distance displayed between groups.
955
956 Note: The sum of all monitoring point spacing, all group spacing and all column widths cannot exceed the objects. If the object exceeded, please adjust the number of monitoring points, groups spacing or monitoring point spacing, etc. to the actual situation.
957 )))
958
959 === Pie chart ===
960
961 Display the proportion of each monitoring point's data in the total sum of all monitoring points, eventually forming a full circle. The sector size of data from multiple monitoring points on a circle visually represents the percentage of the overall data accounted for by that data, and is commonly used in statistical models.
962
963 |=(% style="width: 230px;" %)**Property**|=(% style="width: 845px;" %)**Description**
964 |(% style="width:230px" %)(((
965 Add monitoring points
966 )))|(% style="width:845px" %)(((
967 Add monitoring points that need to participate in percentage statistics.
968
969 After adding the monitoring point, you can set the monitoring point name, graphic color, and value color, among which the monitoring point name can be set to empty.
970 )))
971 |(% style="width:230px" %)Style selection|(% style="width:845px" %)Define how the scale value, current value and monitor point name are displayed.
972 |(% style="width:230px" %)Numerical display|(% style="width:845px" %)Set whether the monitoring point value and the percentage value are displayed.
973 |(% style="width:230px" %)Monitoring point name|(% style="width:845px" %)Set whether the monitoring point name is displayed.
974 |(% style="width:230px" %)Central control point|(% style="width:845px" %)(((
975 Drag the center control point of the pie chart up and down to set the radius of the inner circle of the pie chart. It can be displayed as a circular proportion chart.
976 )))
977
978 === Ring chart ===
979
980 A object used to realize data visualization by reflecting the numerical changes of word monitoring points in a ring-shape. The complete circle as a range of values is called the range value circle; the filled circle segment to represent the current value is called the value circle, where the maximum and minimum values of the set range are at the start (end) of the circle.
981
982 |=(% style="width: 229px;" %)**Property**|=(% style="width: 846px;" %)**Description**
983 |(% style="width:229px" %)Monitoring point|(% style="width:846px" %)(((
984 It is used to obtain the data of the monitoring point in real time and display it in the filled area of ring chart.
985 )))
986 |(% style="width:229px" %)(((
987 Display range
988 )))|(% style="width:846px" %)(((
989 Set the upper and lower range limits of the whole ring chart.
990
991 Constant: The display range (upper/lower limit value) of the ring chart is fixed.
992
993 Variable: The data of the upper/lower limit value of the ring chart is controlled by the corresponding monitoring point data.
994 )))
995 |(% style="width:229px" %)(((
996 Scale display
997 )))|(% style="width:846px" %)(((
998 If the check box is checked, the scale and scale value can be displayed around the ring diagram. At this time, the number of primary and secondary scales and scale colors should be set.
999
1000 If the check box is not checked, the scale around the ring chart will not be displayed.
1001 )))
1002 |(% style="width:229px" %)Numerical scale display|(% style="width:846px" %)(((
1003 Whether to display the percentage value of monitoring control point value and quantum value.
1004
1005 If displayed, the scale value is displayed in the middle of the ring chart.
1006 )))
1007 |(% style="width:229px" %)Starting angle|(% style="width:846px" %)(((
1008 Defines the starting angle of the numeric ring of the ring chart. The angle is rotated counterclockwise with the top middle position of the ring chart as the reference point
1009 )))
1010 |(% style="width:229px" %)Circular color|(% style="width:846px" %)The color of the ring segment represented by the monitoring point value.
1011 |(% style="width:229px" %)Background color|(% style="width:846px" %)Ring background color, that is, the background color of the range value ring.
1012 |(% colspan="1" rowspan="4" style="width:229px" %)(((
1013 Alert a(% style="background-color:transparent" %)rea
1014 )))|(% style="width:846px" %)(((
1015 Function description: Divide the ring chart into several areas(1 to 4 areas), each of which can set the style of the partition and the starting value and the ending value of the partition independently.
1016 )))
1017 |(% style="width:846px" %)(((
1018 Alert value: The starting and ending values of the partition. All values need to be limited to upper limit and lower limit of the ring chart, otherwise the partition is invalid.
1019 )))
1020 |(% style="width:846px" %)Alert area color: When the monitoring point value is within a certain partition value range, the ring chart represents the color of the fill area (displayed in solid color).
1021 |(% style="width:846px" %)Note: When the monitoring point value is not in the set partition, the ring chart will display the default color.
1022
1023 === Historical trend chart ===
1024
1025 View the historical data curve of monitoring points by setting the start date and the end date. The change of curve is used to display the data change of each monitoring point, X axis represents the time and Y axis represents the monitoring point value.
1026
1027 |=(% style="width: 236px;" %)**Property**|=(% style="width: 839px;" %)**Description**
1028 |(% style="width:236px" %)Number of curves|(% style="width:839px" %)Set the number of curves to be displayed on the curve object.
1029 |(% style="width:236px" %)Curve type|(% style="width:839px" %)There are 4 optional styles for curve display.
1030 |(% style="width:236px" %)Curve color|(% style="width:839px" %)The color of the curve when it is displayed.
1031 |(% style="width:236px" %)Curve name|(% style="width:839px" %)The name of the curve shown in the graph example on the right side of the curve object.
1032 |(% style="width:236px" %)Bind monitoring point|(% style="width:839px" %)Select the monitoring points that the curve needs to bind.
1033 |(% rowspan="2" style="width:236px" %)(((
1034 Y-axis range
1035 )))|(% style="width:839px" %)Fixed: Set the values of upper limit and lower limit of Y axis to fixed values.
1036 |(% style="width:839px" %)(((
1037 Adaptation: In the set time axis, the upper limit of Y-axis is 20% above the maximum of the monitoring point data, and the lower limit of Y-axis is 20% below the minimum of the monitoring point data
1038 )))
1039 |(% style="width:236px" %)Lower limit of Y-axis|(% style="width:839px" %)When the Y-axis range is fixed, set the minimum value of Y-axis.
1040 |(% style="width:236px" %)Upper limit of Y axis|(% style="width:839px" %)When the Y-axis range is fixed, set the minimum value of Y-axis.
1041 |(% style="width:236px" %)Grid color|(% style="width:839px" %)Sets the color of the graph grid.
1042 |(% style="width:236px" %)Text setting|(% style="width:839px" %)Sets the display style of text in X/Y axis.
1043 |(% style="width:236px" %)Start date|(% style="width:839px" %)Set the start time of the X axis of the graph.
1044 |(% style="width:236px" %)End date|(% style="width:839px" %)Set the end time of the X axis of the graph.
1045 |(% style="width:236px" %)(((
1046 Recent days
1047 )))|(% style="width:839px" %)(((
1048 There are 4 choices (last 1 day, last 7 days, last 30 days, to be selected) for you to filter the time are conveniently and quick, and the corresponding start date and end date will become the current selected last few days. If the selected start and end dates are not within the last 1 day, last 7 days and the last 30 days, the state in recent days will be to be selected.
1049 )))
1050 |(% rowspan="3" style="width:236px" %)(((
1051 Time sequence
1052 )))|(% style="width:839px" %)The time sequence of viewing is divided into two kinds: time ascending and time descending.
1053 |(% style="width:839px" %)(((
1054 Time ascending: The start time is displayed at the left starting point of the X axis, and the time increases from the start time to the end time.
1055 )))
1056 |(% style="width:839px" %)(((
1057 Time descending: The end time is displayed at the left starting point of the X axis, and the time decreases from the end time to the start time.
1058 )))
1059 |(% style="width:236px" %)Date format|(% style="width:839px" %)Sets the display format of X-axis time and date.
1060 |(% style="width:236px" %)Background color of the filter bar|(% style="width:839px" %)Sets the background color of the filter bar row below the chart. There are two kinds of translucent and fully transparent.
1061 |(% style="width:236px" %)Starting color/End color|(% style="width:839px" %)Set the background color of the graph.
1062 |(% style="width:236px" %)Gradient type|(% style="width:839px" %)Sets the gradient type of the background color of the graph.
1063 |(% style="width:236px" %)Transparency settings|(% style="width:839px" %)Set the transparency of the background color of the graph. The larger the value, the more transparent it is.
1064
1065 Property description when browsing the interface:
1066
1067 |=(% style="width: 139px;" %)**Property**|=(% style="width: 682px;" %)**Description**
1068 |(% style="width:139px" %)[[image:image-20220720150850-2.png]]|(% style="width:682px" %)Switch the display mode of historical trend chart data: Curves and tables.
1069 |(% style="width:139px" %)(((
1070 [[image:image-20220720150854-3.png]]
1071 )))|(% style="width:682px" %)(((
1072 The historical trend chart moves forward according to the time span.
1073
1074 Time span: The time period between the end date and the start date.
1075
1076 For example, if the start time and end time are separated by 1 day, the historical trend chart will move forward by 1 day.
1077 )))
1078 |(% style="width:139px" %)(((
1079 [[image:image-20220720150911-4.png]]
1080 )))|(% style="width:682px" %)(((
1081 The historical trend chart moves backward by time span.
1082
1083 Time span: The time period between the end date and the start date.
1084
1085 For example, if the start time and end time are separated by 1 day, the historical trend chart will move back by 1 day.
1086 )))
1087 |(% style="width:139px" %)(((
1088 [[image:image-20220720150920-5.png]]
1089 )))|(% style="width:682px" %)(((
1090 Previous page. When the data from the start time to the end time is displayed in multiple pages, click the previous page to display the historical data of previous page.
1091
1092 You can't click on the previous page when you are on the first page.
1093 )))
1094 |(% style="width:139px" %)(((
1095 [[image:image-20220720150922-6.png]]
1096 )))|(% style="width:682px" %)(((
1097 Next page. Data from start time to end time are displayed in multiple pages. Click next page to display the historical data of next page.
1098
1099 You can't click on the next page when you are on the last page.
1100 )))
1101 |(% style="width:139px" %)(((
1102 [[image:image-20220720150929-7.png]]
1103 )))|(% style="width:682px" %)(((
1104 When the width is less than 683, click to view the current page and how many pieces of data per page and how many pieces of data.
1105 )))
1106 |(% style="width:139px" %)(((
1107 [[image:image-20220720150932-8.png]]
1108 )))|(% style="width:682px" %)(((
1109 Figure: Display the color of this curve correspondingly.
1110
1111 When the data is displayed as "curve": When browsing the interface, clicking on the map will hide the corresponding curve display;
1112
1113 When the data is displayed as "table”: The table only displays the data of one monitoring point, and the data of the first selected monitoring point is displayed by default. Clicking on the figure will switch to the data of the corresponding monitoring point.
1114 )))
1115 |(% style="width:139px" %)[[image:image-20220720150937-9.png]]|(% style="width:682px" %)Historical trend chart query button. Click it to pop-up a pop-up box to set the query range.
1116 |(% style="width:139px" %)[[image:image-20220720151000-10.png]]|(% style="width:682px" %)First page: Clicking this button will return to the first page regardless of the current page.
1117 |(% style="width:139px" %)[[image:image-20220720151016-12.png]]|(% style="width:682px" %)Previous page: Clicking this button will display the data of the previous page.
1118 |(% style="width:139px" %)[[image:image-20220720151025-14.png]]|(% style="width:682px" %)Next page: Clicking this button will display the data of the next page.
1119 |(% style="width:139px" %)[[image:image-20220720151023-13.png]]|(% style="width:682px" %)Last page: Clicking this button to reach the last page regardless of the current page.
1120
1121 (% style="text-align:center" %)
1122 [[image:V-BOX cloud configuration user manual_html_c84a5d0032df07e2.png||height="420" width="250" class="img-thumbnail"]]
1123
1124 === Display frame ===
1125
1126 After binding the monitoring point, the data of the monitoring point can be displayed in real time.
1127
1128 |=(% style="width: 178px;" %)**Property**|=(% style="width: 596px;" %)Description
1129 |(% style="width:178px" %)Monitoring point|(% style="width:596px" %)(((
1130 After binding the monitoring point, the data of the monitoring point can be obtained in real time and displayed. Only binding word monitoring points supported
1131 )))
1132 |(% style="width:178px" %)Write monitoring point|(% style="width:596px" %)(((
1133 After binding the monitoring point, you can modify the data of the monitoring point on the browsing interface and write it synchronously to the device.
1134 )))
1135 |(% rowspan="3" style="width:178px" %)(((
1136 Read-write permissions
1137 )))|(% style="width:596px" %)Read-write: The display frame can display and write data.
1138 |(% style="width:596px" %)Read-only: The display frame can only display data, but cannot write data.
1139 |(% style="width:596px" %)Write only: The display frame can only write data, but cannot display data.
1140 |(% rowspan="2" style="width:178px" %)(((
1141 Background display and hide
1142 )))|(% style="width:596px" %)Display: Set the background of the display frame. Background is divided into solid color background and picture background.
1143 |(% style="width:596px" %)Hide: Hide the background of the display frame and display only real-time data.
1144 |(% style="width:178px" %)Transparency settings|(% style="width:596px" %)(((
1145 When the background is solid color background, set the transparency of the background color of the display frame. The default
1146
1147 transparency is set to 100% (where 0% transparency means that the background is fully transparent).
1148 )))
1149 |(% style="width:178px" %)(((
1150 Object lock
1151 )))|(% style="width:596px" %)(((
1152 Check the object lock and set the monitoring point and trigger condition of the locking object at the same time. When browsing the interface, if the object lock condition is met, the object will be locked (the lock icon will be displayed on the object), that is, the component is not allowed to write.
1153
1154 If the hide object lock is checked, the locking function of the part lock will be retained, but the lock icon will not be displayed.
1155 )))
1156 |(% style="width:178px" %)Text setting|(% style="width:596px" %)Set the data display style of the display frame.
1157 |(% style="width:178px" %)Conditional hiding|(% style="width:596px" %)Set the monitoring points and trigger conditions hidden by the object. When the condition is met, the object is hidden.
1158
1159 === Bit indicator ===
1160
1161 After the monitoring point is bound, it is used for displaying the state of the bit monitoring point. When the state of the bit monitoring point changes, the bit indicator displays according to the bit state picture pointed by the monitoring point.
1162
1163 |=(% colspan="1" scope="row" style="width: 250px;" %)**Property**|=(% style="width: 825px;" %)**Description**
1164 |(% colspan="1" style="width:250px" %)Monitoring point|(% style="width:825px" %)Bind the monitoring point of bit indicator (only support bit monitoring points).
1165 |(% colspan="1" rowspan="4" style="width:250px" %)(((
1166 Flash
1167 )))|(% style="width:825px" %)(((
1168 Effect: When the flash condition is met, the object will use the set flash frequency as the time interval when browsing the interface, and the objects are displayed alternately.
1169 )))
1170 |(% style="width:825px" %)Select monitoring points: Bind the monitoring point of the trigger condition.
1171 |(% style="width:825px" %)Edit conditions: Edit the condition that triggers this function.
1172 |(% style="width:825px" %)Flash frequency: Set the time interval for flashing.
1173 |(% colspan="1" rowspan="5" style="width:250px" %)(((
1174 Status
1175 )))|(% style="width:825px" %)(((
1176 Function description: Set the multi-state of bit indicator. When the status of the monitoring point satisfies a trigger condition in multiple states, the object displays the style and information in the state.
1177 )))
1178 |(% style="width:825px" %)Conditions: Set the conditions that trigger this state. The bit indicator only has two states: 0 and 1, and each state contains text settings for three languages.
1179 |(% style="width:825px" %)(((
1180 Language: Sets the text in the three languages in the selected state, including the displayed text content, text style, text position, etc.
1181 )))
1182 |(% style="width:825px" %)(((
1183 Select language: Select a language in the drop-down box to display text for that language (without style) in the status display list, and the content and style of the text in the language can be set in language setting.
1184 )))
1185 |(% style="width:825px" %)(((
1186 Copy property: Copy the multilingual text and styles of one status to the corresponding multilingual of another status or all statues.
1187 )))
1188 |(% rowspan="5" style="width:250px" %)(((
1189 Graphic
1190 )))|(% style="width:825px" %)(((
1191 Function description: Set the display picture of each status of the bit indicator. Status of graphics is displayed synchronously with the status setting of the monitoring point.
1192 )))
1193 |(% style="width:825px" %)(((
1194 Modify pictures: Click on a picture in a certain state, and modify the color below the picture.
1195
1196 This function only works for pictures in the “System Gallery”.
1197 )))
1198 |(% style="width:825px" %)(((
1199 Select pictures: Modify multi-state pictures. Note: When a picture is selected, the pictures in both states of the bit indicator will be replaced in sequence by the state in which the new picture exists. If the new picture has only one status, the status 1 will display no picture.
1200 )))
1201 |(% style="width:825px" %)Use the default appearance: Restore the pictures in the 0 and 1 states of the bit indicator to the default pictures
1202 |(% style="width:825px" %)No appearance: Set the current state to no graph display.
1203 |(% style="width:250px" %)Conditional hiding|(% style="width:825px" %)Set the monitoring points and trigger conditions hidden by the object. When the condition is met, the object is hidden.
1204
1205 === Word indicator ===
1206
1207 After the word monitoring point is bound, read the status of the monitoring point address and display it according to the set status word and status bitmap. The display picture of the object can be set, which can support 128 kinds of status display.
1208
1209 |=(% style="width: 191px;" %)**Property**|=(% style="width: 630px;" %)**Description**
1210 |(% style="width:191px" %)Monitoring point|(% style="width:630px" %)Monitor point for binding word status (only monitor points of word type supported).
1211 |(% rowspan="4" style="width:191px" %)(((
1212 Flash
1213 )))|(% style="width:630px" %)(((
1214 Effect: When the flash condition is met, the object will use the set flash frequency as the time interval when browsing the interface, and the objects are displayed alternately.
1215 )))
1216 |(% style="width:630px" %)Select monitoring points: Bind the monitoring point of the trigger condition.
1217 |(% style="width:630px" %)Edit conditions: Edit the condition that triggers this function.
1218 |(% style="width:630px" %)Flash frequency: Set the time interval for flashing.
1219 |(% colspan="1" rowspan="5" style="width:191px" %)(((
1220 Status
1221 )))|(% style="width:630px" %)(((
1222 Function description: Set the multi-state display of word monitoring points. When the state of the monitoring point satisfies a trigger condition in multiple states, the object displays the style and information in the state. Word indicator has two states by default, and at least two states are required. A maximum of 128 states can be added. The condition of the last state is always other and cannot be set. Each status contains text settings in three languages.
1223 )))
1224 |(% style="width:630px" %)Conditions: Set the conditions that trigger this status. Click more conditions to set multiple conditions.
1225 |(% style="width:630px" %)(((
1226 Language: Sets the text in the three languages in the selected state, including the displayed text content,
1227
1228 text style, text position, etc.
1229 )))
1230 |(% style="width:630px" %)(((
1231 Select language: Select a language in the drop-down box to display text for that language (without style) in the status display list, and the content and style of the text in the language can be set in language setting.
1232 )))
1233 |(% style="width:630px" %)(((
1234 Copy property: Copy the multilingual text and styles of one status to the corresponding multilingual of another status or all statues.
1235 )))
1236 |(% rowspan="5" style="width:191px" %)(((
1237 Graphic
1238 )))|(% style="width:630px" %)(((
1239 Function description: Set the picture displayed in each state of the word monitoring point. The state diagram of the graph and the status settings of monitoring points are displayed synchronously.
1240 )))
1241 |(% style="width:630px" %)(((
1242 Modify pictures: Click on a picture in a certain state, and modify the color below the picture.
1243
1244 This function only works for pictures in the “System Gallery”.
1245 )))
1246 |(% style="width:630px" %)Select pictures: Modify multi-state pictures. Note that all existing state pictures of the word indicator will be replaced by each state of the new picture in sequence. If the number of states of the new picture is less than that of the current object, the current object will not display the picture of the corresponding state.
1247 |(% style="width:630px" %)Use the default appearance: Restore the picture of all states of the word indicator to the default picture.
1248 |(% style="width:630px" %)No appearance: Set the current state to no graph display.
1249 |(% style="width:191px" %)Conditional hiding|(% style="width:630px" %)Set the monitoring points and trigger conditions hidden by the object. When the condition is met, the object is hidden.
1250
1251 === Bit switch ===
1252
1253 After the monitoring point is bound, it is used for controlling the state of the bit monitoring point. When the state of the bit monitoring point changes, the bit switch displays according to the bit state picture pointed by the monitoring point.
1254
1255 |=(% colspan="2" style="width: 255px;" %)**Property**|=(% colspan="1" style="width: 820px;" %)**Description**
1256 |(% colspan="2" style="width:255px" %)Monitoring point|(% colspan="1" style="width:820px" %)Bind the monitoring point of the bit switch (only bit monitoring points are supported).
1257 |(% colspan="2" style="width:255px" %)Write monitoring point|(% colspan="1" style="width:820px" %)Bind the write monitor point of the bit switch (only bit monitor points are supported).
1258 |(% colspan="2" style="width:255px" %)The monitoring point is consistent with the write monitoring point|(% colspan="1" style="width:820px" %)(((
1259 If this check box is checked, the bound write monitoring point the bound monitor monitoring point are consistent.
1260 )))
1261 |(% colspan="2" rowspan="3" style="width:255px" %)(((
1262 Read-write permissions
1263 )))|(% colspan="1" style="width:820px" %)Read-write: It can operate the monitoring point and read the state of the monitoring point synchronously. Operation mode: Set ON, set OFF, and switch.
1264 |(% colspan="1" style="width:820px" %)(((
1265 Read-only: The status of the monitoring point can only be read synchronously and displayed, but cannot be operated.
1266 )))
1267 |(% colspan="1" style="width:820px" %)Write only: The bit monitoring point can only be operated, but cannot be read.
1268 |(% colspan="2" rowspan="2" style="width:255px" %)(((
1269 Flash
1270 )))|(% colspan="1" style="width:820px" %)Effect: When the flash condition is met, the object will use the set flash frequency as the time interval when browsing the interface, and the objects are displayed alternately.
1271 |(% colspan="1" style="width:820px" %)Select monitoring points: Bind the monitoring point of the trigger condition.
1272 |(% colspan="1" rowspan="2" style="width:256px" %)Flash|(% colspan="2" style="width:819px" %)Edit conditions: Edit the condition that triggers this function.
1273 |(% colspan="2" style="width:819px" %)Flash frequency: Set the time interval for flashing.
1274 |(% colspan="1" rowspan="5" style="width:256px" %)(((
1275 Status
1276 )))|(% colspan="2" style="width:819px" %)(((
1277 Function description: Set the multi-state of bit indicator. When the state of the monitoring point satisfies a trigger condition in multiple states, the object displays the style and information in the state.
1278 )))
1279 |(% colspan="2" style="width:819px" %)Conditions: Set the conditions that trigger this state. The bit indicator only has two states: 0 and 1, and each state contains text settings for three languages.
1280 |(% colspan="2" style="width:819px" %)(((
1281 Language: Set the text in three languages in the selected state, including the displayed text
1282 content, text style, text position, etc.
1283 )))
1284 |(% colspan="2" style="width:819px" %)(((
1285 Select language: Select a language in the drop-down box to display text for that language (without style) in the status display list, and the content and style of the text in the language can be set in language setting.
1286 )))
1287 |(% colspan="2" style="width:819px" %)(((
1288 Copy property: Copy the multilingual text and styles of one status to the corresponding multilingual of another status or all statues.
1289 )))
1290 |(% colspan="1" rowspan="5" style="width:256px" %)(((
1291 Graphic
1292 )))|(% colspan="2" style="width:819px" %)(((
1293 Function description: Set the display picture of each status of the bit indicator. Status of graphics
1294
1295 The diagram is displayed synchronously with the status setting of the monitoring point.
1296 )))
1297 |(% colspan="2" style="width:819px" %)(((
1298 Modify pictures: Click on a picture in a certain state, and modify the color of the picture below the picture. This function only works for the pictures in the "System Gallery".
1299 )))
1300 |(% colspan="2" style="width:819px" %)Select pictures: Modify multi-state pictures. Note: When a picture is selected, the pictures in both states of the bit indicator will be replaced in sequence by the state in which the new picture exists. If the new picture has only one state, the state 1 will display no picture.
1301 |(% colspan="2" style="width:819px" %)Use the default appearance: Restore the pictures in the 0 state and 1 state of the bit indicator to the default pictures.
1302 |(% colspan="2" style="width:819px" %)No appearance: Set the current state to no graph display.
1303 |(% colspan="1" rowspan="4" style="width:256px" %)(((
1304 Object lock
1305 )))|(% colspan="2" style="width:819px" %)(((
1306 Function description: Check the object lock and set the monitoring point and trigger condition of the locking object at the same time. When browsing the interface, if the object lock condition is met, the object will be locked (the lock icon will be displayed on the object), that is, the object is not allowed to write.
1307 )))
1308 |(% colspan="2" style="width:819px" %)Select monitoring points: Bind the monitoring point of the trigger condition.
1309 |(% colspan="2" style="width:819px" %)Edit conditions: Edit the condition that triggers this function.
1310 |(% colspan="2" style="width:819px" %)(((
1311 Hide object lock icon: If the hide object lock is checked, the locking function of the object lock will be retained, but the lock icon will not be displayed.
1312 )))
1313 |(% colspan="1" style="width:256px" %)Conditional hiding|(% colspan="2" style="width:819px" %)(((
1314 Set the monitoring points and trigger conditions hidden by the object. When the condition is met, the object is hidden.
1315 )))
1316
1317 === Word switch ===
1318
1319 After the monitoring point is bound, it is used to set the data of the monitoring point.
1320
1321 (% style="width:1077px" %)
1322 |=(% style="width: 252px;" %)**Property**|=(% style="width: 823px;" %)**Description**
1323 |(% style="width:252px" %)Monitoring point|(% style="width:823px" %)Bind the monitoring point of the word switch.
1324 |(% style="width:252px" %)Write monitoring point|(% style="width:823px" %)Bind the write monitoring point of the word switch.
1325 |(% style="width:252px" %)The monitoring point is consistent with the write monitoring point|(% style="width:823px" %)(((
1326 If this check box is checked, the bound write monitoring point the bound monitor monitoring point are consistent.
1327 )))
1328 |(% rowspan="3" style="width:252px" %)(((
1329 Read-write permissions
1330 )))|(% style="width:823px" %)(((
1331 Read-write: It can operate the monitoring point and read the state of the monitoring point synchronously.
1332
1333 Operation mode: word setting, increase and decrease.
1334 )))
1335 |(% style="width:823px" %)(((
1336 Read-only: The status of the monitoring point can only be read synchronously, and the monitor point cannot be operated.
1337 )))
1338 |(% style="width:823px" %)Write only: The monitoring point can only be operated, but the status cannot be read.
1339 |(% rowspan="2" style="width:252px" %)(((
1340
1341
1342 Word setting
1343 )))|(% style="width:823px" %)when browsing the interface, click the object, the setting value will be written into the monitoring point.
1344 |(% style="width:823px" %)Operand The value set to the write monitor point.
1345 |(% rowspan="5" style="width:252px" %)(((
1346 Increase
1347 )))|(% style="width:823px" %)when browsing the interface, click the object, the value of the monitoring point is increased once.
1348 |(% style="width:823px" %)Operand The value of each increase
1349 |(% style="width:823px" %)Upper limit: The maximum value that can be written to the monitoring point.
1350 |(% style="width:823px" %)(((
1351 Return to destination: Whether to reset the specified value when the value written to the monitoring point reaches the maximum value.
1352 )))
1353 |(% style="width:823px" %)Destination value: The specified value is reset when the value of write monitoring reaches the upper limit.
1354 |(% style="width:252px" %)Decrease|(% style="width:823px" %)The function is the same as increase.
1355 |(% rowspan="4" style="width:252px" %)(((
1356 Flash
1357 )))|(% style="width:823px" %)Effect: When the flash condition is met, the object will use the set flash frequency as the time interval when browsing the interface, and the objects are displayed alternately.
1358 |(% style="width:823px" %)Select monitoring points: Bind the monitoring point of the trigger condition.
1359 |(% style="width:823px" %)Edit conditions: Edit the condition that triggers this function.
1360 |(% style="width:823px" %)Flash frequency: Set the time interval for flashing.
1361 |(% colspan="1" rowspan="5" style="width:252px" %)(((
1362 Status
1363 )))|(% style="width:823px" %)(((
1364 Function description: Set the multi-state display of word monitoring points. When the state of the monitoring point satisfies a trigger condition in multiple states, the object displays the style and information in the state.
1365
1366 Word indicator has two states by default, and at least two states are required. A maximum of 128 states can be added, and the condition of the last status is always other and cannot be set.
1367
1368 Text setting Each status contains text settings in three languages.
1369 )))
1370 |(% style="width:823px" %)(((
1371 Conditions: Set the conditions that trigger this status. Click more conditions to set multiple conditions combination.
1372 )))
1373 |(% style="width:823px" %)(((
1374 Language: Set the text in three languages in the selected state, including the displayed text
1375
1376 content, text style, text position, etc.
1377 )))
1378 |(% style="width:823px" %)(((
1379 Select language: Select a language in the drop-down box to display text for that language (without style) in the status display list, and the content and style of the text in the language can be set in language setting.
1380 )))
1381 |(% style="width:823px" %)(((
1382 Copy property: Copy the multilingual text and styles of one status to the corresponding multilingual of another status or all statues.
1383 )))
1384 |(% rowspan="5" style="width:252px" %)(((
1385 Graphic
1386 )))|(% style="width:823px" %)Function description: Set the picture displayed in each state of the word monitoring point. The state diagram of the graph is displayed synchronously with the state settings of the monitoring points.
1387 |(% style="width:823px" %)Modify pictures: Click on a picture in a certain state, and modify the color of the picture below the picture. This function only works for the pictures in the "System Gallery".
1388 |(% style="width:823px" %)Select pictures: Modify multi-state pictures. Note that all existing state pictures of the word indicator will be replaced by each state of the new picture in sequence. If the number of states of the new picture is less than that of the current object, the current object will not display the picture of the corresponding state.
1389 |(% style="width:823px" %)Use the default appearance: Restore the picture of all states of the word indicator to the default picture.
1390 |(% style="width:823px" %)No appearance: Set the current state to no graph display.
1391 |(% style="width:252px" %)Conditional hiding|(% style="width:823px" %)(((
1392 Set the monitoring points and trigger conditions hidden by the object. When the condition is met, the object is hidden.
1393 )))
1394
1395 === Dashboard ===
1396
1397 A object used to realize data visualization by reflecting the numerical changes of word monitoring points in the form of dials and pointers.
1398
1399 |=(% colspan="2" style="width: 227px;" %)**Property**|=(% colspan="2" style="width: 825px;" %)**Description**|=
1400 |(% colspan="2" style="width:227px" %)Monitoring point|(% colspan="2" style="width:825px" %)Bind the monitoring point and get the value of the monitoring point in real time.|
1401 |(% colspan="2" style="width:227px" %)(((
1402
1403
1404 Constant, variable
1405 )))|(% colspan="2" style="width:825px" %)(((
1406 Types of the upper/lower limit values of dashboard
1407
1408 Constant: The data of the upper/lower limit value of the dashboard is constant.
1409
1410 Variable: The data of the upper/lower limit value of the dashboard is controlled by the corresponding monitoring point data.
1411 )))|
1412 |(% colspan="2" style="width:227px" %)Lower limit|(% colspan="2" style="width:825px" %)The value of the starting scale of dashboard.|
1413 |(% colspan="1" style="width:238px" %)Upper limit|(% colspan="2" style="width:820px" %)The value of the destination scale of dashboard.|(% colspan="2" rowspan="18" %)
1414 |(% colspan="1" style="width:238px" %)Background display and hide|(% colspan="2" style="width:820px" %)Set the display and hide of dashboard background.
1415 |(% colspan="1" style="width:238px" %)Display background image|(% colspan="2" style="width:820px" %)It only works when the background is set to display. You can select the displayed background image from the gallery.
1416 |(% colspan="1" style="width:238px" %)Select a picture|(% colspan="2" style="width:820px" %)When the background of dashboard is set to display and background picture display is checked, the background picture can be selected.
1417 |(% colspan="1" style="width:238px" %)Scale value display|(% colspan="2" style="width:820px" %)Display and hide scale values of dashboard.
1418 |(% colspan="1" style="width:238px" %)Scale color|(% colspan="2" style="width:820px" %)Sets the color of the scale value.
1419 |(% colspan="1" style="width:238px" %)Scale display|(% colspan="2" style="width:820px" %)Display and hide scale values of dashboard.
1420 |(% colspan="1" style="width:238px" %)Main scale|(% colspan="2" style="width:820px" %)Set the number and color of main scale on the dashboard.
1421 |(% colspan="1" style="width:238px" %)Sub-scale|(% colspan="2" style="width:820px" %)Set the number and color of sub-scales on the dashboard.
1422 |(% colspan="1" style="width:238px" %)Default color|(% colspan="2" style="width:820px" %)The default color of the dashboard.
1423 |(% colspan="1" style="width:238px" %)Dashboard type|(% colspan="2" style="width:820px" %)Dashboard dial display within the set number of degrees
1424 |(% colspan="1" style="width:238px" %)Numerical display|(% colspan="2" style="width:820px" %)Sets the display and hide of variable values.
1425 |(% colspan="1" style="width:238px" %)Pointer style|(% colspan="2" style="width:820px" %)Sets the style of the pointer.
1426 |(% colspan="1" style="width:238px" %)Select the language:|(% colspan="2" style="width:820px" %)Set the display and display style of dashboard name. Text in 3 languages can be configured
1427 |(% colspan="1" rowspan="4" style="width:238px" %)(((
1428 Alert area
1429 )))|(% colspan="2" style="width:820px" %)(((
1430 Function description: Divide the dial of the dashboard into several areas (1 to 4 zones), each of which can set the style of the partition and the starting value of the partition independently.
1431 )))
1432 |(% colspan="2" style="width:820px" %)(((
1433 Alert value: The starting value of this partition. All values need to be limited to the dashboard starting value; Otherwise, the partition is invalid.
1434 )))
1435 |(% colspan="2" style="width:820px" %)Color of alert area: Set the dial color of the partition.
1436 |(% colspan="2" style="width:820px" %)(((
1437 Note: When the value of the monitoring point is not in the set partition, the dashboard and pointer will display the default color; When the monitoring point value is in the set partition, the pointer color is displayed as the set alert area color.
1438 )))
1439
1440 === Bar graph ===
1441
1442 A object used to realize data visualization by reflecting the numerical changes of word monitoring points in the way of bar graph.
1443
1444 |=(% colspan="2" style="width: 235px;" %)**Property**|=(% colspan="2" style="width: 817px;" %)**Description**|=
1445 |(% colspan="2" style="width:235px" %)Monitoring point|(% colspan="2" style="width:817px" %)It is used to obtain the data of the monitoring point in real time and display it in the bar graph.|
1446 |(% colspan="2" style="width:235px" %)Numerical display|(% colspan="2" style="width:817px" %)Whether to display the data of the current monitoring point.|
1447 |(% colspan="2" rowspan="2" style="width:235px" %)Progress bar direction|(% colspan="2" style="width:817px" %)0 degree: The bar graph is displayed horizontally, that is, the scale is on the X-axis.|
1448 |(% colspan="2" style="width:817px" %)90 degrees: The bar graph is displayed vertically, that is, the scale is on the Y-axis.|
1449 |(% colspan="2" style="width:235px" %)Scale display|(% colspan="2" style="width:817px" %)Display and hide of bar graph scale.|
1450 |(% colspan="2" style="width:235px" %)Main scale|(% colspan="2" style="width:817px" %)Set the number and color of the main scale.|
1451 |(% colspan="2" style="width:235px" %)Sub-scale|(% colspan="2" style="width:817px" %)Set the number and color of sub-scale.|
1452 |(% colspan="2" style="width:235px" %)Lower limit|(% colspan="2" style="width:817px" %)The minimum value of the bar graph.|
1453 |(% colspan="1" style="width:195px" %)Upper limit|(% colspan="2" style="width:609px" %)The maximum value of the bar graph.|(% colspan="2" rowspan="10" %)
1454 |(% colspan="1" rowspan="3" style="width:195px" %)(((
1455 Style
1456 )))|(% colspan="2" style="width:609px" %)(((
1457 Style 1: The scale is displayed on the outer side below the horizontal bar graph or on the outer left side of the vertical bar graph.
1458 )))
1459 |(% colspan="2" style="width:609px" %)(((
1460 Style 2: The scale is displayed on the top, bottom and outside of the horizontal bar graph or on the left and right sides of the vertical bar graph.
1461 )))
1462 |(% colspan="2" style="width:609px" %)(((
1463 Style 3: The scale is displayed on the inner side below the horizontal bar graph or on the inner left side of the vertical bar graph.
1464 )))
1465 |(% colspan="1" style="width:195px" %)(((
1466 Color
1467 )))|(% colspan="2" style="width:609px" %)(((
1468 Color display of data filling area of monitoring point:
1469
1470 ~1. When the starting color is consistent with the ending color, the filling area is displayed as solid color;
1471
1472 2. When the starting color is inconsistent with the ending color, the fill area is displayed as a gradient of starting color - ending color - starting color.
1473 )))
1474 |(% colspan="1" style="width:195px" %)Background display and hide|(% colspan="2" style="width:609px" %)(((
1475 The bar graph background color is displayed or not. The background color refers to the color displayed when the bar graph fill area is not filled.
1476 )))
1477 |(% colspan="1" rowspan="4" style="width:195px" %)(((
1478 Alert area
1479 )))|(% colspan="2" style="width:609px" %)(((
1480 Function description: Divide the bar graph into several areas (1 to 4 areas), each of which can set the style of the area and the starting value and ending value of the partition independently.
1481 )))
1482 |(% colspan="2" style="width:609px" %)(((
1483 Alert value: The starting and ending values of the partition. All values need to be limited to upper limit and lower limit of the bar graph, otherwise the partition is invalid.
1484 )))
1485 |(% colspan="2" style="width:609px" %)(((
1486 Color of alert area: When the monitoring point value is within a certain partition value range, the bar graph represents the color of the fill area (displayed in solid color).
1487 )))
1488 |(% colspan="2" style="width:609px" %)(((
1489 Note: When the monitoring point value is not in the set partition, the bar chart will display the default color.
1490 )))
1491
1492 === Real-time trend chart ===
1493
1494 The trend chart takes time as the horizontal axis and data as the vertical axis, and displays the change of data of monitoring points with time in curve.
1495
1496 |=(% style="width: 230px;" %)**Property**|=(% style="width: 845px;" %)**Description**
1497 |(% style="width:230px" %)Number of curves|(% style="width:845px" %)Set the number of curves to be displayed on the curve object.
1498 |(% style="width:230px" %)Curve type|(% style="width:845px" %)There are 4 optional styles for curve display.
1499 |(% style="width:230px" %)Curve color|(% style="width:845px" %)The color of the curve when it is displayed.
1500 |(% style="width:230px" %)Curve name|(% style="width:845px" %)The name of the curve shown in the graph example on the right side of the curve object.
1501 |(% style="width:230px" %)Bind monitoring point|(% style="width:845px" %)Select the monitoring points that the curve needs to bind.
1502 |(% rowspan="2" style="width:230px" %)(((
1503 Y-axis range
1504 )))|(% style="width:845px" %)Fixed: Set the values of upper limit and lower limit of Y axis to fixed values.
1505 |(% style="width:845px" %)(((
1506 Adaptation: In the set time axis, the upper limit of Y-axis is 20% above the maximum of the monitoring point data, and the lower limit of Y-axis is 20% below the minimum of the monitoring point data
1507 )))
1508 |(% style="width:230px" %)Lower limit of Y-axis|(% style="width:845px" %)When the Y-axis range is fixed, set the minimum value of Y-axis.
1509 |(% style="width:230px" %)Upper limit of Y axis|(% style="width:845px" %)When the Y-axis range is fixed, set the minimum value of Y-axis.
1510 |(% style="width:230px" %)Grid color|(% style="width:845px" %)Sets the color of the graph grid.
1511 |(% style="width:230px" %)Text setting|(% style="width:845px" %)Sets the display style of text in X/Y axis.
1512 |(% style="width:230px" %)Start date|(% style="width:845px" %)Set the start time of the X axis of the graph.
1513 |(% style="width:230px" %)End date|(% style="width:845px" %)Set the end time of the X axis of the graph.
1514 |(% style="width:230px" %)(((
1515 Recent days
1516 )))|(% style="width:845px" %)(((
1517 There are 4 choices (last 1 day, last 7 days, last 30 days, to be selected) for you to filter the time are conveniently and quick, and the corresponding start date and end date will become the current selected last few days. If the selected start and end dates are not within the last 1 day, last 7 days and the last 30 days, the state in recent days will be to be selected.
1518 )))
1519 |(% rowspan="3" style="width:230px" %)(((
1520 Time sequence
1521 )))|(% style="width:845px" %)The time sequence of viewing is divided into two kinds: time ascending and time descending.
1522 |(% style="width:845px" %)(((
1523 Time ascending: The start time is displayed at the left starting point of the X axis, and the time increases from the start time to the end time.
1524 )))
1525 |(% style="width:845px" %)(((
1526 Time descending: The end time is displayed at the left starting point of the X axis, and the time decreases from the end time to the start time.
1527 )))
1528 |(% style="width:230px" %)Date format|(% style="width:845px" %)Sets the display format of X-axis time and date.
1529 |(% style="width:230px" %)Background color of the filter bar|(% style="width:845px" %)Sets the background color of the filter bar row below the chart. There are two kinds of translucent and fully transparent.
1530 |(% style="width:230px" %)(((
1531 Starting color/End color
1532 )))|(% style="width:845px" %)Set the background color of the graph.
1533 |(% style="width:230px" %)Gradient type|(% style="width:845px" %)Sets the gradient type of the background color of the graph.
1534 |(% style="width:230px" %)Transparency settings|(% style="width:845px" %)Set the transparency of the background color of the graph. The larger the value, the more transparent it is.
1535 |(% style="width:230px" %)[[image:image-20220720144807-1.png||height="43" width="54"]]|(% style="width:845px" %)Display the color of this curve correspondingly. Clicking on the graph while browsing the interface will hide the corresponding curve display.
1536
1537 === Flow bar ===
1538
1539 The flow effect of color block is used to reflect the flow process in technological process production.
1540
1541 Select the starting point or end point of the flow bar positioning point, hold down the left mouse button, you can rotate to the corresponding position in the range of 0 to degrees.
1542
1543 |=(% style="width: 229px;" %)**Property**|=(% style="width: 846px;" %)**Description**
1544 |(% style="width:229px" %)Monitoring point|(% style="width:846px" %)Control the flow status of the flow object according to the status of the monitoring point.
1545 |(% style="width:229px" %)Trigger condition|(% style="width:846px" %)(((
1546 Edit the trigger condition. When the status value of the monitoring point meets the trigger condition, the flow object flows; When the conditions are not met, the flow object will stop flowing.
1547 )))
1548 |(% style="width:229px" %)Speed|(% style="width:846px" %)The speed of the flow bar can be selected as fast, medium and slow.
1549 |(% rowspan="3" style="width:229px" %)(((
1550 Flow direction
1551 )))|(% style="width:846px" %)The flow direction of the flow bar can be forward and reverse along the straight line.
1552 |(% style="width:846px" %)Forward: Flows from left to right.
1553 |(% style="width:846px" %)Reverse: Flows from right to left.
1554 |(% style="width:229px" %)Color|(% style="width:846px" %)The color of the flowing color block in the flow bar.
1555 |(% style="width:229px" %)Color block thickness|(% style="width:846px" %)The thickness of the flowing color block in the flow bar.
1556 |(% style="width:229px" %)Color block length|(% style="width:846px" %)The length of the flowing color block in the flow bar.
1557 |(% style="width:229px" %)Color block spacing|(% style="width:846px" %)The distance between two flowing color blocks in a flow bar.
1558 |(% style="width:229px" %)Border display and hide|(% style="width:846px" %)Set the display and hide of the flow bar border.
1559 |(% style="width:229px" %)Border color|(% style="width:846px" %)Sets the border color of the flow bar.
1560
1561 (% class="lead" id="HTipsforflowbardesign" %)
1562 **Tips for flow bar design**
1563
1564 In order to obtain a more beautiful flow bar, when it is necessary to simulate the flow effect in the water pipe, the pipe picture object can be designed first, and then the hidden frame of the flow bar is placed on the pipe picture object.
1565
1566 **Video window**
1567
1568 A video playback object plays a video file provided in a video source. At present, this object only supports fluorite cloud video source, and this object does not support Z-axis sorting on browsing pages, so the video window will be placed on top of all objects when the interface is browsed.
1569
1570 **Hyperlink**
1571
1572 The objects with hyperlink function can jump the picture directly and realize the access function.
1573
1574 |=(% style="width: 245px;" %)**Property**|=(% style="width: 830px;" %)**Description**
1575 |(% style="width:245px" %)Background display and hide|(% style="width:830px" %)Set the display and hiding of the object background.
1576 |(% rowspan="2" style="width:245px" %)Display background image|(% style="width:830px" %)Check: Hyperlink object background will be displayed as a picture.
1577 |(% style="width:830px" %)Uncheck: Hyperlink object background will be displayed in solid color.
1578 |(% style="width:245px" %)Transparency settings|(% style="width:830px" %)(((
1579 When the background is a solid color background, set the transparency of the background color of the hyperlink part, and the default transparency is set to 100% (0% transparency means that the background is fully transparent).
1580 )))
1581 |(% style="width:245px" %)Opening mode|(% style="width:830px" %)When you click the hyperlink object, the link address screen is opened in a new window or this window.
1582 |(% style="width:245px" %)Link address|(% style="width:830px" %)The address of the linked screen when clicking the hyperlink object.
1583 |(% style="width:245px" %)Select language:|(% style="width:830px" %)Select language, and set the text and style of hyperlinks in multilingual.
1584
1585 === Function switch ===
1586
1587 This object realizes the function of jumping the picture or popping up the sub-picture on the engineering picture.
1588
1589 |=(% style="width: 246px;" %)**Property**|=(% style="width: 829px;" %)**Description**
1590 |(% style="width:246px" %)Jump to the specified screen|(% style="width:829px" %)Click on the function switch, and jump to the specified screen.
1591 |(% style="width:246px" %)Pop-up sub-screen|(% style="width:829px" %)Click on the function switch, and the specified sub-screen will pop up on this screen.
1592 |(% style="width:246px" %)Jump to the previous screen.|(% style="width:829px" %)(((
1593 Click the function switch, and the screen will jump to the previous screen (the previous screen does not include thumbnail page and sub-screen).
1594 )))
1595 |(% style="width:246px" %)Jump to the next screen|(% style="width:829px" %)(((
1596 Click the function switch, and the screen will jump to the next screen (the next screen does not include thumbnail page and sub-screen).
1597 )))
1598 |(% style="width:246px" %)Return to the previous screen|(% style="width:829px" %)(((
1599 Click the function switch, and the screen jumps to the previous screen (the screen does not include thumbnail page and sub-screen).
1600 )))
1601 |(% style="width:246px" %)Select language:|(% style="width:829px" %)Select language, and set the text and style of hyperlinks in multilingual.
1602 |(% style="width:246px" %)Background display and hide|(% style="width:829px" %)Display and hide the background of the object.
1603 |(% style="width:246px" %)Transparency settings|(% style="width:829px" %)(((
1604 When the background is a solid color background, set the transparency of the background color of the function switch object. The default transparency is set to 100% (0% transparency means the background is fully transparent)
1605 )))
1606 |(% rowspan="2" style="width:246px" %)Display background image|(% style="width:829px" %)Check: The object background will be displayed as a picture.
1607 |(% style="width:829px" %)Uncheck: The object background will be displayed in solid color.
1608
1609 === Time ===
1610
1611 Display the system time object of V-BOX. When the V-BOX is online, the current time of the V-BOX can be displayed in real time. When the V-BOX is offline, the time will stay at the time when the V-BOX is offline. When the V-BOX is not bound, the local time will be displayed.
1612
1613 |=(% style="width: 240px;" %)**Property**|=(% style="width: 835px;" %)**Description**
1614 |(% style="width:240px" %)Monitor V-BOX|(% style="width:835px" %)Bind the V-BOX for displaying the system time of the V-BOX.
1615 |(% rowspan="2" style="width:240px" %)Style selection|(% style="width:835px" %)Numbers: The time object will be displayed numerically.
1616 |(% style="width:835px" %)Clock: The time object will be displayed as a dial clock.
1617 |(% style="width:240px" %)Text setting|(% style="width:835px" %)Set the text style of numeric type in time object.
1618
1619 === Combination switch ===
1620
1621 Combination switch supports multipurpose object that perform multiple different or identical events. Click this button to trigger the corresponding functions in turn according to the set event sequence. The functions of combination switch are: Bit operation, word operation, four operations, screen jump.
1622
1623 (% style="width:1077px" %)
1624 |=(% style="width: 231px;" %)**Property**|=(% colspan="2" style="width: 844px;" %)**Description**
1625 |(% rowspan="3" style="width:231px" %)(((
1626 Bit operation
1627 )))|(% colspan="2" style="width:844px" %)(((
1628 Operate on the bit monitoring point. Operation type: Set ON, set OFF, and switch.
1629
1630 Bit replication.
1631 )))
1632 |(% colspan="2" style="width:844px" %)(((
1633 Write monitoring point Write monitoring point when performing bit operation events, only for set ON, Set OFF and switch.
1634 )))
1635 |(% style="width:152px" %)Bit replication|(% style="width:692px" %)Writes the status value of the source monitoring point to the address of the target monitoring point.
1636 |(% rowspan="3" style="width:231px" %)(((
1637 Word operation
1638 )))|(% colspan="2" style="width:844px" %)(((
1639 Operate on word monitoring points. Operation type: Word setting, increase, decrease and word copy.
1640 )))
1641 |(% colspan="2" style="width:844px" %)Write monitoring point Write monitoring point when performing word operation events, only for word setting, increase and decrease.
1642 |(% style="width:152px" %)Word replication|(% style="width:692px" %)Write the data of the source monitoring point to the address of the target monitoring point.
1643 |(% rowspan="4" style="width:231px" %)(((
1644 Four operations
1645 )))|(% colspan="2" style="width:844px" %)(((
1646 Four operations such as addition, subtraction, multiplication and division on objects. Operation type: addition, subtraction,
1647
1648 multiplication and division.
1649 )))
1650 |(% colspan="2" style="width:844px" %)Source operand 1: The data source to be operated, which is divided into constants and variables.
1651 |(% colspan="2" style="width:844px" %)Source operand 2: The data source to be operated, which is divided into constants and variables.
1652 |(% colspan="2" style="width:844px" %)Target monitoring point: The result of the operation on the source operands 1 and 2 is written to the monitoring point.
1653 |(% style="width:231px" %)Screen jump|(% colspan="2" style="width:844px" %)(((
1654 Realize the jump between engineering screens or the pop-up/close function of sub-screens. Specific functions
1655
1656 Same as "function switch", please refer to the parameter description of "function switch".
1657 )))
1658 |(% style="width:231px" %)(((
1659 Event list
1660 )))|(% colspan="2" style="width:844px" %)(((
1661 Successful events will form an event list under the Basic Switch tab. Relevant operations and precautions are described as follows:
1662
1663 ~1. Click an event in the event list to activate the event as a selected event;
1664
1665 2. Hold down the “ctrl” key and click an event in the event list to select or cancel an event;
1666
1667 3. The target monitoring point of the above event cannot be used as the source monitoring point of the following event;
1668
1669 4. Only one screen jump event can be added at most, and it can only be the last one in the list and the last one to be executed.
1670 )))
1671 |(% style="width:231px" %)Pop-up confirmation box|(% colspan="2" style="width:844px" %)After checking the check box, click the button to execute the event, and the confirmation execution box will pop up.
1672 |(% style="width:231px" %)Select the language:|(% colspan="2" style="width:844px" %)Set the text and style of the object in multilingual states.
1673 |(% style="width:231px" %)Transparency settings|(% colspan="2" style="width:844px" %)When the background is a solid color background, set the transparency of the background color of the combination switch object, and the default transparency is set to 100% (0% transparency means that the background is fully transparent).
1674
1675 === Histogram ===
1676
1677 This object compares two or more numerical changes (at different times or under different conditions) in a bar graph mode, which is mainly used for data statistics and analysis. A object used to realize data visualization by reflecting the numerical changes of word monitoring points in the way of bar graph.
1678
1679 |=(% style="width: 230px;" %)**Property**|=(% style="width: 845px;" %)**Description**
1680 |(% style="width:230px" %)Add group|(% style="width:845px" %)Classify the data to be compared by histogram. You can add up to 8 groups.
1681 |(% style="width:230px" %)(((
1682
1683
1684 Add monitoring points
1685 )))|(% style="width:845px" %)(((
1686 Adds a monitoring point to monitor for the current group.
1687
1688 The parameters included in the added monitoring point are: Monitor point name, display color, monitor point address. The monitoring point name can be empty.
1689 )))
1690 |(% style="width:230px" %)(((
1691 Scale display
1692 )))|(% style="width:845px" %)(((
1693 Scale ranges can be set to constants and variables.
1694
1695 Constant: The scale range (upper/lower limit value) of histogram is fixed.
1696
1697 Variable: The data of the upper/lower limit value of jump is controlled by the corresponding monitoring point data.
1698 )))
1699 |(% style="width:230px" %)Scale display|(% style="width:845px" %)(((
1700 If the check box is checked, the Y axis of the histogram will display the scale. The number of scales and scale color displayed in it require setting the primary and secondary scales and the color of the scales.
1701 )))
1702 |(% style="width:230px" %)(((
1703 Numerical display
1704 )))|(% style="width:845px" %)(((
1705 If the check box is checked, the value of the monitoring point will be displayed at the top of the corresponding histogram. If the width of the value is larger than that of the rectangular column, it will be displayed “...,” and the value will be displayed when the mouse moves up.
1706
1707 If the check box is not checked, the data of the monitoring point will not be displayed.
1708 )))
1709 |(% style="width:230px" %)Spacing of monitoring points|(% style="width:845px" %)The distance between histograms displayed by each monitoring point.
1710 |(% style="width:230px" %)(((
1711 Group spacing
1712 )))|(% style="width:845px" %)(((
1713 The distance displayed between groups.
1714
1715 Note: The sum of all monitoring point spacing, all group spacing and all column widths cannot exceed the objects. If the object exceeded, please adjust the number of monitoring points, groups spacing or monitoring point spacing, etc. to the actual situation.
1716 )))
1717
1718 === Pie chart ===
1719
1720 Display the proportion of each monitoring point's data in the total sum of all monitoring points, eventually forming a full circle. The sector size of data from multiple monitoring points on a circle visually represents the percentage of the overall data accounted for by that data, and is commonly used in statistical models.
1721
1722 |=(% style="width: 230px;" %)**Property**|=(% style="width: 845px;" %)**Description**
1723 |(% style="width:230px" %)(((
1724 Add monitoring points
1725 )))|(% style="width:845px" %)(((
1726 Add monitoring points that need to participate in percentage statistics.
1727
1728 After adding the monitoring point, you can set the monitoring point name, graphic color, and value color, among which the monitoring point name can be set to empty.
1729 )))
1730 |(% style="width:230px" %)Style selection|(% style="width:845px" %)Define how the scale value, current value and monitor point name are displayed.
1731 |(% style="width:230px" %)Numerical display|(% style="width:845px" %)Set whether the monitoring point value and the percentage value are displayed.
1732 |(% style="width:230px" %)Monitoring point name|(% style="width:845px" %)Set whether the monitoring point name is displayed.
1733 |(% style="width:230px" %)Central control point|(% style="width:845px" %)(((
1734 Drag the center control point of the pie chart up and down to set the radius of the inner circle of the pie chart. It can be displayed as a circular proportion chart.
1735 )))
1736
1737 === Ring chart ===
1738
1739 A object used to realize data visualization by reflecting the numerical changes of word monitoring points in a ring-shape. The complete circle as a range of values is called the range value circle; the filled circle segment to represent the current value is called the value circle, where the maximum and minimum values of the set range are at the start (end) of the circle.
1740
1741 |=(% style="width: 229px;" %)**Property**|=(% style="width: 846px;" %)**Description**
1742 |(% style="width:229px" %)Monitoring point|(% style="width:846px" %)(((
1743 It is used to obtain the data of the monitoring point in real time and display it in the filled area of ring chart.
1744 )))
1745 |(% style="width:229px" %)(((
1746 Display range
1747 )))|(% style="width:846px" %)(((
1748 Set the upper and lower range limits of the whole ring chart.
1749
1750 Constant: The display range (upper/lower limit value) of the ring chart is fixed.
1751
1752 Variable: The data of the upper/lower limit value of the ring chart is controlled by the corresponding monitoring point data.
1753 )))
1754 |(% style="width:229px" %)(((
1755 Scale display
1756 )))|(% style="width:846px" %)(((
1757 If the check box is checked, the scale and scale value can be displayed around the ring diagram. At this time, the number of primary and secondary scales and scale colors should be set.
1758
1759 If the check box is not checked, the scale around the ring chart will not be displayed.
1760 )))
1761 |(% style="width:229px" %)Numerical scale display|(% style="width:846px" %)(((
1762 Whether to display the percentage value of monitoring control point value and quantum value.
1763
1764 If displayed, the scale value is displayed in the middle of the ring chart.
1765 )))
1766 |(% style="width:229px" %)Starting angle|(% style="width:846px" %)(((
1767 Defines the starting angle of the numeric ring of the ring chart. The angle is rotated counterclockwise with the top middle position of the ring chart as the reference point
1768 )))
1769 |(% style="width:229px" %)Circular color|(% style="width:846px" %)The color of the ring segment represented by the monitoring point value.
1770 |(% style="width:229px" %)Background color|(% style="width:846px" %)Ring background color, that is, the background color of the range value ring.
1771 |(% colspan="1" rowspan="4" style="width:229px" %)(((
1772 Alert a(% style="background-color:transparent" %)rea
1773 )))|(% style="width:846px" %)(((
1774 Function description: Divide the ring chart into several areas(1 to 4 areas), each of which can set the style of the partition and the starting value and the ending value of the partition independently.
1775 )))
1776 |(% style="width:846px" %)(((
1777 Alert value: The starting and ending values of the partition. All values need to be limited to upper limit and lower limit of the ring chart, otherwise the partition is invalid.
1778 )))
1779 |(% style="width:846px" %)Alert area color: When the monitoring point value is within a certain partition value range, the ring chart represents the color of the fill area (displayed in solid color).
1780 |(% style="width:846px" %)Note: When the monitoring point value is not in the set partition, the ring chart will display the default color.
1781
1782 === Historical trend chart ===
1783
1784 View the historical data curve of monitoring points by setting the start date and the end date. The change of curve is used to display the data change of each monitoring point, X axis represents the time and Y axis represents the monitoring point value.
1785
1786 |=(% style="width: 236px;" %)**Property**|=(% style="width: 839px;" %)**Description**
1787 |(% style="width:236px" %)Number of curves|(% style="width:839px" %)Set the number of curves to be displayed on the curve object.
1788 |(% style="width:236px" %)Curve type|(% style="width:839px" %)There are 4 optional styles for curve display.
1789 |(% style="width:236px" %)Curve color|(% style="width:839px" %)The color of the curve when it is displayed.
1790 |(% style="width:236px" %)Curve name|(% style="width:839px" %)The name of the curve shown in the graph example on the right side of the curve object.
1791 |(% style="width:236px" %)Bind monitoring point|(% style="width:839px" %)Select the monitoring points that the curve needs to bind.
1792 |(% rowspan="2" style="width:236px" %)(((
1793 Y-axis range
1794 )))|(% style="width:839px" %)Fixed: Set the values of upper limit and lower limit of Y axis to fixed values.
1795 |(% style="width:839px" %)(((
1796 Adaptation: In the set time axis, the upper limit of Y-axis is 20% above the maximum of the monitoring point data, and the lower limit of Y-axis is 20% below the minimum of the monitoring point data
1797 )))
1798 |(% style="width:236px" %)Lower limit of Y-axis|(% style="width:839px" %)When the Y-axis range is fixed, set the minimum value of Y-axis.
1799 |(% style="width:236px" %)Upper limit of Y axis|(% style="width:839px" %)When the Y-axis range is fixed, set the minimum value of Y-axis.
1800 |(% style="width:236px" %)Grid color|(% style="width:839px" %)Sets the color of the graph grid.
1801 |(% style="width:236px" %)Text setting|(% style="width:839px" %)Sets the display style of text in X/Y axis.
1802 |(% style="width:236px" %)Start date|(% style="width:839px" %)Set the start time of the X axis of the graph.
1803 |(% style="width:236px" %)End date|(% style="width:839px" %)Set the end time of the X axis of the graph.
1804 |(% style="width:236px" %)(((
1805 Recent days
1806 )))|(% style="width:839px" %)(((
1807 There are 4 choices (last 1 day, last 7 days, last 30 days, to be selected) for you to filter the time are conveniently and quick, and the corresponding start date and end date will become the current selected last few days. If the selected start and end dates are not within the last 1 day, last 7 days and the last 30 days, the state in recent days will be to be selected.
1808 )))
1809 |(% rowspan="3" style="width:236px" %)(((
1810 Time sequence
1811 )))|(% style="width:839px" %)The time sequence of viewing is divided into two kinds: time ascending and time descending.
1812 |(% style="width:839px" %)(((
1813 Time ascending: The start time is displayed at the left starting point of the X axis, and the time increases from the start time to the end time.
1814 )))
1815 |(% style="width:839px" %)(((
1816 Time descending: The end time is displayed at the left starting point of the X axis, and the time decreases from the end time to the start time.
1817 )))
1818 |(% style="width:236px" %)Date format|(% style="width:839px" %)Sets the display format of X-axis time and date.
1819 |(% style="width:236px" %)Background color of the filter bar|(% style="width:839px" %)Sets the background color of the filter bar row below the chart. There are two kinds of translucent and fully transparent.
1820 |(% style="width:236px" %)Starting color/End color|(% style="width:839px" %)Set the background color of the graph.
1821 |(% style="width:236px" %)Gradient type|(% style="width:839px" %)Sets the gradient type of the background color of the graph.
1822 |(% style="width:236px" %)Transparency settings|(% style="width:839px" %)Set the transparency of the background color of the graph. The larger the value, the more transparent it is.
1823
1824 Property description when browsing the interface:
1825
1826 |=(% style="width: 139px;" %)**Property**|=(% style="width: 682px;" %)**Description**
1827 |(% style="width:139px" %)[[image:image-20220720150850-2.png]]|(% style="width:682px" %)Switch the display mode of historical trend chart data: Curves and tables.
1828 |(% style="width:139px" %)(((
1829 [[image:image-20220720150854-3.png]]
1830 )))|(% style="width:682px" %)(((
1831 The historical trend chart moves forward according to the time span.
1832
1833 Time span: The time period between the end date and the start date.
1834
1835 For example, if the start time and end time are separated by 1 day, the historical trend chart will move forward by 1 day.
1836 )))
1837 |(% style="width:139px" %)(((
1838 [[image:image-20220720150911-4.png]]
1839 )))|(% style="width:682px" %)(((
1840 The historical trend chart moves backward by time span.
1841
1842 Time span: The time period between the end date and the start date.
1843
1844 For example, if the start time and end time are separated by 1 day, the historical trend chart will move back by 1 day.
1845 )))
1846 |(% style="width:139px" %)(((
1847 [[image:image-20220720150920-5.png]]
1848 )))|(% style="width:682px" %)(((
1849 Previous page. When the data from the start time to the end time is displayed in multiple pages, click the previous page to display the historical data of previous page.
1850
1851 You can't click on the previous page when you are on the first page.
1852 )))
1853 |(% style="width:139px" %)(((
1854 [[image:image-20220720150922-6.png]]
1855 )))|(% style="width:682px" %)(((
1856 Next page. Data from start time to end time are displayed in multiple pages. Click next page to display the historical data of next page.
1857
1858 You can't click on the next page when you are on the last page.
1859 )))
1860 |(% style="width:139px" %)(((
1861 [[image:image-20220720150929-7.png]]
1862 )))|(% style="width:682px" %)(((
1863 When the width is less than 683, click to view the current page and how many pieces of data per page and how many pieces of data.
1864 )))
1865 |(% style="width:139px" %)(((
1866 [[image:image-20220720150932-8.png]]
1867 )))|(% style="width:682px" %)(((
1868 Figure: Display the color of this curve correspondingly.
1869
1870 When the data is displayed as "curve": When browsing the interface, clicking on the map will hide the corresponding curve display;
1871
1872 When the data is displayed as "table”: The table only displays the data of one monitoring point, and the data of the first selected monitoring point is displayed by default. Clicking on the figure will switch to the data of the corresponding monitoring point.
1873 )))
1874 |(% style="width:139px" %)[[image:image-20220720150937-9.png]]|(% style="width:682px" %)Historical trend chart query button. Click it to pop-up a pop-up box to set the query range.
1875 |(% style="width:139px" %)[[image:image-20220720151000-10.png]]|(% style="width:682px" %)First page: Clicking this button will return to the first page regardless of the current page.
1876 |(% style="width:139px" %)[[image:image-20220720151016-12.png]]|(% style="width:682px" %)Previous page: Clicking this button will display the data of the previous page.
1877 |(% style="width:139px" %)[[image:image-20220720151025-14.png]]|(% style="width:682px" %)Next page: Clicking this button will display the data of the next page.
1878 |(% style="width:139px" %)[[image:image-20220720151023-13.png]]|(% style="width:682px" %)Last page: Clicking this button to reach the last page regardless of the current page.
1879
1880 == Alarm record display ==
1881
1882 All alarm records generated by the monitoring points set in V-BOX are queried and displayed in a table according to the time sequence, and dynamic query time periods can be set according to the start time and the end time.
1883
1884 |=(% style="width: 258px;" %)**Property**|=(% style="width: 817px;" %)**Description**
1885 |(% style="width:258px" %)Select V-BOX|(% style="width:817px" %)Select the alarm monitoring points under the V-BOX , up to 16 monitoring points can be selected.
1886 |(% style="width:258px" %)Alarm type|(% style="width:817px" %)(((
1887 The alarm mode includes current alarm record and historical alarm record. You could select the corresponding alarm according to your needs.
1888 )))
1889 |(% style="width:258px" %)Alarm level|(% style="width:817px" %)Select the alarm level to display in the table.
1890 |(% style="width:258px" %)Start date|(% style="width:817px" %)Sets the start date of the query.
1891 |(% style="width:258px" %)End date|(% style="width:817px" %)Sets the end date of the query.
1892 |(% style="width:258px" %)Time format|(% style="width:817px" %)Set the alarm time format displayed in the table.
1893 |(% style="width:258px" %)Date format|(% style="width:817px" %)Format the alarm time and date displayed in the table.
1894 |(% rowspan="3" style="width:258px" %)(((
1895 Time sequence
1896 )))|(% style="width:817px" %)The time sequence of viewing is divided into two kinds: time ascending and time descending.
1897 |(% style="width:817px" %)Time ascending: The latest alarm information is at the end of the alarm information displayed bar.
1898 |(% style="width:817px" %)Time descending: The latest alarm information is at the top of the alarm information display bar.
1899 |(% style="width:258px" %)Set the display content|(% style="width:817px" %)Check the information content to be displayed in the alarm record table.
1900 |(% style="width:258px" %)Background color|(% style="width:817px" %)Set the background color of the alarm record display object.
1901 |(% style="width:258px" %)Head color|(% style="width:817px" %)Set the header color of the alarm record display object.
1902 |(% style="width:258px" %)Border color|(% style="width:817px" %)Set the border color of the alarm record display object.
1903 |(% style="width:258px" %)Color of the selected row|(% style="width:817px" %)Set the color of the alarm record display object when each row is selected.
1904 |(% style="width:258px" %)Alarm lamp color|(% style="width:817px" %)Set the alarm lamp color of the alarm record display object.
1905 |(% style="width:258px" %)Header text color|(% style="width:817px" %)Set the header text color of the alarm record display object.
1906 |(% style="width:258px" %)General alarm text color|(% style="width:817px" %)Set the color displayed in the alarm information bar when the alarm level is general alarm.
1907 |(% style="width:258px" %)Severe alarm text color|(% style="width:817px" %)Set the color displayed in the alarm information bar when the alarm level is severe alarm.
1908 |(% style="width:258px" %)(((
1909 Particularly severe alarm text color
1910 )))|(% style="width:817px" %)Set the color displayed in the alarm information bar when the alarm level is particularly severe.
1911 |(% style="width:258px" %)Background color of the filter bar|(% style="width:817px" %)(((
1912 Set the background color of filter bar below the alarm record display object. There are two kinds of translucent and fully transparent.
1913 )))
1914 |(% style="width:258px" %)Transparency settings|(% style="width:817px" %)Set the background color transparency of the alarm record display object. The larger the value, the more transparent it is.
1915 |(% rowspan="3" style="width:258px" %)(((
1916
1917
1918 Cell customization
1919 )))|(% style="width:817px" %)The default is adaptive. After selecting custom, you can set the width of the cell.
1920 |(% style="width:817px" %)Text beyond hiding: After exceeding the custom width, the excess text is hidden.
1921 |(% style="width:817px" %)Text beyond wrap: The text wraps around if it excess the custom width.
1922
1923 == Indirect screen display ==
1924
1925 The specified sub-screen is displayed according to the status of the monitoring point.
1926
1927 |=(% style="width: 246px;" %)**Property**|=(% style="width: 829px;" %)**Description**
1928 |(% rowspan="4" style="width:246px" %)(((
1929 Conditional trigger
1930 )))|(% style="width:829px" %)Select the type of condition displayed on the sub screen: Bit condition, word condition and unconditional.
1931 |(% style="width:829px" %)(((
1932 Bit condition: When the monitoring point is set ON or OFF, the specified sub-screen will be triggered and popped up. When the value of the monitoring point does not meet the set conditions, it is not displayed.
1933 )))
1934 |(% style="width:829px" %)(((
1935 Word condition: When the value of the monitoring point meets the set conditions, the specified will be triggered and popped up. Multiple conditions can be added. The newly added condition is displayed later. If multiple conditions are met at the same time, displays the latest screen specified by a condition. When the value of the monitoring point is not satisfied, it is not displayed.
1936 )))
1937 |(% style="width:829px" %)Unconditional: Always display the specified screen.
1938 |(% style="width:246px" %)Bind monitoring point|(% style="width:829px" %)(((
1939 When the trigger type of condition is bit condition or word condition, the monitoring point should be bound. When the trigger type of condition is unconditional, there is no need to bind monitoring point.
1940 )))
1941 |(% style="width:246px" %)Display title bar|(% style="width:829px" %)(((
1942 Uncheck by default. If checked, the style of the title bar will be displayed. You can enter a title name, and set the background color of the title bar and the font color.
1943 )))
1944 |(% style="width:246px" %)Background display and hide|(% style="width:829px" %)Display and hide the background of the object.
1945 |(% rowspan="2" style="width:246px" %)Display background image|(% style="width:829px" %)Check: The background of indirect screen will be displayed as a picture.
1946 |(% style="width:829px" %)Uncheck: The background of indirect screen will be displayed in solid color.
1947
1948 == Toolbar ==
1949
1950 The toolbar provides a collection of buttons for related operations on canvas and objects.
1951
1952 (% class="wikigeneratedid" id="HDescription" %)
1953 **Description**
1954
1955 Reference objects: Right alignment, left alignment, top alignment, bottom alignment, X-axis alignment, Y-axis alignment, equal width, equal height, equal width and height, horizontal equal spacing and vertical equal spacing buttons in the toolbar are operating on a plurality of selected objects (the objects locked in position do not perform the above operations). When operating, the relevant values of a certain object are taken as operation data, then the object is called a reference object. The control points around the reference object are red points. When you select multiple objects and then click on a object, that object is the reference object. If a object is not clicked, the leftmost object of the selected objects is used as the reference object.
1956
1957 |(% style="width:136px" %)**Toolbar**|(% style="width:200px" %)**Name**|(% style="width:119px" %)**Shortcut key**|(% style="width:620px" %)**Function description**
1958 |(% style="width:136px" %)[[image:image-20220720154713-15.png||height="38" width="38"]]|(% style="width:200px" %)(((
1959
1960
1961 Selection
1962 )))|(% style="width:119px" %) |(% style="width:620px" %)(((
1963 Mouse tool: Click it to select the current part. Hold down the Ctrl key and click on the object. Multiple objects can be selected at the same time. Click the selected object again, then it is deselected.
1964 )))
1965 |(% style="width:136px" %)[[image:image-20220720154716-16.png||height="39" width="39"]]|(% style="width:200px" %)Save|(% style="width:119px" %)Ctrl + S|(% style="width:620px" %)Saves the current canvas.
1966 |(% style="width:136px" %)[[image:image-20220720154723-17.png||height="36" width="36"]]|(% style="width:200px" %)Delete|(% style="width:119px" %)Del|(% style="width:620px" %)Delete selected objects. You can delete multiple selected objects.
1967 |(% style="width:136px" %)[[image:image-20220720154726-18.png||height="29" width="29"]]|(% style="width:200px" %)Copy screen|(% style="width:119px" %) |(% style="width:620px" %)(((
1968 Copies the current screen to another screen (except the screen generated by default).
1969 )))
1970 |(% style="width:136px" %)[[image:image-20220720154728-19.png||height="29" width="29"]]|(% style="width:200px" %)Copy|(% style="width:119px" %)Ctrl + C|(% style="width:620px" %)Multiple selected objects can be copied.
1971 |(% style="width:136px" %)[[image:image-20220720154733-20.png||height="28" width="28"]]|(% style="width:200px" %)Paste|(% style="width:119px" %)Ctrl + V|(% style="width:620px" %)Multiple selected objects copied can be pasted.
1972 |(% style="width:136px" %)[[image:image-20220720154753-21.png||height="28" width="28"]]|(% style="width:200px" %)Multiple copy|(% style="width:119px" %) |(% style="width:620px" %)Multiple objects can be copied according to the input parameters
1973 |(% style="width:136px" %)[[image:image-20220720154757-22.png||height="25" width="22"]]|(% style="width:200px" %) |(% style="width:119px" %) |(% style="width:620px" %)Synchronize the name of V-BOX and monitoring point.
1974 |(% style="width:136px" %)[[image:image-20220720154800-23.png||height="23" width="26"]]|(% style="width:200px" %)Left alignment|(% style="width:119px" %)Alt + l|(% style="width:620px" %)Align to the left with reference to the left edge of the reference object.
1975 |(% style="width:136px" %)[[image:image-20220720154802-24.png||height="24" width="27"]]|(% style="width:200px" %)Right alignment|(% style="width:119px" %)Alt + R|(% style="width:620px" %)Align to the right with reference to the right edge of the reference object.
1976 |(% style="width:136px" %)[[image:image-20220720154814-25.png||height="23" width="24"]]|(% style="width:200px" %)Top alignment|(% style="width:119px" %)Alt + u|(% style="width:620px" %)Align to the top with reference to the upper edge of the reference object.
1977 |(% style="width:136px" %)[[image:image-20220720154819-26.png||height="22" width="23"]]|(% style="width:200px" %)Bottom alignment|(% style="width:119px" %)Alt + d|(% style="width:620px" %)Align to the bottom with reference to the lower edge of the reference object.
1978 |(% style="width:136px" %)[[image:image-20220720154822-27.png||height="23" width="24"]]|(% style="width:200px" %)X-axis alignment|(% style="width:119px" %)Alt + x|(% style="width:620px" %)Align with reference to the midline of the height of the reference object.
1979 |(% style="width:136px" %)[[image:image-20220720154825-28.png||height="25" width="25"]]|(% style="width:200px" %)Y-axis alignment|(% style="width:119px" %)Alt + y|(% style="width:620px" %)Align with reference to the midline of the width of the reference object.
1980 |(% style="width:136px" %)[[image:image-20220720154829-29.png||height="24" width="24"]]|(% style="width:200px" %)Equal width|(% style="width:119px" %)Alt + w|(% style="width:620px" %)Set the width of the selected object, taking the width of the reference object as the operating value.
1981 |(% style="width:136px" %)[[image:image-20220720154834-30.png||height="25" width="25"]]|(% style="width:200px" %)Equal height|(% style="width:119px" %)Alt + h|(% style="width:620px" %)Set the height of the selected object, taking the height of the reference object as the operating value.
1982 |(% style="width:136px" %)[[image:image-20220720154836-31.png||height="25" width="25"]]|(% style="width:200px" %)Equal width and height|(% style="width:119px" %)Alt + e|(% style="width:620px" %)(((
1983 Set the width and the height of the selected object, taking he width and the height of the reference object as the operating value.
1984 )))
1985 |(% style="width:136px" %)[[image:image-20220720154839-32.png||height="26" width="28"]]|(% style="width:200px" %)Equal horizontal spacing|(% style="width:119px" %)Alt + a|(% style="width:620px" %)Set equal horizontal spacing between selected objects.
1986 |(% style="width:136px" %)[[image:image-20220720154900-33.png||height="26" width="28"]]|(% style="width:200px" %)Equal vertical spacing|(% style="width:119px" %)Alt + V|(% style="width:620px" %)Set equal vertical spacing between selected objects.
1987 |(% style="width:136px" %)[[image:image-20220720154904-34.png||height="24" width="26"]]|(% style="width:200px" %)Place at the top|(% style="width:119px" %) |(% style="width:620px" %)Place the selected object on top of the other objects.
1988 |(% style="width:136px" %)[[image:image-20220720154908-35.png||height="25" width="27"]]|(% style="width:200px" %)Place at the bottom|(% style="width:119px" %) |(% style="width:620px" %)Place the selected object at the bottom of other objects.
1989 |(% style="width:136px" %)[[image:image-20220720154914-36.png||height="21" width="29"]]|(% style="width:200px" %)Undo|(% style="width:119px" %)Ctrl + Z|(% style="width:620px" %)Take the operation of the current screen back one step.
1990 |(% style="width:136px" %)[[image:image-20220720154922-37.png||height="22" width="30"]]|(% style="width:200px" %)Restore|(% style="width:119px" %)Ctrl + R|(% style="width:620px" %)Restore the operation one step forward after undoing the current screen.
1991 |(% style="width:136px" %)[[image:image-20220720154926-38.png||height="27" width="29"]]|(% style="width:200px" %)Settings|(% style="width:119px" %)Alt + m|(% style="width:620px" %)Properties of the current screen.
1992 |(% style="width:136px" %)[[image:image-20220720154930-39.png]]|(% style="width:200px" %)Browse|(% style="width:119px" %) |(% style="width:620px" %)(((
1993 Browse the current project configuration screen, and the default home page is the top column in the table of project screen.
1994 )))
1995 |(% style="width:136px" %)[[image:image-20220720154933-40.png||height="28" width="30"]]|(% style="width:200px" %)(((
1996 One-click to display and hide the tex
1997 )))|(% style="width:119px" %) |(% style="width:620px" %)One-click to display and hide the text of the display box in the current screen.
1998 |(% style="width:136px" %)[[image:image-20220720154947-41.png||height="31" width="33"]]|(% style="width:200px" %)Import template|(% style="width:119px" %) |(% style="width:620px" %)Imports the designed configuration screen template for the current screen.
1999 |(% style="width:136px" %)(((
2000 [[image:image-20220720154953-42.png||height="26" width="26"]]
2001 )))|(% style="width:200px" %)Check|(% style="width:119px" %) |(% style="width:620px" %)(((
2002 Check the integrity of the configuration information of project objects, and display error messages at the bottom of the screen.
2003 )))
2004 |(% style="width:136px" %)[[image:image-20220720155009-43.png||height="26" width="26"]]|(% style="width:200px" %)Zoom in canvas|(% style="width:119px" %)Ctrl + +|(% style="width:620px" %)Zoom in on the current canvas.
2005 |(% style="width:136px" %)[[image:image-20220720155013-44.png||height="26" width="26"]]|(% style="width:200px" %)Canvas restoration|(% style="width:119px" %)Ctrl + )|(% style="width:620px" %)Restores the current canvas.
2006 |(% style="width:136px" %)[[image:image-20220720155016-45.png||height="27" width="27"]]|(% style="width:200px" %)Zoom out canvas|(% style="width:119px" %)Ctrl +-|(% style="width:620px" %)Zoom out the current canvas.
2007 |(% style="width:136px" %)[[image:image-20220720155019-46.png||height="27" width="32"]]|(% style="width:200px" %)Export|(% style="width:119px" %) |(% style="width:620px" %)Export the current project.
2008 |(% style="width:136px" %)[[image:image-20220720155114-47.png||height="27" width="31"]]|(% style="width:200px" %)Import|(% style="width:119px" %) |(% style="width:620px" %)Import an external project into the current project.
2009 |(% style="width:136px" %)[[image:image-20220720155117-48.png||height="28" width="119"]]|(% style="width:200px" %)Status|(% style="width:119px" %) |(% style="width:620px" %)(((
2010 Browses the styles for the current status of a object with multi-state in the current screen.
2011 )))
2012 |(% style="width:136px" %)[[image:image-20220720155120-49.png||height="33" width="115"]]|(% style="width:200px" %)Language|(% style="width:119px" %) |(% style="width:620px" %)Browses the current language of the multilingual object in the current screen.
2013 |(% style="width:136px" %)[[image:image-20220720155123-50.png]]|(% style="width:200px" %)Font size|(% style="width:119px" %) |(% style="width:620px" %)Sets the text font size of the selected object.
2014 |(% style="width:136px" %)[[image:image-20220720155131-51.png]]|(% style="width:200px" %)Font color|(% style="width:119px" %) |(% style="width:620px" %)Sets the text font color of the selected object.
2015 |(% style="width:136px" %)[[image:image-20220720155135-52.png||height="33" width="31"]]|(% style="width:200px" %)Bold|(% style="width:119px" %)Ctrl + B|(% style="width:620px" %)Sets the text font weight of the selected part.
2016 |(% style="width:136px" %)[[image:image-20220720155142-53.png||height="31" width="19"]]|(% style="width:200px" %)Italic|(% style="width:119px" %)Ctrl + i|(% style="width:620px" %)Sets the font text italic of the selected object.
2017 |(% style="width:136px" %)[[image:image-20220720155146-54.png||height="35" width="30"]]|(% style="width:200px" %)Underline|(% style="width:119px" %)Ctrl + U|(% style="width:620px" %)Sets the text font underline of the selected object.
2018 |(% style="width:136px" %)[[image:image-20220720155150-55.png||height="28" width="35"]]|(% style="width:200px" %)Horizontal left alignment|(% style="width:119px" %)Shift + L|(% style="width:620px" %)Sets the selected object text to horizontal left alignment
2019 |(% style="width:136px" %)[[image:image-20220720155153-56.png||height="26" width="31"]]|(% style="width:200px" %)Horizontal center alignment|(% style="width:119px" %)Shift + C|(% style="width:620px" %)Sets the selected object text to horizontal center alignment.
2020 |(% style="width:136px" %)[[image:image-20220720155155-57.png||height="26" width="34"]]|(% style="width:200px" %)Horizontal right alignment|(% style="width:119px" %)Shift + R|(% style="width:620px" %)Sets the selected object text to horizontal right alignment.
2021 |(% style="width:136px" %)[[image:image-20220720155158-58.png||height="29" width="27"]]|(% style="width:200px" %)Vertical top alignment|(% style="width:119px" %)Shift + U|(% style="width:620px" %)Sets the selected object text to vertical top alignment.
2022 |(% style="width:136px" %)(((
2023 [[image:image-20220720155201-59.png||height="32" width="30"]]
2024
2025
2026 )))|(% style="width:200px" %)Vertical center alignment|(% style="width:119px" %)Shift + M|(% style="width:620px" %)Sets the selected object text to vertical center alignment.
2027 |(% style="width:136px" %)(((
2028 [[image:image-20220720155204-60.png||height="27" width="25"]]
2029
2030
2031 )))|(% style="width:200px" %)Vertical bottom alignment|(% style="width:119px" %)Shift + D|(% style="width:620px" %)Sets the selected object text to vertical bottom alignment.
2032
2033 == Indirect screen display ==
2034
2035 The specified sub-screen is displayed according to the status of the monitoring point.
2036
2037 |=(% style="width: 246px;" %)**Property**|=(% style="width: 829px;" %)**Description**
2038 |(% rowspan="4" style="width:246px" %)(((
2039 Conditional trigger
2040 )))|(% style="width:829px" %)Select the type of condition displayed on the sub screen: Bit condition, word condition and unconditional.
2041 |(% style="width:829px" %)(((
2042 Bit condition: When the monitoring point is set ON or OFF, the specified sub-screen will be triggered and popped up. When the value of the monitoring point does not meet the set conditions, it is not displayed.
2043 )))
2044 |(% style="width:829px" %)(((
2045 Word condition: When the value of the monitoring point meets the set conditions, the specified will be triggered and popped up. Multiple conditions can be added. The newly added condition is displayed later. If multiple conditions are met at the same time, displays the latest screen specified by a condition. When the value of the monitoring point is not satisfied, it is not displayed.
2046 )))
2047 |(% style="width:829px" %)Unconditional: Always display the specified screen.
2048 |(% style="width:246px" %)Bind monitoring point|(% style="width:829px" %)(((
2049 When the trigger type of condition is bit condition or word condition, the monitoring point should be bound. When the trigger type of condition is unconditional, there is no need to bind monitoring point.
2050 )))
2051 |(% style="width:246px" %)Display title bar|(% style="width:829px" %)(((
2052 Uncheck by default. If checked, the style of the title bar will be displayed. You can enter a title name, and set the background color of the title bar and the font color.
2053 )))
2054 |(% style="width:246px" %)Background display and hide|(% style="width:829px" %)Display and hide the background of the object.
2055 |(% rowspan="2" style="width:246px" %)Display background image|(% style="width:829px" %)Check: The background of indirect screen will be displayed as a picture.
2056 |(% style="width:829px" %)Uncheck: The background of indirect screen will be displayed in solid color.
2057
2058 == Toolbar ==
2059
2060 The toolbar provides a collection of buttons for related operations on canvas and objects.
2061
2062 (% class="wikigeneratedid" id="HDescription" %)
2063 **Description**
2064
2065 Reference objects: Right alignment, left alignment, top alignment, bottom alignment, X-axis alignment, Y-axis alignment, equal width, equal height, equal width and height, horizontal equal spacing and vertical equal spacing buttons in the toolbar are operating on a plurality of selected objects (the objects locked in position do not perform the above operations). When operating, the relevant values of a certain object are taken as operation data, then the object is called a reference object. The control points around the reference object are red points. When you select multiple objects and then click on a object, that object is the reference object. If a object is not clicked, the leftmost object of the selected objects is used as the reference object.
2066
2067 |**Toolbar**|**Name**|**Shortcut key**|**Function description**
2068 |(((
2069
2070
2071 [[image:file:///C:\Users\Administrator\AppData\Local\Temp\ksohtml\wpsAEFC.tmp.jpg]]
2072 )))|(((
2073
2074
2075 Selection
2076 )))| |(((
2077 Mouse tool: Click it to select the current part. Hold down the Ctrl key and click on the object. Multiple objects can be selected at the same time. Click the selected object again, then it is deselected.
2078
2079
2080 )))
2081 |[[image:file:///C:\Users\Administrator\AppData\Local\Temp\ksohtml\wpsAEFD.tmp.jpg]]|Save|Ctrl + S|Saves the current canvas.
2082 |[[image:file:///C:\Users\Administrator\AppData\Local\Temp\ksohtml\wpsAF0E.tmp.jpg]]|Delete|Del|Delete selected objects. You can delete multiple selected objects.
2083 |(((
2084
2085
2086 [[image:file:///C:\Users\Administrator\AppData\Local\Temp\ksohtml\wpsAF0F.tmp.png]]
2087 )))|Copy screen| |(((
2088 Copies the current screen to another screen (except the screen generated by default).
2089
2090
2091 )))
2092
2093 |(% rowspan="29" %) |[[image:file:///C:\Users\Administrator\AppData\Local\Temp\ksohtml\wpsAF10.tmp.jpg]]|Copy|Ctrl + C|Multiple selected objects can be copied.|(% rowspan="29" %)
2094 |[[image:file:///C:\Users\Administrator\AppData\Local\Temp\ksohtml\wpsAF11.tmp.jpg]]|Paste|Ctrl + V|Multiple selected objects copied can be pasted.
2095 |[[image:file:///C:\Users\Administrator\AppData\Local\Temp\ksohtml\wpsAF12.tmp.jpg]]|Multiple copy| |Multiple objects can be copied according to the input parameters
2096 |[[image:file:///C:\Users\Administrator\AppData\Local\Temp\ksohtml\wpsAF13.tmp.jpg]]| | |Synchronize the name of V-BOX and monitoring point.
2097 |(((
2098
2099
2100 [[image:file:///C:\Users\Administrator\AppData\Local\Temp\ksohtml\wpsAF14.tmp.jpg]]
2101 )))|Left alignment|Alt + l|Align to the left with reference to the left edge of the reference object.
2102 |(((
2103
2104
2105 [[image:file:///C:\Users\Administrator\AppData\Local\Temp\ksohtml\wpsAF15.tmp.jpg]]
2106 )))|Right alignment|Alt + R|Align to the right with reference to the right edge of the reference object.
2107 |(((
2108
2109
2110 [[image:file:///C:\Users\Administrator\AppData\Local\Temp\ksohtml\wpsAF16.tmp.jpg]]
2111 )))|Top alignment|Alt + u|Align to the top with reference to the upper edge of the reference object.
2112 |(((
2113
2114
2115 [[image:file:///C:\Users\Administrator\AppData\Local\Temp\ksohtml\wpsAF26.tmp.jpg]]
2116 )))|Bottom alignment|Alt + d|Align to the bottom with reference to the lower edge of the reference object.
2117 |(((
2118
2119
2120 [[image:file:///C:\Users\Administrator\AppData\Local\Temp\ksohtml\wpsAF27.tmp.jpg]]
2121 )))|X-axis alignment|Alt + x|Align with reference to the midline of the height of the reference object.
2122 |(((
2123
2124
2125 [[image:file:///C:\Users\Administrator\AppData\Local\Temp\ksohtml\wpsAF28.tmp.jpg]]
2126 )))|Y-axis alignment|Alt + y|Align with reference to the midline of the width of the reference object.
2127 |(((
2128
2129
2130 [[image:file:///C:\Users\Administrator\AppData\Local\Temp\ksohtml\wpsAF29.tmp.jpg]]
2131 )))|Equal width|Alt + w|Set the width of the selected object, taking the width of the reference object as the operating value.
2132 |(((
2133
2134
2135 [[image:file:///C:\Users\Administrator\AppData\Local\Temp\ksohtml\wpsAF2A.tmp.jpg]]
2136 )))|Equal height|Alt + h|Set the height of the selected object, taking the height of the reference object as the operating value.
2137 |(((
2138
2139
2140 [[image:file:///C:\Users\Administrator\AppData\Local\Temp\ksohtml\wpsAF2B.tmp.jpg]]
2141 )))|Equal width and height|Alt + e|(((
2142 Set the width and the height of the selected object, taking he width and the height of the reference object as the operating value.
2143
2144
2145 )))
2146 |(((
2147
2148
2149 [[image:file:///C:\Users\Administrator\AppData\Local\Temp\ksohtml\wpsAF2C.tmp.jpg]]
2150 )))|Equal horizontal spacing|Alt + a|Set equal horizontal spacing between selected objects.
2151 |(((
2152
2153
2154 [[image:file:///C:\Users\Administrator\AppData\Local\Temp\ksohtml\wpsAF3D.tmp.jpg]]
2155 )))|Equal vertical spacing|Alt + V|Set equal vertical spacing between selected objects.
2156 |(((
2157
2158
2159 [[image:file:///C:\Users\Administrator\AppData\Local\Temp\ksohtml\wpsAF3E.tmp.jpg]]
2160 )))|Place at the top| |Place the selected object on top of the other objects.
2161 |(((
2162
2163
2164 [[image:file:///C:\Users\Administrator\AppData\Local\Temp\ksohtml\wpsAF3F.tmp.jpg]]
2165 )))|Place at the bottom| |Place the selected object at the bottom of other objects.
2166 |(((
2167
2168
2169 [[image:file:///C:\Users\Administrator\AppData\Local\Temp\ksohtml\wpsAF40.tmp.jpg]]
2170 )))|Undo|Ctrl + Z|Take the operation of the current screen back one step.
2171 |(((
2172
2173
2174 [[image:file:///C:\Users\Administrator\AppData\Local\Temp\ksohtml\wpsAF41.tmp.jpg]]
2175 )))|Restore|Ctrl + R|Restore the operation one step forward after undoing the current screen.
2176 |(((
2177
2178
2179 [[image:file:///C:\Users\Administrator\AppData\Local\Temp\ksohtml\wpsAF42.tmp.jpg]]
2180 )))|Settings|Alt + m|Properties of the current screen.
2181 |(((
2182
2183
2184 [[image:file:///C:\Users\Administrator\AppData\Local\Temp\ksohtml\wpsAF43.tmp.jpg]]
2185 )))|Browse| |(((
2186 Browse the current project configuration screen, and the default home page is the top column in the table of project screen.
2187
2188
2189 )))
2190 |(((
2191
2192
2193 [[image:file:///C:\Users\Administrator\AppData\Local\Temp\ksohtml\wpsAF44.tmp.jpg]]
2194 )))|(((
2195 One-click to display and hide the text
2196
2197
2198 )))| |One-click to display and hide the text of the display box in the current screen.
2199 |[[image:file:///C:\Users\Administrator\AppData\Local\Temp\ksohtml\wpsAF45.tmp.jpg]]|Import template| |Imports the designed configuration screen template for the current screen.
2200 |(((
2201
2202
2203 [[image:file:///C:\Users\Administrator\AppData\Local\Temp\ksohtml\wpsAF46.tmp.jpg]]
2204 )))|Check| |(((
2205 Check the integrity of the configuration information of project objects, and display error messages at the bottom of the screen.
2206
2207
2208 )))
2209 |(((
2210
2211
2212 [[image:file:///C:\Users\Administrator\AppData\Local\Temp\ksohtml\wpsAF47.tmp.jpg]]
2213 )))|Zoom in canvas|Ctrl + +|Zoom in on the current canvas.
2214 |(((
2215
2216
2217 [[image:file:///C:\Users\Administrator\AppData\Local\Temp\ksohtml\wpsAF48.tmp.jpg]]
2218 )))|Canvas restoration|Ctrl + )|Restores the current canvas.
2219 |(((
2220
2221
2222 [[image:file:///C:\Users\Administrator\AppData\Local\Temp\ksohtml\wpsAF49.tmp.jpg]]
2223 )))|Zoom out canvas|Ctrl +-|Zoom out the current canvas.
2224 |[[image:file:///C:\Users\Administrator\AppData\Local\Temp\ksohtml\wpsAF5A.tmp.jpg]]|Export| |Export the current project.
2225 |[[image:file:///C:\Users\Administrator\AppData\Local\Temp\ksohtml\wpsAF5B.tmp.jpg]]|Import| |Import an external project into the current project.
2226
2227 |(% rowspan="13" %) |(((
2228
2229
2230 [[image:file:///C:\Users\Administrator\AppData\Local\Temp\ksohtml\wpsAF5C.tmp.png]]
2231 )))|Status| |(((
2232 Browses the styles for the current status of a object with multi-state in the current screen.
2233
2234
2235 )))|(% rowspan="13" %)
2236 |(((
2237
2238
2239 [[image:file:///C:\Users\Administrator\AppData\Local\Temp\ksohtml\wpsAF5D.tmp.png]]
2240 )))|Language| |Browses the current language of the multilingual object in the current screen.
2241 |[[image:file:///C:\Users\Administrator\AppData\Local\Temp\ksohtml\wpsAF5E.tmp.png]]|Font size| |Sets the text font size of the selected object.
2242 |[[image:file:///C:\Users\Administrator\AppData\Local\Temp\ksohtml\wpsAF5F.tmp.jpg]]|Font color| |Sets the text font color of the selected object.
2243 |[[image:file:///C:\Users\Administrator\AppData\Local\Temp\ksohtml\wpsAF60.tmp.jpg]]|Bold|Ctrl + B|Sets the text font weight of the selected part.
2244 |[[image:file:///C:\Users\Administrator\AppData\Local\Temp\ksohtml\wpsAF61.tmp.jpg]]|Italic|Ctrl + i|Sets the font text italic of the selected object.
2245 |[[image:file:///C:\Users\Administrator\AppData\Local\Temp\ksohtml\wpsAF62.tmp.jpg]]|Underline|Ctrl + U|Sets the text font underline of the selected object.
2246 |(((
2247
2248
2249 [[image:file:///C:\Users\Administrator\AppData\Local\Temp\ksohtml\wpsAF63.tmp.jpg]]
2250 )))|Horizontal left alignment|Shift + L|Sets the selected object text to horizontal left alignment
2251 |[[image:file:///C:\Users\Administrator\AppData\Local\Temp\ksohtml\wpsAF64.tmp.jpg]]|Horizontal center alignment|Shift + C|Sets the selected object text to horizontal center alignment.
2252 |(((
2253
2254
2255 [[image:file:///C:\Users\Administrator\AppData\Local\Temp\ksohtml\wpsAF65.tmp.jpg]]
2256 )))|Horizontal right alignment|Shift + R|Sets the selected object text to horizontal right alignment.
2257 |(((
2258
2259
2260 [[image:file:///C:\Users\Administrator\AppData\Local\Temp\ksohtml\wpsAF66.tmp.jpg]]
2261 )))|Vertical top alignment|Shift + U|Sets the selected object text to vertical top alignment.
2262 |(((
2263
2264
2265 [[image:file:///C:\Users\Administrator\AppData\Local\Temp\ksohtml\wpsAF67.tmp.jpg]]
2266 )))|Vertical center alignment|Shift + M|Sets the selected object text to vertical center alignment.
2267 |(((
2268
2269
2270 [[image:file:///C:\Users\Administrator\AppData\Local\Temp\ksohtml\wpsAF77.tmp.jpg]]
2271 )))|Vertical bottom alignment|Shift + D|Sets the selected object text to vertical bottom alignment.
2272
2273 |=**Item**|=**Description**
2274 |Monitoring Point|Set operating address for this object (Read and write can be different);
2275 |Read-write permission|There are three modes for it, users could select according to requirements;
2276 |Set Text|It is used for setting style of text and display direction
2277 |Style|It is used for setting object display, like background color;
2278 |Expansion|It is used for setting expansion function, like lock position;
2279 |Display|It is used for setting object position and size
2280
2281 * **Bit /Word Indicator**
2282
2283 Indicator could monitor and display the specified PLC or HMI bit address, and its state changes according to the specified address value.
2284
2285 (((
2286 |**Items**|**Description**
2287 |Monitor Point|Set reading address for this object;
2288 |Status|Set text for every status;
2289 |Picture|Set picture for every status;
2290 |Expansion|Set display expansion function, such as blink
2291 |Display|Set object position and size
2292 )))
2293
2294 * **Bit/ Word Switch**
2295
2296 Switch could operate the specified PLC or HMI bit address, and its state changes according to the specified address value.
2297
2298 (((
2299 |**Items**|**Description**
2300 |Monitor Point|Set operating address for this object (Read and write can be different);
2301 |Read-write permission|There are three modes for it, users could select according to requirements;
2302 |Pop up a confirmation box|Check it to enable confirmation box for operating;
2303 |Status|Set text for every status;
2304 |Picture|Set picture for every status;
2305 |Expansion|Set display expansion function, such as blink
2306 |Display|Set object position and size
2307 )))
2308
2309 * **Dashboard**
2310
2311 Display the value of address in real time using the dashboard.
2312
2313 (((
2314 |**Items**|**Description**
2315 |Monitor Point|Set operating address for this object (Read and write can be different);
2316 |Select|Set dashboard display range, there are two modes, Constant and Variable
2317 |Scale value|Check it to display value;
2318 |Select Language|Set text for object;
2319 |Style|Set object display style such as color, scales number;
2320 |Alarm Zone|Set range and color for alarm
2321 |Display|Set object position and size
2322 )))
2323
2324 * **Bar graph**
2325
2326 Use the length or height of the rectangle to reflect the value of reading address so that the value could be visualized.
2327
2328 (((
2329 |**Items**|**Description**
2330 |Monitor Point|Set operating address for this object (Read and write can be different);
2331 |Digit Display|Check it to display digit value on bar;
2332 |Progress bar direction|Select display direction;
2333 |Scales|Set object scales display type and color;
2334 |Bar color|Set color for bar;
2335 |Background Display|Set color of bar background;
2336 |Alarm Zone|Set range and color for alarm
2337 |Display|Set object position and size
2338 )))
2339
2340 * **Real-Time Trend Chart**
2341
2342 Use the curve to show the trend of the data over time. X-axis is time, Y-axis is variable.
2343
2344 (((
2345 |**Items**|**Description**
2346 |Monitor Point|Set operating address for this object (Read and write can be different);
2347 |Digit Display|Check it to display digit value on bar;
2348 |Progress bar direction|Select display direction;
2349 |Scales|Set object scales display type and color;
2350 |Bar color|Set color for bar;
2351 |Background Display|Set color of bar background;
2352 |Alarm Zone|Set range and color for alarm
2353 |Display|Set object position and size
2354 | |
2355 )))
2356
2357 * **Flow pipe**
2358
2359 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;
2360
2361 (((
2362 |**Items**|**Description**
2363 |Border color|Set object background color;
2364 |Color|Set flowing block color;
2365 |Speed|Three modes for flowing block speed;
2366 |Flow direction|Two modes for flowing direction;
2367 |Monitor Point|Set trigger address;
2368 |Trigger Condition|(((
2369 Bit address: Select ON or OFF;
2370
2371 Word address: Set value range;
2372 )))
2373 |Color Block Width|Set flowing block size;
2374 |Color Block Length|Set flowing block size;
2375 |Color Block Spacing|Set the spacing between flow blocks;
2376 |Display Border|Select display or hide border;
2377 |Alarm Zone|Set range and color for alarm
2378 |Display|Set object position and size
2379 )))
2380
2381 **Tips for designing flow bar**
2382
2383 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.
2384
2385 * **Video object**
2386
2387 Video object is used for playing the video file provided in the video source.
2388
2389 (((
2390 |**Items**|**Description**
2391 |Border color|Set object background color;
2392 |Color|Set flowing block color;
2393 |Speed|Three modes for flowing block speed;
2394 |Flow direction|Two modes for flowing direction;
2395 |Monitor Point|Set trigger address;
2396 |Trigger Condition|(((
2397 Bit address: Select ON or OFF;
2398
2399 Word address: Set value range;
2400 )))
2401 |Color Block Width|Set flowing block size;
2402 |Color Block Length|Set flowing block size;
2403 |Color Block Spacing|Set the spacing between flow blocks;
2404 |Display Border|Select display or hide border;
2405 |Alarm Zone|Set range and color for alarm
2406 |Display|Set object position and size
2407 )))
2408
2409 * **Hyperlink**
2410
2411 The object for link website;
2412
2413 (((
2414 |=**Items**|=**Description**
2415 |Link address|Enter website;
2416 |Open with|There are two options, user could select open with new window or current window;
2417 |Select Language|One object could support three language, user could enter text for note object;
2418 |Style|Set object display style such as color, use picture as background or not
2419 |Display|Set object position and size
2420 )))
2421
2422 * **Function Switch**
2423
2424 Function switch is designed to switch screens, and call and close sub screen.
2425
2426 (((
2427 |=**Items**|=**Description**
2428 |Screen|Select the target screen for switch;
2429 |Sub-screen|There are two options, user could select open with new window or current window;
2430 |Previous|Switch to the previous screen
2431 |Next|Switch to the next screen
2432 |Return|Return to the screen before switch
2433 |Text|Set text for object, including text font, color direction and so on;
2434 |Style|Set object display style such as color, use picture as background or not
2435 |Display|Set object position and size
2436 )))
2437
2438 * **Combination Switch**
2439
2440 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.
2441
2442 (((
2443 |=**Items**|=**Description**
2444 |Bit operation|It provides [Bit copy], [Set ON], [Set OFF], [Switch] and [Bit Copy] functions.
2445 |Word operation|It provides [Word copy], [Word set], [Increase] and [Decrease] functions,
2446 |Arithmetic|[Add], [Subtract], [Multiply] and [Divide] functions
2447 |Screen change|It provides screen switch function as [Function Switch], it supports [Previous], [Next], [Return], [Change to], and open, close sub-screen operations
2448 |Delete|Delete selected item function;
2449 |Empty|Delete all items in operation list;
2450 |Up|Move the selected item up one row in operation list;
2451 |Down|Move the selected item down one row in operation list;
2452 )))
2453
2454 **Time**
2455
2456 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.
2457
2458 (((
2459 |=**Items**|=**Description**
2460 |Monitoring box|Link a box for the time part
2461 |Pattern|Two types, one is digit and the other is clock
2462 |Format settings|Set format for time and date in digit pattern
2463 |Background|Set display or hide background of object
2464 |Set text|Set text display style;
2465 |Display|Set object position and size
2466 )))
2467
2468 **Histogram**
2469
2470 It is used for display more than one tag value in Bar graph format.
2471
2472 (((
2473 |=**Items**|=**Description**
2474 |Add new group|Maximum is 8, add items for this object, also set colors
2475 |Add monitoring point|Set read tag for every item,
2476 |Style|Set object display style such as color, use picture as background or not
2477 |Display|Set object position and size
2478 )))
2479
2480 **Alarm record display**
2481
2482 It is used for display alarm information of V-BOX. It can support current and history alarm.
2483
2484 (((
2485 |=**Items**|=**Description**
2486 |Select box|Link to V-BOX
2487 |Alarm type|Select current alarm or history alarm or all
2488 |Start date|Alarm display start date
2489 |End date|Alarm display end date
2490 |Format|Set display format for date and time
2491 |Sequence|It provides two type, one is order, and the other is reverse order
2492 |Display content|Users could select display contents by check them
2493 |Style|Set colors for different parts
2494 |Display|Set object position and size
2495 )))
2496
2497 **History trend chart**
2498
2499 The history trend will display data record with graph. X axis represents as time, and Y axis represents as data.
2500
2501 (((
2502 |=(% colspan="2" %)**Items**|=**Description**
2503 |(% colspan="2" %)Basic|Set numbers of curve in object and select style for every curves including color, link tag
2504 |(% rowspan="11" %)Style|Display form|Two type, one is curve, and the other is table
2505 |Start date|Start date of history data
2506 |End date|End date of history data
2507 |Format|Time and date format for display
2508 |Sequence|Two types, order or reverse order
2509 |Y range|Two types, fixed and adaptive
2510 |Set text|Set font size, color and other styles.
2511 |Transparency|Set transparency of object
2512 |Background color|Two types, translucent or transparent
2513 |Gradient way|Set display way and color
2514 |Display bar|Check it to display screen bar
2515 |(% colspan="2" %)Display|Set object position and size
2516 )))
2517
2518 **Indirect screen display**
2519
2520 This object is used for calling screens when condition is met.
2521
2522 (((
2523 |=(% colspan="2" %)**Items**|=**Description**
2524 |(% rowspan="4" %)Basic|Conditional trigger|It provides bit, word condition and unconditional
2525 |Bind monitoring point|Link to tag for triggering
2526 |Trigger condition|for bit address, it requires ON or OFF, for word address, different value corresponds to different screens.
2527 |Designated screen|Only for bit address as trigger. When condition is met, display this screen
2528 |(% colspan="2" %)Style|Set object display style such as display title bar or display or hide background
2529 |(% colspan="2" %)Display|Set object position and size
2530 )))
2531
2532 **Ring chart**
2533
2534 Display value as ring chart
2535
2536 (((
2537 |=(% colspan="2" %)**Items**|=**Description**
2538 |(% rowspan="7" %)Basic|Monitor point|Link to tag for data reading
2539 |Range|Set fixed range or variable range
2540 |Scales|Set scales such as major and minor numbers, colors and so on
2541 |Designated screen|Only for bit address as trigger. When condition is met, display this screen
2542 |Numerical scale display|Check it to display scale
2543 |Start angle|Set start angle for scale
2544 |Color|Color setting for bar and background
2545 |(% colspan="2" %)Alarm Zone|Set alarm range and colors
2546 |(% colspan="2" %)Display|Set object position and size
2547 )))
2548
2549 **Pie chart**
2550
2551 Display more than one value in one pie chart
2552
2553 (((
2554 |=(% colspan="2" %)**Items**|=**Description**
2555 |(% colspan="2" %)Monitor point|Add read addresses, the maximum is 8
2556 |(% rowspan="3" %)Style|Pattern|Set alarm range and colors
2557 |Numerical scale|Check it to display value in object
2558 |Monitoring name display|Check it to display name in object
2559 |(% colspan="2" %)Display|Set object position and size
2560 )))
2561
2562 == **6.5 Tool bar** ==
2563
2564 The toolbar has the same function as the tool list. (right-click on the canvas to pop up tool list)
2565
2566 (((
2567 |=**Tool**|=**Description**
2568 |[[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.
2569 |[[image:V-BOX cloud configuration user manual_html_867a000ba1161424.png||height="21" width="69" class="img-thumbnail"]]|Save current canvas
2570 |[[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.
2571 |[[image:V-BOX cloud configuration user manual_html_e5d36271faf64986.png||height="21" width="73" class="img-thumbnail"]]|Copy the selected parts.
2572 |[[image:V-BOX cloud configuration user manual_html_97033b77500d6b5e.png||height="21" width="75" class="img-thumbnail"]]|Paste the selected parts
2573 |[[image:V-BOX cloud configuration user manual_html_53bc6f617b145720.png||height="22" width="148" class="img-thumbnail"]]|The property of the current screen
2574 |[[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
2575 |[[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.
2576 |[[image:V-BOX cloud configuration user manual_html_6aae3377add443ff.png||height="38" width="150" class="img-thumbnail"]]|Align left edge of multiple parts
2577 |[[image:V-BOX cloud configuration user manual_html_dc8fb256a13e2f91.png||height="40" width="150" class="img-thumbnail"]]|Align right edge of multiple parts
2578 |[[image:V-BOX cloud configuration user manual_html_bec295f2d25219f9.png||height="39" width="150" class="img-thumbnail"]]|Align top edge of multiple parts
2579 |[[image:V-BOX cloud configuration user manual_html_4a0c10157943d534.png||height="39" width="150" class="img-thumbnail"]]|Align bottom edge of multiple parts
2580 |[[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
2581 |[[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
2582 )))
2583
2584 (((
2585 = **7 Authority** =
2586 )))
2587
2588 Click the Authority management on the left menu to enter the Authority management module, as Figure 7-1 shows.
2589
2590 [[image:1617949992819-138.png||class="img-thumbnail"]]
2591
2592 Figure 7 ‑11
2593
2594 This module is used for assigning project and configuring permissions for sub-accounts.
2595
2596 **1)How to assign project for sub-account**
2597
2598 * 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.
2599 * 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.
2600
2601 (% style="text-align:center" %)
2602 [[image:1617934946822-979.png||height="421" width="800" class="img-thumbnail"]]
2603
2604 Figure 7 ‑2
2605
2606 (% style="text-align:center" %)
2607 [[image:1617950026178-538.png||height="375" width="600" class="img-thumbnail"]]
2608
2609 Figure 7 ‑3
2610
2611 **2)How to unassigned project for sub-account**
2612
2613 In the list of assigned projects in the sub-account, click “Unbind Project” to unbind the project for the account.
2614
2615 = **8 Demo account** =
2616
2617 **1)What is Cloud SCADA platform?**
2618
2619 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.
2620
2621 **2)How to access?**
2622
2623 Asean URL: [[http:~~/~~/asean.v-box.net/web/htmlnew/user/login.html>>url:http://asean.v-box.net/web/htmlnew/user/login.html]]
2624
2625 Asean account&password: weconuser 123123
2626
2627 EU URL: [[http:~~/~~/eu.v-box.net/web/htmlnew/user/login.html>>url:http://eu.v-box.net/web/htmlnew/user/login.html]]
2628
2629 EU account&password: weconuser weconuser123
2630 **✎Note1: **users can edit Cloud SCADA project freely, and the modified results will not be saved.
2631
2632 **✎Note2: **users can enter the Cloud SCADA page by clicking the following positions:
2633
2634 (% style="text-align:center" %)
2635 [[image:1648577581177-590.png||height="408" width="800" class="img-thumbnail"]]
2636
2637 **3)Industry classification**
2638
2639 There are 20 Cloud SCADA projects created in demo account, including HVAC system, water treatment system, smart farm, smart factory and smart city.
2640
2641 (% style="text-align:center" %)
2642 [[image:1648577644453-821.png||height="377" width="800" class="img-thumbnail"]]
2643
2644 **4)Part of the project introduction**
2645
2646 4.1 Heating Monitoring System
2647
2648 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.
2649
2650 (% style="text-align:center" %)
2651 [[image:1648577724164-599.png||height="393" width="800" class="img-thumbnail"]]
2652
2653 (% style="text-align:center" %)
2654 [[image:1648577744837-247.png||height="450" width="800" class="img-thumbnail"]]
2655
2656 4.2 Water Treatment System
2657
2658 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.
2659
2660 (% style="text-align:center" %)
2661 [[image:1648577778435-311.png||height="450" width="800" class="img-thumbnail"]]
2662
2663 4.3 Smart City Monitoring
2664
2665 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.
2666
2667 (% style="text-align:center" %)
2668 [[image:1648577825813-481.png||height="452" width="800" class="img-thumbnail"]]
2669
2670 (% style="text-align:center" %)
2671 [[image:1648577843849-690.png||height="452" width="800" class="img-thumbnail"]]
2672
2673 4.4 Smart Building Monitoring
2674
2675 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.
2676
2677 (% style="text-align:center" %)
2678 [[image:1648577874801-932.png||height="408" width="800" class="img-thumbnail"]]
2679
2680 (% style="text-align:center" %)
2681 [[image:1648577894932-957.png||height="408" width="800" class="img-thumbnail"]]