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
-
... ... @@ -706,7 +706,7 @@ 706 706 707 707 == 4.16. Outputting numbers in exponential form on the diagram == 708 708 709 -[[image:Screenshot 2025-12-04 at 13.48.10.png||height=" 303" width="987"]]709 +[[image:Screenshot 2025-12-04 at 13.48.10.png||height="276" width="897"]] 710 710 711 711 Figure 4.48. Enabling the exponential form of the number 712 712 ... ... @@ -730,25 +730,25 @@ 730 730 731 731 Fig. 4.51 shows an example of binding the metering channel (power A+) of a device with ID 100063. 732 732 733 -[[image:Screenshot 2025-12-04 at 13.51.42.png ||height="278" width="987"]]733 +[[image:Screenshot 2025-12-04 at 13.51.42.png]] 734 734 735 735 Figure 4.51. Binding the metering channel 736 736 737 737 The channel value in the view mode is displayed for the last time interval, see Fig. 4.52. 738 738 739 -[[image:Screenshot 2025-12-04 at 13.52.24.png ||height="607" width="539"]]739 +[[image:Screenshot 2025-12-04 at 13.52.24.png]] 740 740 741 741 Figure 4.52. Value of the metering channel 742 742 743 743 Metering channel data can be displayed in tabular form, which is selected from the top horizontal menu by clicking the **Table** icon. 744 744 745 -[[image:Screenshot 2025-12-04 at 13.52.57.png ||height="279" width="173"]]745 +[[image:Screenshot 2025-12-04 at 13.52.57.png]] 746 746 747 747 Figure 4.53. Table 748 748 749 749 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. 750 750 751 -[[image:Screenshot 2025-12-04 at 14.07.04.png ||height="302" width="902"]]751 +[[image:Screenshot 2025-12-04 at 14.07.04.png]] 752 752 753 753 Figure 4.54. Metering channel binding 754 754 ... ... @@ -765,9 +765,9 @@ 765 765 * **Width **is the column width. 766 766 * **Change time **is a system field used to display the time of the metering channel's value change. 767 767 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"]] 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"]]. 769 769 770 -[[image:Screenshot 2025-12-04 at 14.10.47.png ||height="322" width="637"]]770 +[[image:Screenshot 2025-12-04 at 14.10.47.png]] 771 771 772 772 Figure 4.55. Display of metering channel data 773 773 ... ... @@ -787,23 +787,23 @@ 787 787 788 788 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). 789 789 790 -[[image:Screenshot 2025-12-04 at 14.13.22.png ||height="560" width="742"]]790 +[[image:Screenshot 2025-12-04 at 14.13.22.png]] 791 791 792 792 Figure 4.57. Binding to the tag ID 793 793 794 794 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). 795 795 796 -[[image:Screenshot 2025-12-04 at 14.13.52.png ||height="713" width="455"]]796 +[[image:Screenshot 2025-12-04 at 14.13.52.png]] 797 797 798 798 Figure 4.58. Create heatmap 799 799 800 800 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. 801 801 802 -[[image:Screenshot 2025-12-04 at 14.14.27.png ||height="594" width="448"]]802 +[[image:Screenshot 2025-12-04 at 14.14.27.png]] 803 803 804 804 Figure 4.59. Editing heatmap properties 805 805 806 -[[image:Screenshot 2025-12-04 at 14.14.52.png ||height="442" width="853"]]806 +[[image:Screenshot 2025-12-04 at 14.14.52.png]] 807 807 808 808 Figure 4.60. Heatmap 809 809 ... ... @@ -813,7 +813,7 @@ 813 813 814 814 To switch to the layer mode, go to the View > Layers in the upper horizontal menu (Ctrl+Shift+L). 815 815 816 -[[image:Screenshot 2025-12-04 at 14.15.37.png ||height="412" width="405"]]816 +[[image:Screenshot 2025-12-04 at 14.15.37.png]] 817 817 818 818 Figure 4.61. Layers menu 819 819 ... ... @@ -837,29 +837,29 @@ 837 837 838 838 The loading of items is in the **Extras** menu item (see Fig. 4.62). 839 839 840 -[[image:Screenshot 2025-12-04 at 14.17.19.png ||height="508" width="326"]]840 +[[image:Screenshot 2025-12-04 at 14.17.19.png]] 841 841 842 842 Figure 4.62. Import animated SVGs 843 843 844 844 Ready-made templates should be uploaded to the **Import animated SVG**s menu (see Fig. 4.63). 845 845 846 -[[image:Screenshot 2025-12-04 at 14.17.47.png ||height="156" width="322"]]846 +[[image:Screenshot 2025-12-04 at 14.17.47.png]] 847 847 848 848 Figure 4.63. Import animated SVGs 849 849 850 850 The template uploaded in Fig. 4.64 replaces drawing of many graphic elements created in the diagram editor. 851 851 852 -[[image:Screenshot 2025-12-04 at 14.18.12.png ||height="224" width="325"]]852 +[[image:Screenshot 2025-12-04 at 14.18.12.png]] 853 853 854 854 Figure 4.64. Animated SVG 855 855 856 856 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. 857 857 858 -[[image:Screenshot 2025-12-04 at 14.18.44.png ||height="370" width="226"]]858 +[[image:Screenshot 2025-12-04 at 14.18.44.png]] 859 859 860 860 Figure 4.65. Legend for the position of the switch 861 861 862 -[[image:Screenshot 2025-12-04 at 14.19.10.png ||height="167" width="224"]]862 +[[image:Screenshot 2025-12-04 at 14.19.10.png]] 863 863 864 864 Figure 4.66. Graphic elements 865 865 ... ... @@ -897,7 +897,7 @@ 897 897 898 898 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.). 899 899 900 -[[image:Screenshot 2025-12-04 at 14.21.36.png ||height="439" width="665"]]900 +[[image:Screenshot 2025-12-04 at 14.21.36.png]] 901 901 902 902 Figure 4.68. Animated Image 903 903 ... ... @@ -988,7 +988,7 @@ 988 988 989 989 == 4.23. Display of the IM object name and the tag measurement units == 990 990 991 -[[image:Screenshot 2025-12-04 at 14.26.29.png ||height="304" width="741"]]991 +[[image:Screenshot 2025-12-04 at 14.26.29.png]] 992 992 993 993 Figure 4.70. Options for displaying tag data 994 994 ... ... @@ -996,11 +996,11 @@ 996 996 997 997 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). 998 998 999 -[[image:Screenshot 2025-12-04 at 14.27.28.png ||height="290" width="740"]]999 +[[image:Screenshot 2025-12-04 at 14.27.28.png]] 1000 1000 1001 1001 Figure 4.71. IM measurement 1002 1002 1003 -[[image:Screenshot 2025-12-04 at 14.27.52.png ||height="282" width="723"]]1003 +[[image:Screenshot 2025-12-04 at 14.27.52.png]] 1004 1004 1005 1005 Figure 4.72. IM object 1006 1006 ... ... @@ -1012,7 +1012,7 @@ 1012 1012 1013 1013 To display the name of the object trimmings unnecessary characters, use the formula in **Actions:** 1014 1014 1015 -[[image:Screenshot 2025-12-04 at 14.30.16.png ||height="315" width="746"]]1015 +[[image:Screenshot 2025-12-04 at 14.30.16.png]] 1016 1016 1017 1017 Figure 4.73. IM object name with split characters 1018 1018 ... ... @@ -1020,7 +1020,7 @@ 1020 1020 1021 1021 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. 1022 1022 1023 -[[image:Screenshot 2025-12-04 at 14.31.50.png ||height="456" width="743"]]1023 +[[image:Screenshot 2025-12-04 at 14.31.50.png]] 1024 1024 1025 1025 Figure 4.74. Creating and binding to an IM object 1026 1026 ... ... @@ -1028,7 +1028,7 @@ 1028 1028 1029 1029 Uploading and downloading diagrams are available on the **Mnemonic diagrams** page, in the Actions column. 1030 1030 1031 -[[image:Screenshot 2025-12-04 at 14.32.48.png ||height="166" width="742"]]1031 +[[image:Screenshot 2025-12-04 at 14.32.48.png]] 1032 1032 1033 1033 Figure 4.75. Mnemonic diagrams page 1034 1034 ... ... @@ -1040,7 +1040,7 @@ 1040 1040 1041 1041 The **Upload** button allows uploading all the diagrams from one previously downloaded archive. This allows diagrams to migrate from one server to another. 1042 1042 1043 -= 5. B INDINGTAGSTOTHEDIAGRAMUSINGIDORCODE=1043 += 5. Binding tags to the diagram using ID or code = 1044 1044 1045 1045 **Example No. 1** 1046 1046 ... ... @@ -1050,21 +1050,21 @@ 1050 1050 1051 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). 1052 1052 1053 -[[image:Screenshot 2025-12-04 at 14.41.18.png ||height="337" width="925"]]1053 +[[image:Screenshot 2025-12-04 at 14.41.18.png]] 1054 1054 1055 1055 Figure 5.1. Binding to the text 1056 1056 1057 1057 To quickly bind to a tag, the **Component visual settings** window can be skipped by using the **Bind an element to a tag or channel** tree [[image:Screenshot 2025-12-04 at 14.41.48.png||height="25" width="25"]]. This automatically fills the tag, see Fig. 5.1. 1058 1058 1059 -[[image:Screenshot 2025-12-04 at 14.42.21.png ||height="427" width="927"]]1059 +[[image:Screenshot 2025-12-04 at 14.42.21.png]] 1060 1060 1061 1061 Figure 5.2. Choose the parameter drop-down list 1062 1062 1063 -[[image:Screenshot 2025-12-04 at 14.42.51.png ||height="197" width="410"]]1063 +[[image:Screenshot 2025-12-04 at 14.42.51.png]] 1064 1064 1065 1065 Figure 5.3. Formatting the text in the rules 1066 1066 1067 -[[image:Screenshot 2025-12-04 at 14.43.17.png ||height="197" width="921"]]1067 +[[image:Screenshot 2025-12-04 at 14.43.17.png]] 1068 1068 1069 1069 Figure 5.4. Tag value in the view mode 1070 1070 ... ... @@ -1086,8 +1086,8 @@ 1086 1086 1087 1087 Real parameter data for binding: 1088 1088 1089 -|**ID number**| (% style="width:347px" %)**Parameter name**|(% style="width:390px" %)**Values**|**Decryption**1090 -|10154| (% style="width:347px" %)Emergency alarm (EA)|(% style="width:390px" %)0/1|(((1089 +|**ID number**|**Parameter name**|**Values**|**Decryption** 1090 +|10154|Emergency alarm (EA)|0/1|((( 1091 1091 normal/ 1092 1092 1093 1093 trigerring