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,5 +1,7 @@ 1 1 = CONTENT = 2 2 3 +{{toc/}} 4 + 3 3 = 1. INTRODUCTION = 4 4 5 5 CENTO is a multifunctional software platform for data collection, processing, and display. ... ... @@ -358,13 +358,13 @@ 358 358 359 359 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. 360 360 361 -[[image:Screenshot 2025-12-04 at 13.11.47.png]] 363 +[[image:Screenshot 2025-12-04 at 13.11.47.png||height="504" width="369"]] 362 362 363 363 Figure 4.14. Selecting similar elements is not available 364 364 365 365 == 4.6. Auto-replace of colors used in diagrams == 366 366 367 -[[image:Screenshot 2025-12-04 at 13.12.37.png]] 369 +[[image:Screenshot 2025-12-04 at 13.12.37.png||height="408" width="581"]] 368 368 369 369 Figure 4.15. Color replacement modal window 370 370 ... ... @@ -372,7 +372,7 @@ 372 372 373 373 == 4.7. Setting up an animation frame for technological events associated with a diagram object == 374 374 375 -[[image:Screenshot 2025-12-04 at 13.13.43.png]] 377 +[[image:Screenshot 2025-12-04 at 13.13.43.png||height="311" width="582"]] 376 376 377 377 Figure 4.16. Scheme settings modal window 378 378 ... ... @@ -391,7 +391,7 @@ 391 391 392 392 The default chart template is in a custom category named **Charts.** To use it, move it to the diagram canvas (see Fig. 4.17). 393 393 394 -[[image:Screenshot 2025-12-04 at 13.15.15.png]] 396 +[[image:Screenshot 2025-12-04 at 13.15.15.png||height="291" width="582"]] 395 395 396 396 Figure 4.17. Charts object 397 397 ... ... @@ -403,7 +403,7 @@ 403 403 404 404 Fig. 4.18 shows an example of configuring the tag value chart display 405 405 406 -[[image:Screenshot 2025-12-04 at 13.16.36.png]] 408 +[[image:Screenshot 2025-12-04 at 13.16.36.png||height="532" width="452"]] 407 407 408 408 Figure 4.18. Edit data of chart modal window 409 409 ... ... @@ -422,7 +422,7 @@ 422 422 423 423 When filling in the chart settings, the data is displayed as shown below: 424 424 425 -[[image:Screenshot 2025-12-04 at 13.18.01.png]] 427 +[[image:Screenshot 2025-12-04 at 13.18.01.png||height="269" width="559"]] 426 426 427 427 Figure 4.19. Chart in the diagram viewer 428 428 ... ... @@ -430,7 +430,7 @@ 430 430 431 431 === 4.8.2. Charts of tag values selected on the diagram === 432 432 433 -[[image:Screenshot 2025-12-04 at 13.18.57.png]] 435 +[[image:Screenshot 2025-12-04 at 13.18.57.png||height="599" width="559"]] 434 434 435 435 Figure 4.20. Edit the data of the chart 436 436 ... ... @@ -447,13 +447,13 @@ 447 447 448 448 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). 449 449 450 -[[image:Screenshot 2025-12-04 at 13.19.47.png]] 452 +[[image:Screenshot 2025-12-04 at 13.19.47.png||height="257" width="551"]] 451 451 452 452 Figure 4.21. Chart in the diagram viewer 453 453 454 454 === 4.8.3. Displaying future data on charts === 455 455 456 -[[image:Screenshot 2025-12-04 at 13.20.34.png]] 458 +[[image:Screenshot 2025-12-04 at 13.20.34.png||height="502" width="386"]] 457 457 458 458 Figure 4.22. Edit the data of the chart 459 459 ... ... @@ -467,13 +467,13 @@ 467 467 468 468 This data, displayed on the charts, enables forecasting, comparing planned vs. actual performance at the enterprise, and similar analyses. 469 469 470 -[[image:Screenshot 2025-12-04 at 13.21.50.png]] 472 +[[image:Screenshot 2025-12-04 at 13.21.50.png||height="262" width="548"]] 471 471 472 472 Figure 4.23. Forecasting chart 473 473 474 474 == 4.9. Setting up level indicators == 475 475 476 -[[image:Screenshot 2025-12-04 at 13.23.18.png]] 478 +[[image:Screenshot 2025-12-04 at 13.23.18.png||height="309" width="333"]] 477 477 478 478 Figure 4.24. Water level parameter output 479 479 ... ... @@ -485,7 +485,7 @@ 485 485 * Click on the **Setting up rules** icon [[image:Screenshot 2025-12-04 at 13.24.08.png||height="20" width="24"]] 486 486 * 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. 487 487 488 -[[image:Screenshot 2025-12-04 at 13.24.38.png||height=" 202" width="691"]]490 +[[image:Screenshot 2025-12-04 at 13.24.38.png||height="186" width="634"]] 489 489 490 490 Figure 4.25. Setting the fill depending on the values 491 491 ... ... @@ -509,7 +509,7 @@ 509 509 510 510 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. 511 511 512 -[[image:Screenshot 2025-12-04 at 13.26.04.png]] 514 +[[image:Screenshot 2025-12-04 at 13.26.04.png||height="361" width="873"]] 513 513 514 514 Figure 4.26. Edit the data of the element 515 515 ... ... @@ -522,7 +522,7 @@ 522 522 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. 523 523 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. 524 524 525 -[[image:Screenshot 2025-12-04 at 13.27.06.png]] 527 +[[image:Screenshot 2025-12-04 at 13.27.06.png||height="376" width="875"]] 526 526 527 527 Figure 4. 27. Disabling context menus, posters, and animations attribute 528 528 ... ... @@ -529,13 +529,13 @@ 529 529 * **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. 530 530 * **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. 531 531 532 -[[image:Screenshot 2025-12-04 at 13.28.03.png]] 534 +[[image:Screenshot 2025-12-04 at 13.28.03.png||height="232" width="328"]] 533 533 534 534 Figure 4.28. Highlighting of an active element of the diagram 535 535 536 536 * **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"]]. 537 537 538 -[[image:Screenshot 2025-12-04 at 13.29.40.png]] 540 +[[image:Screenshot 2025-12-04 at 13.29.40.png||height="225" width="329"]] 539 539 540 540 Figure 4.29. Highlighting and hiding the active element of the diagram 541 541 ... ... @@ -549,7 +549,7 @@ 549 549 550 550 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. 551 551 552 -[[image:Screenshot 2025-12-04 at 13.30.35.png]] 554 +[[image:Screenshot 2025-12-04 at 13.30.35.png||height="333" width="328"]] 553 553 554 554 Figure 4.30. Changing the view of the measurement table 555 555 ... ... @@ -559,13 +559,13 @@ 559 559 560 560 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). 561 561 562 -[[image:Screenshot 2025-12-04 at 13.31.44.png]] 564 +[[image:Screenshot 2025-12-04 at 13.31.44.png||height="335" width="661"]] 563 563 564 564 Figure 4.31. Manual input object 565 565 566 566 The manual input object removed from the category (see Fig. 4.31) visually looks like a picture that can be expanded in width and height. All other settings can be found in the **Editing manual input** modal window (see Fig. 4.32), which is available by right-clicking on the object and selecting the **Editing manual input **menu. 567 567 568 -[[image:Screenshot 2025-12-04 at 13.32.15.png]] 570 +[[image:Screenshot 2025-12-04 at 13.32.15.png||height="221" width="488"]] 569 569 570 570 Figure 4.32. Editing the manual input window 571 571 ... ... @@ -574,17 +574,17 @@ 574 574 * **Tag** drop-down list for selecting a binding to a tag or IM attribute; 575 575 * **Tag ID** drop-down list for binding to the tag ID or to the IM object, and its attribute. 576 576 577 -[[image:Screenshot 2025-12-04 at 13.32.50.png]] 579 +[[image:Screenshot 2025-12-04 at 13.32.50.png||height="346" width="492"]] 578 578 579 579 Figure 4.33. Binding the tag to the manual input object 580 580 581 -[[image:Screenshot 2025-12-04 at 13.33.15.png]] 583 +[[image:Screenshot 2025-12-04 at 13.33.15.png||height="354" width="492"]] 582 582 583 583 Figure 4.34. Binding to the attribute of the IM object 584 584 585 585 Figs. 4.33 and 4.34 show examples of binding, which, when viewed in the diagram, appear as shown in Fig. 4.35. 586 586 587 -[[image:Screenshot 2025-12-04 at 13.33.48.png]] 589 +[[image:Screenshot 2025-12-04 at 13.33.48.png||height="236" width="490"]] 588 588 589 589 Figure 4.35. Viewing a diagram with manual input objects 590 590 ... ... @@ -612,13 +612,13 @@ 612 612 613 613 Fig. 4.37 shows an example of a drawn button. When left-clicked in view mode, it inputs a fixed value of 900 for the tag with ID 9001. 614 614 615 -[[image:Screenshot 2025-12-04 at 13.38.45.png]] 617 +[[image:Screenshot 2025-12-04 at 13.38.45.png||height="220" width="577"]] 616 616 617 617 Figure 4.37. Manual input value button 618 618 619 619 == 4.13. Links to external sources of information/to a local server, as well as to other diagrams. == 620 620 621 -[[image:Screenshot 2025-12-04 at 13.39.27.png]] 623 +[[image:Screenshot 2025-12-04 at 13.39.27.png||height="267" width="954"]] 622 622 623 623 Figure 4.38. Adding links 624 624 ... ... @@ -634,7 +634,7 @@ 634 634 635 635 For the **Open over the mnemonic scheme** option, the zoom setting for the page to open is available. By default, the zoom is set to 30%. An example of clicking on a link over the mnemonic scheme is shown in Fig. 4.39. 636 636 637 -[[image:Screenshot 2025-12-04 at 13.40.17.png]] 639 +[[image:Screenshot 2025-12-04 at 13.40.17.png||height="406" width="929"]] 638 638 639 639 Figure 4.39. Clicking on a link over the mnemonic scheme 640 640 ... ... @@ -650,17 +650,17 @@ 650 650 651 651 Fig. 4.40 shows an example of selecting tags from the real-time data section. The opened modal window displays the interface of this page with trees of devices, objects, statuses, and time on the left side. To create a link from the diagram, the appropriate tree and relevant tags should be selected, then the desired tab – **Real-time data, Chart**, or **Table** – should be specified on the right side, followed by clicking the button [[image:Screenshot 2025-12-04 at 13.41.45.png||height="19" width="30"]]. 652 652 653 -[[image:Screenshot 2025-12-04 at 13.42.18.png]] 655 +[[image:Screenshot 2025-12-04 at 13.42.18.png||height="499" width="925"]] 654 654 655 655 Figure 4.40. Tag selection window in Real-time data analysis 656 656 657 657 The link to the selected tags in **Real-time data analysis** appears as a string (see Fig. 4.41), which can be copied or deleted. 658 658 659 -[[image:Screenshot 2025-12-04 at 13.42.58.png]] 661 +[[image:Screenshot 2025-12-04 at 13.42.58.png||height="43" width="560"]] 660 660 661 661 Figure 4.41. Link in Real-time data analysis 662 662 663 -[[image:Screenshot 2025-12-04 at 13.43.35.png]] 665 +[[image:Screenshot 2025-12-04 at 13.43.35.png||height="472" width="926"]] 664 664 665 665 Figure 4.42. Opening the Link in Real-time data analysis over the diagram 666 666 ... ... @@ -672,23 +672,23 @@ 672 672 673 673 The portable grounding is enabled in Settings > Diagrams > Edit > Extras > Scheme settings (see Fig. 4.43). 674 674 675 -[[image:Screenshot 2025-12-04 at 13.44.28.png]] 677 +[[image:Screenshot 2025-12-04 at 13.44.28.png||height="506" width="922"]] 676 676 677 677 Figure 4.43. Enabling portable grounding 678 678 679 679 If this option is enabled, then the grounding [[image:Screenshot 2025-12-04 at 13.45.01.png||height="24" width="24"]] button appears on the right side of the screen in the diagram viewing mode. Right-clicking on it opens a menu for setting the size and color of the portable grounding icon (see Fig. 4.44) to be applied to portable groundings on all diagrams including those previously installed. 680 680 681 -[[image:Screenshot 2025-12-04 at 13.45.24.png]] 683 +[[image:Screenshot 2025-12-04 at 13.45.24.png||height="197" width="311"]] 682 682 683 683 Figure 4.44. Portable grounding settings 684 684 685 -[[image:Screenshot 2025-12-04 at 13.45.53.png]] 687 +[[image:Screenshot 2025-12-04 at 13.45.53.png||height="228" width="416"]] 686 686 687 687 Figure 4.45. Installation of portable grounding 688 688 689 689 When installing a portable grounding on a diagram element, select the object from the drop-down list (see Fig. 4.45) and, if necessary, write a comment, then click Install. After installation, left-click on the grounding icon and view its information (see Fig. 4.46), as well as data on groundings installed appear in the technological and operational logs. 690 690 691 -[[image:Screenshot 2025-12-04 at 13.46.24.png]] 693 +[[image:Screenshot 2025-12-04 at 13.46.24.png||height="91" width="413"]] 692 692 693 693 Figure 4.46. Information on the installed portable grounding 694 694 ... ... @@ -698,19 +698,19 @@ 698 698 699 699 To set up the line style, press Alt+Shift+D on the keyboard and right-click on any part of the diagram, then select **Convert lines.** After converting styles, disable this mode with the same key combination. 700 700 701 -[[image:Screenshot 2025-12-04 at 13.47.20.png]] 703 +[[image:Screenshot 2025-12-04 at 13.47.20.png||height="434" width="452"]] 702 702 703 703 Figure 4.47. Highlighting of connected lines 704 704 705 705 == 4.16. Outputting numbers in exponential form on the diagram == 706 706 707 -[[image:Screenshot 2025-12-04 at 13.48.10.png]] 709 +[[image:Screenshot 2025-12-04 at 13.48.10.png||height="303" width="987"]] 708 708 709 709 Figure 4.48. Enabling the exponential form of the number 710 710 711 711 The display of the values of the associated parameters in the actions of the rules can be represented in exponential form by enabling the **Exponential form** switch as in Fig. 4.48. The data in diagram viewing mode is to be displayed as shown in Fig. 4.49. 712 712 713 -[[image:Screenshot 2025-12-04 at 13.49.12.png]] 715 +[[image:Screenshot 2025-12-04 at 13.49.12.png||height="48" width="162"]] 714 714 715 715 Figure 4.49. Displaying a number in exponential form 716 716 ... ... @@ -718,7 +718,7 @@ 718 718 719 719 In the settings [[image:Screenshot 2025-12-04 at 13.50.03.png]] , in diagram view mode, instant tag values can be displayed as delimited values. This setting is enabled by default (see Fig. 4.50). 720 720 721 -[[image:Screenshot 2025-12-04 at 13.50.42.png]] 723 +[[image:Screenshot 2025-12-04 at 13.50.42.png||height="358" width="379"]] 722 722 723 723 Figure 4.50. Displaying delimited values 724 724 ... ... @@ -728,25 +728,25 @@ 728 728 729 729 Fig. 4.51 shows an example of binding the metering channel (power A+) of a device with ID 100063. 730 730 731 -[[image:Screenshot 2025-12-04 at 13.51.42.png]] 733 +[[image:Screenshot 2025-12-04 at 13.51.42.png||height="278" width="987"]] 732 732 733 733 Figure 4.51. Binding the metering channel 734 734 735 735 The channel value in the view mode is displayed for the last time interval, see Fig. 4.52. 736 736 737 -[[image:Screenshot 2025-12-04 at 13.52.24.png]] 739 +[[image:Screenshot 2025-12-04 at 13.52.24.png||height="607" width="539"]] 738 738 739 739 Figure 4.52. Value of the metering channel 740 740 741 741 Metering channel data can be displayed in tabular form, which is selected from the top horizontal menu by clicking the **Table** icon. 742 742 743 -[[image:Screenshot 2025-12-04 at 13.52.57.png]] 745 +[[image:Screenshot 2025-12-04 at 13.52.57.png||height="279" width="173"]] 744 744 745 745 Figure 4.53. Table 746 746 747 747 Fig. 4.53 shows the table. To render it on the diagram, the number of rows, columns, and title (if required) should be selected. To use this template for displaying metering channel values, it needs to be edited by right-clicking and selecting **Table editor **in the menu. Fig. 4.54 shows an example of table configuration, and Fig. 4.55 demonstrates data display in the diagram viewer. 748 748 749 -[[image:Screenshot 2025-12-04 at 14.07.04.png]] 751 +[[image:Screenshot 2025-12-04 at 14.07.04.png||height="302" width="902"]] 750 750 751 751 Figure 4.54. Metering channel binding 752 752 ... ... @@ -763,9 +763,9 @@ 763 763 * **Width **is the column width. 764 764 * **Change time **is a system field used to display the time of the metering channel's value change. 765 765 766 -Rows in this table can be moved [[image:Screenshot 2025-12-04 at 14.08.30.png]], deleted [[image:Screenshot 2025-12-04 at 14.09.56.png||height="32" width="33"]], and added [[image:Screenshot 2025-12-04 at 14.10.25.png||height="31" width="89"]] .768 +Rows in this table can be moved [[image:Screenshot 2025-12-04 at 14.08.30.png]], deleted [[image:Screenshot 2025-12-04 at 14.09.56.png||height="32" width="33"]], and added [[image:Screenshot 2025-12-04 at 14.10.25.png||height="31" width="89"]] 767 767 768 -[[image:Screenshot 2025-12-04 at 14.10.47.png]] 770 +[[image:Screenshot 2025-12-04 at 14.10.47.png||height="322" width="637"]] 769 769 770 770 Figure 4.55. Display of metering channel data 771 771 ... ... @@ -785,23 +785,23 @@ 785 785 786 786 Images need to be placed on the diagram objects, and in the **Component visual settings** window [[image:Screenshot 2025-12-04 at 14.12.20.png||height="22" width="26"]], the tag ID should be specified in the actions, which triggers the color change upon tag value modification (see example in Fig. 4.57). 787 787 788 -[[image:Screenshot 2025-12-04 at 14.13.22.png]] 790 +[[image:Screenshot 2025-12-04 at 14.13.22.png||height="560" width="742"]] 789 789 790 790 Figure 4.57. Binding to the tag ID 791 791 792 792 After arranging and binding such sensors, select those elements (might be selected together with other graphic objects), the area inside which changes colors according to changes in the linked tags in the rules. Then click **Create heatmap** (see Fig. 4.58). 793 793 794 -[[image:Screenshot 2025-12-04 at 14.13.52.png]] 796 +[[image:Screenshot 2025-12-04 at 14.13.52.png||height="713" width="455"]] 795 795 796 796 Figure 4.58. Create heatmap 797 797 798 798 The created heatmap can be edited by right-clicking on the **Heatmap properties** (see Fig. 4.56). The modal window specifies the high and low limits, the normal value, the gamma (the range of colors for building a heatmap), the power parameter (the temperature for building transitions between temperatures), and the ability to display only those points that exceed the temperature in normal mode, see Fig. 4.60. 799 799 800 -[[image:Screenshot 2025-12-04 at 14.14.27.png]] 802 +[[image:Screenshot 2025-12-04 at 14.14.27.png||height="594" width="448"]] 801 801 802 802 Figure 4.59. Editing heatmap properties 803 803 804 -[[image:Screenshot 2025-12-04 at 14.14.52.png]] 806 +[[image:Screenshot 2025-12-04 at 14.14.52.png||height="442" width="853"]] 805 805 806 806 Figure 4.60. Heatmap 807 807 ... ... @@ -811,7 +811,7 @@ 811 811 812 812 To switch to the layer mode, go to the View > Layers in the upper horizontal menu (Ctrl+Shift+L). 813 813 814 -[[image:Screenshot 2025-12-04 at 14.15.37.png]] 816 +[[image:Screenshot 2025-12-04 at 14.15.37.png||height="412" width="405"]] 815 815 816 816 Figure 4.61. Layers menu 817 817 ... ... @@ -825,7 +825,7 @@ 825 825 1. Blocking changes to a layer from the list. 826 826 1. Foreground/background of the layer. 827 827 828 -== 4.21. Active SVG elements ==830 +== 4.21. Active SVG elements == 829 829 830 830 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). 831 831 ... ... @@ -835,29 +835,29 @@ 835 835 836 836 The loading of items is in the **Extras** menu item (see Fig. 4.62). 837 837 838 -[[image:Screenshot 2025-12-04 at 14.17.19.png]] 840 +[[image:Screenshot 2025-12-04 at 14.17.19.png||height="508" width="326"]] 839 839 840 840 Figure 4.62. Import animated SVGs 841 841 842 842 Ready-made templates should be uploaded to the **Import animated SVG**s menu (see Fig. 4.63). 843 843 844 -[[image:Screenshot 2025-12-04 at 14.17.47.png]] 846 +[[image:Screenshot 2025-12-04 at 14.17.47.png||height="156" width="322"]] 845 845 846 846 Figure 4.63. Import animated SVGs 847 847 848 848 The template uploaded in Fig. 4.64 replaces drawing of many graphic elements created in the diagram editor. 849 849 850 -[[image:Screenshot 2025-12-04 at 14.18.12.png]] 852 +[[image:Screenshot 2025-12-04 at 14.18.12.png||height="224" width="325"]] 851 851 852 852 Figure 4.64. Animated SVG 853 853 854 854 For example, it is necessary to display the status of a discrete signal (switch position), as shown in Fig. 4.65. In case of developing diagrams in the editor, it is necessary to draw all the sticks and text forms separately (see Fig. 4.66) and describe each state in the rules. 855 855 856 -[[image:Screenshot 2025-12-04 at 14.18.44.png]] 858 +[[image:Screenshot 2025-12-04 at 14.18.44.png||height="370" width="226"]] 857 857 858 858 Figure 4.65. Legend for the position of the switch 859 859 860 -[[image:Screenshot 2025-12-04 at 14.19.10.png]] 862 +[[image:Screenshot 2025-12-04 at 14.19.10.png||height="167" width="224"]] 861 861 862 862 Figure 4.66. Graphic elements 863 863 ... ... @@ -895,7 +895,7 @@ 895 895 896 896 Fig. 4.68 shows an example of graphic elements with various animated styles configured through an SVG file. This animation is imported into the menu, as shown in Fig. 4.62, and in the mnemonic diagram editor, it appears as an image where only the size can be adjusted; all other edits are made within the template from the external source (such as Inkscape, Figma, etc.). 897 897 898 -[[image:Screenshot 2025-12-04 at 14.21.36.png]] 900 +[[image:Screenshot 2025-12-04 at 14.21.36.png||height="439" width="665"]] 899 899 900 900 Figure 4.68. Animated Image 901 901 ... ... @@ -986,7 +986,7 @@ 986 986 987 987 == 4.23. Display of the IM object name and the tag measurement units == 988 988 989 -[[image:Screenshot 2025-12-04 at 14.26.29.png]] 991 +[[image:Screenshot 2025-12-04 at 14.26.29.png||height="304" width="741"]] 990 990 991 991 Figure 4.70. Options for displaying tag data 992 992 ... ... @@ -994,11 +994,11 @@ 994 994 995 995 To configure this, in the **Component visual settings** window, by clicking on the upper horizontal menu [[image:Screenshot 2025-12-04 at 14.26.56.png||height="26" width="27"]], actions are selected on the** Text** tab, specifically **IM measurement** (see Fig. 4.71) or **IM object** (see Fig. 4.72). 996 996 997 -[[image:Screenshot 2025-12-04 at 14.27.28.png]] 999 +[[image:Screenshot 2025-12-04 at 14.27.28.png||height="290" width="740"]] 998 998 999 999 Figure 4.71. IM measurement 1000 1000 1001 -[[image:Screenshot 2025-12-04 at 14.27.52.png]] 1003 +[[image:Screenshot 2025-12-04 at 14.27.52.png||height="282" width="723"]] 1002 1002 1003 1003 Figure 4.72. IM object 1004 1004 ... ... @@ -1010,7 +1010,7 @@ 1010 1010 1011 1011 To display the name of the object trimmings unnecessary characters, use the formula in **Actions:** 1012 1012 1013 -[[image:Screenshot 2025-12-04 at 14.30.16.png]] 1015 +[[image:Screenshot 2025-12-04 at 14.30.16.png||height="315" width="746"]] 1014 1014 1015 1015 Figure 4.73. IM object name with split characters 1016 1016 ... ... @@ -1018,7 +1018,7 @@ 1018 1018 1019 1019 Since the rules reference the attributes of the IM (industrial object), in all the examples above, create an active object by right-clicking (1) and bind it in the IM tree [[image:Screenshot 2025-12-04 at 14.31.14.png||height="29" width="30"]] (2) to an object (3), as shown in Fig. 4.74. The data for the bound object is to be displayed in view mode as shown in Fig. 4.70. 1020 1020 1021 -[[image:Screenshot 2025-12-04 at 14.31.50.png]] 1023 +[[image:Screenshot 2025-12-04 at 14.31.50.png||height="456" width="743"]] 1022 1022 1023 1023 Figure 4.74. Creating and binding to an IM object 1024 1024 ... ... @@ -1026,7 +1026,7 @@ 1026 1026 1027 1027 Uploading and downloading diagrams are available on the **Mnemonic diagrams** page, in the Actions column. 1028 1028 1029 -[[image:Screenshot 2025-12-04 at 14.32.48.png]] 1031 +[[image:Screenshot 2025-12-04 at 14.32.48.png||height="168" width="748"]] 1030 1030 1031 1031 Figure 4.75. Mnemonic diagrams page 1032 1032 ... ... @@ -1046,7 +1046,7 @@ 1046 1046 1047 1047 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"]]. 1048 1048 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).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). 1050 1050 1051 1051 [[image:Screenshot 2025-12-04 at 14.41.18.png]] 1052 1052 ... ... @@ -1153,7 +1153,7 @@ 1153 1153 1154 1154 9 – Status is missing. 1155 1155 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).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). 1157 1157 1158 1158 [[image:Screenshot 2025-12-04 at 14.49.03.png]] 1159 1159 ... ... @@ -1167,7 +1167,7 @@ 1167 1167 1168 1168 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. 1169 1169 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.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. 1171 1171 1172 1172 [[image:Screenshot 2025-12-04 at 14.50.40.png]] 1173 1173