Changes for page 5. Diagrams Development Manual
Last modified by Iaroslav Platonov on 2026/06/08 10:32
Summary
-
Page properties (1 modified, 0 added, 0 removed)
Details
- Page properties
-
- Content
-
... ... @@ -1,7 +1,5 @@ 1 1 = CONTENT = 2 2 3 -{{toc/}} 4 - 5 5 = 1. INTRODUCTION = 6 6 7 7 CENTO is a multifunctional software platform for data collection, processing, and display. ... ... @@ -360,13 +360,13 @@ 360 360 361 361 If the objects on the diagram differ from those placed in the category, clicking **Select all similar elements** pops up a message as in Fig. 4.14. 362 362 363 -[[image:Screenshot 2025-12-04 at 13.11.47.png ||height="504" width="369"]]361 +[[image:Screenshot 2025-12-04 at 13.11.47.png]] 364 364 365 365 Figure 4.14. Selecting similar elements is not available 366 366 367 367 == 4.6. Auto-replace of colors used in diagrams == 368 368 369 -[[image:Screenshot 2025-12-04 at 13.12.37.png ||height="408" width="581"]]367 +[[image:Screenshot 2025-12-04 at 13.12.37.png]] 370 370 371 371 Figure 4.15. Color replacement modal window 372 372 ... ... @@ -374,7 +374,7 @@ 374 374 375 375 == 4.7. Setting up an animation frame for technological events associated with a diagram object == 376 376 377 -[[image:Screenshot 2025-12-04 at 13.13.43.png ||height="311" width="582"]]375 +[[image:Screenshot 2025-12-04 at 13.13.43.png]] 378 378 379 379 Figure 4.16. Scheme settings modal window 380 380 ... ... @@ -393,7 +393,7 @@ 393 393 394 394 The default chart template is in a custom category named **Charts.** To use it, move it to the diagram canvas (see Fig. 4.17). 395 395 396 -[[image:Screenshot 2025-12-04 at 13.15.15.png ||height="291" width="582"]]394 +[[image:Screenshot 2025-12-04 at 13.15.15.png]] 397 397 398 398 Figure 4.17. Charts object 399 399 ... ... @@ -405,7 +405,7 @@ 405 405 406 406 Fig. 4.18 shows an example of configuring the tag value chart display 407 407 408 -[[image:Screenshot 2025-12-04 at 13.16.36.png ||height="532" width="452"]]406 +[[image:Screenshot 2025-12-04 at 13.16.36.png]] 409 409 410 410 Figure 4.18. Edit data of chart modal window 411 411 ... ... @@ -424,7 +424,7 @@ 424 424 425 425 When filling in the chart settings, the data is displayed as shown below: 426 426 427 -[[image:Screenshot 2025-12-04 at 13.18.01.png ||height="269" width="559"]]425 +[[image:Screenshot 2025-12-04 at 13.18.01.png]] 428 428 429 429 Figure 4.19. Chart in the diagram viewer 430 430 ... ... @@ -432,7 +432,7 @@ 432 432 433 433 === 4.8.2. Charts of tag values selected on the diagram === 434 434 435 -[[image:Screenshot 2025-12-04 at 13.18.57.png ||height="599" width="559"]]433 +[[image:Screenshot 2025-12-04 at 13.18.57.png]] 436 436 437 437 Figure 4.20. Edit the data of the chart 438 438 ... ... @@ -449,13 +449,13 @@ 449 449 450 450 When the chart settings are configured as shown in Fig. 4.20, data in view mode is displayed only after a linked tag is left-clicked. Each additional selected tag plots its own chart (see Fig. 4.21). 451 451 452 -[[image:Screenshot 2025-12-04 at 13.19.47.png ||height="257" width="551"]]450 +[[image:Screenshot 2025-12-04 at 13.19.47.png]] 453 453 454 454 Figure 4.21. Chart in the diagram viewer 455 455 456 456 === 4.8.3. Displaying future data on charts === 457 457 458 -[[image:Screenshot 2025-12-04 at 13.20.34.png ||height="502" width="386"]]456 +[[image:Screenshot 2025-12-04 at 13.20.34.png]] 459 459 460 460 Figure 4.22. Edit the data of the chart 461 461 ... ... @@ -469,13 +469,13 @@ 469 469 470 470 This data, displayed on the charts, enables forecasting, comparing planned vs. actual performance at the enterprise, and similar analyses. 471 471 472 -[[image:Screenshot 2025-12-04 at 13.21.50.png ||height="262" width="548"]]470 +[[image:Screenshot 2025-12-04 at 13.21.50.png]] 473 473 474 474 Figure 4.23. Forecasting chart 475 475 476 476 == 4.9. Setting up level indicators == 477 477 478 -[[image:Screenshot 2025-12-04 at 13.23.18.png ||height="309" width="333"]]476 +[[image:Screenshot 2025-12-04 at 13.23.18.png]] 479 479 480 480 Figure 4.24. Water level parameter output 481 481 ... ... @@ -487,7 +487,7 @@ 487 487 * Click on the **Setting up rules** icon [[image:Screenshot 2025-12-04 at 13.24.08.png||height="20" width="24"]] 488 488 * In the window that opens (see Fig. 4.25), the** Condition** and **Action** fields need to be filled in for the rule. If highlighting areas based on specific conditions is not required, the **Condition **field can be left empty – in this case, the rendered object is to be displayed using the color specified in the **Action** field. 489 489 490 -[[image:Screenshot 2025-12-04 at 13.24.38.png||height=" 186" width="634"]]488 +[[image:Screenshot 2025-12-04 at 13.24.38.png||height="202" width="691"]] 491 491 492 492 Figure 4.25. Setting the fill depending on the values 493 493 ... ... @@ -511,7 +511,7 @@ 511 511 512 512 To edit the properties of an object, right-click on it and select the **Edit data of the element.** The **Edit data of element **modal window is shown in Fig. 4.26. 513 513 514 -[[image:Screenshot 2025-12-04 at 13.26.04.png ||height="361" width="873"]]512 +[[image:Screenshot 2025-12-04 at 13.26.04.png]] 515 515 516 516 Figure 4.26. Edit the data of the element 517 517 ... ... @@ -524,7 +524,7 @@ 524 524 1. The// Disable context menus, posters, animations// attribute disables animation for such an element if the event is triggered not by changing it, but by changing another attribute included in this object, but if the triggered event relates to this attribute, then animation will work for it. In Fig. 4.27, the dedicated switch is linked to ID 13939, the element TO is linked to the same ID, it is located in the measurements of the object (Activation of the TO). If the **Disable context menus, posters, animations** field is disabled, the TO element will flash at any event related to the object with ID 13939. For the "TO" to flash only at an event that relates to this parameter, the TO element should turn it on. 525 525 1. The //Disable context menus, posters, animations// attribute also disables all context menus that are available to the object, but only measurements remain. In Fig. 3.27, the dedicated switch is linked to ID 13939, the element TO is bound to the same ID, it is located in the measurements of the object (Activation of the TO). If an IM element does not include the// Disable context menus, posters, animations //attribute, then all context menus from the switch are to be available to it. 526 526 527 -[[image:Screenshot 2025-12-04 at 13.27.06.png ||height="376" width="875"]]525 +[[image:Screenshot 2025-12-04 at 13.27.06.png]] 528 528 529 529 Figure 4. 27. Disabling context menus, posters, and animations attribute 530 530 ... ... @@ -531,13 +531,13 @@ 531 531 * **Disabling graphic animation** helps smooth the transition (rotations, offsets, and other geometric changes) of active or dynamic objects from one state to another in the diagram viewing mode. 532 532 * **Enabling element backlight **allows turning on the element highlighting when hovering in the diagram viewer (see Fig. 4.28), which allows the user to determine which diagram objects are active. 533 533 534 -[[image:Screenshot 2025-12-04 at 13.28.03.png ||height="232" width="328"]]532 +[[image:Screenshot 2025-12-04 at 13.28.03.png]] 535 535 536 536 Figure 4.28. Highlighting of an active element of the diagram 537 537 538 538 * **The hidden element** allows adjusting the visibility/invisibility of rendered objects in the diagram viewer. As soon as any object with this setting appears, a button [[image:Screenshot 2025-12-04 at 13.28.37.png||height="26" width="24"]], which hides such an object appears in the viewer in the upper-right corner. Clicking on it displays the diagram object and shows the button like this [[image:Screenshot 2025-12-04 at 13.29.19.png||height="23" width="25"]]. 539 539 540 -[[image:Screenshot 2025-12-04 at 13.29.40.png ||height="225" width="329"]]538 +[[image:Screenshot 2025-12-04 at 13.29.40.png]] 541 541 542 542 Figure 4.29. Highlighting and hiding the active element of the diagram 543 543 ... ... @@ -551,7 +551,7 @@ 551 551 552 552 In the **Measurements (left click)** field, left-click can adjust the number of rows and columns in the table. Fig. 4.30 shows an example of a two-column table. 553 553 554 -[[image:Screenshot 2025-12-04 at 13.30.35.png ||height="333" width="328"]]552 +[[image:Screenshot 2025-12-04 at 13.30.35.png]] 555 555 556 556 Figure 4.30. Changing the view of the measurement table 557 557 ... ... @@ -561,7 +561,7 @@ 561 561 562 562 To quickly manage tags using manual input, a template is provided, which is located in the user category //Manual input.// To use this object, drag it to the diagram canvas (see Fig. 4.31). 563 563 564 -[[image:Screenshot 2025-12-04 at 13.31.44.png ||height="335" width="661"]]562 +[[image:Screenshot 2025-12-04 at 13.31.44.png]] 565 565 566 566 Figure 4.31. Manual input object 567 567 ... ... @@ -827,7 +827,7 @@ 827 827 1. Blocking changes to a layer from the list. 828 828 1. Foreground/background of the layer. 829 829 830 -== 4.21. Active SVG elements == 828 +== 4.21. Active SVG elements == 831 831 832 832 The diagram editor allows importing graphic element templates in SVG format from various sources. Developed animated images from external sources help optimize work in both view and edit modes of the diagram (see Section 4.22.1). They also enable monitoring technological processes with the ability to view moving and rotating objects on the diagram (see Section 4.22.2). 833 833 ... ... @@ -1048,7 +1048,7 @@ 1048 1048 1049 1049 Select the text on the diagram, which is to be a dynamic parameter, and open the window [[image:Screenshot 2025-12-04 at 14.39.54.png||height="28" width="29"]]. 1050 1050 1051 -In the rule, check the box next to the words** Without conditions** (1) (optional) and describe the first action. Mark the**Text** field, select the **Tag** parameter type (2) and write, for example, the ID=502001 (3) number from the database (or select it from the drop-down list (4) see Fig. 5.2), if it is necessary to round the values, enable rounding (5) and specify how many decimal places should be displayed. It is possible to format the text in the actions of the rules (6) (see Fig. 5.3), as well as output the value of the number in exponential form (7). Click **Save,** switch to the diagram [[image:Screenshot 2025-12-04 at 14.40.43.png||height="24" width="31"]]viewing mode and see the result (see Fig. 5.4).1049 +In the rule, check the box next to the words** Without conditions** (1) (optional) and describe the first action. Mark the** Text** field, select the **Tag** parameter type (2) and write, for example, the ID=502001 (3) number from the database (or select it from the drop-down list (4) see Fig. 5.2), if it is necessary to round the values, enable rounding (5) and specify how many decimal places should be displayed. It is possible to format the text in the actions of the rules (6) (see Fig. 5.3), as well as output the value of the number in exponential form (7). Click **Save,** switch to the diagram [[image:Screenshot 2025-12-04 at 14.40.43.png||height="24" width="31"]]viewing mode and see the result (see Fig. 5.4). 1052 1052 1053 1053 [[image:Screenshot 2025-12-04 at 14.41.18.png]] 1054 1054 ... ... @@ -1155,7 +1155,7 @@ 1155 1155 1156 1156 9 – Status is missing. 1157 1157 1158 - The device is bound to the diagram by selecting **Device status** from the menu item. The content of the rules is similar to the example described above with changing the color of an object (in the** Condition** field, select the desired type of parameter, specify the device address, specify the operator and enter a numeric value equal to one or another status, and then specify the **Action **to be applied to the condition being fulfilled, for example, see Fig. 5.11).1156 + The device is bound to the diagram by selecting **Device status** from the menu item. The content of the rules is similar to the example described above with changing the color of an object (in the** Condition** field, select the desired type of parameter, specify the device address, specify the operator and enter a numeric value equal to one or another status, and then specify the **Action **to be applied to the condition being fulfilled, for example, see Fig. 5.11). 1159 1159 1160 1160 [[image:Screenshot 2025-12-04 at 14.49.03.png]] 1161 1161 ... ... @@ -1169,7 +1169,7 @@ 1169 1169 1170 1170 For example, create a square element (to serve as a switch) and describe the rules for it. In this example, the square changes the background color depending on the incoming parameter of the information model object, which refers to the value from the CENTO database. 1171 1171 1172 -The sequence of bindings to the parameters of an information model object is like the actions for binding to tags: instead of **Tag value** and **Tag status,** select the** IM attribute** and **IM parameter status**, see Fig. 5.12.1170 +The sequence of bindings to the parameters of an information model object is like the actions for binding to tags: instead of **Tag value** and **Tag status,** select the** IM attribute** and **IM parameter status**, see Fig. 5.12. 1173 1173 1174 1174 [[image:Screenshot 2025-12-04 at 14.50.40.png]] 1175 1175