Method for displaying object in visual region

Abstract

The present invention relates to a method for displaying an object in a visual region. The method comprises: on the basis of a content index, identifying an object to be displayed in a visual region of a canvas; calculating an actual object height and an actual object width of the object; adjusting a predicted canvas height and a predicted canvas width of the canvas; and displaying the object in the visual region. The method can shorten the time required for displaying an object in a visual region after a system enables a visual programming language object, and can maintain the flexibility of displaying a visual programming language file with mass content in a more user-friendly manner.

Description

Methods for displaying objects in the viewing area Technical Field

[0001] The present invention relates to a method for displaying at least one object of a graphical programmable logic controller (PLC) language file in a visual area for a graphical programmable logic controller (PLC) language having massive contents, and more particularly to a method for displaying the object in the visual area. Background Art

[0002] A visual programming language or block-based coding language can be compiled into hardware code to be recognized and executed by computers such as desktop computers, tablet computers, industrial computers, programmable logic controllers (PLCs), etc. In industrial automation applications, a visual programming language allows programmers to visualize a series of operations and processes as at least one of a ladder diagram (LD), a sequential function chart (SFC), a continuous function chart (CFC), and a function block diagram (FBD). In game and animation applications, a series of actions, dialogues, sounds, and visual effects performed by one or more characters can be compiled into a graphical programming language file. Many software products, such as Developed to allow programmers to create, examine, or edit the contents of a graphical programming language without having to write text coding commands.

[0003] As manufacturing processes or animation scenarios become more complex, the content of the graphics programming language file may become larger. Sometimes, it takes a long time and a lot of hardware resources to open the graphics programming language, which is inconvenient for programmers.

[0004] Therefore, it is hoped to develop a method for opening a graphics programming language file with massive content using a minimum of time and hardware resources. Summary of the Invention

[0005] The present application provides a method for displaying a portion of a graphics programming language file having a plurality of objects arranged in a plurality of sections. The method comprises the steps of: (1) creating a content index from the graphics programming language file; (2) obtaining and storing information about at least one visual object in at least one visual section into the content index, wherein the at least one visual object is to be displayed in a visual area of ​​a canvas; (3) calculating a predicted canvas height and a predicted canvas width of the canvas based on the content index; and (4) displaying the at least one visual object in the visual area.

[0006] The present application provides a display system for displaying a portion of a graphics programming language file having a plurality of objects arranged in a plurality of sections. The display system includes a display device, a user interface, a memory device, and a processor. The display device is used to display an image corresponding to at least one visual object in a visible area of ​​a canvas. The user interface is used to receive a user instruction. The memory device is used to store the graphics programming language file, a content index of the graphics programming language file, and a program code. The processor is connected to the display device, the user interface, and the memory device, wherein the program code is used to instruct the processor to perform operations including: (1) establishing the content index from the graphics programming language file; (2) obtaining and storing information about the at least one visual object to be displayed in at least one visible section in a visible area of ​​the canvas into the content index; (3) calculating a predicted canvas height and a predicted canvas width of the canvas based on the content index; and (4) displaying the at least one visual object in the visible area.

[0007] Other objects, advantages and novel features of the present invention will become more apparent from the following detailed description when taken in conjunction with the accompanying drawings. BRIEF DESCRIPTION OF THE DRAWINGS

[0008] FIG1 is an example of a graphic programming language file written in a ladder diagram;

[0009] 2 is a flow chart describing one embodiment of a process for displaying a portion of a graphics programming language file according to one embodiment of the present disclosure;

[0010] FIG3 is a schematic diagram illustrating a content index structure according to one embodiment of the present disclosure;

[0011] FIG4 shows a flow chart describing one embodiment of the sub-steps of establishing a content index according to one embodiment of the present disclosure;

[0012] FIG5 is an example of a graphic programming language file written in a ladder diagram;

[0013] FIG6 shows a flowchart describing an example of sub-steps for identifying one or more potentially visible segments and obtaining and storing horizontal object counts, vertical object counts, and related object structure information for each of the one or more potentially visible segments in a content index according to one embodiment of the present invention;

[0014] FIG7 is a schematic diagram illustrating a structure of a content index according to an embodiment of the present disclosure;

[0015] FIG8 is an example of a graphical programming language written in ladder diagram;

[0016] FIG9 shows a flowchart describing one embodiment of sub-steps for obtaining and storing information about at least one visual object into a content index according to one embodiment of the present disclosure;

[0017] FIG10 shows a flowchart illustrating an example of steps for obtaining and storing information about at least one visual object into a content index according to an embodiment of the present disclosure;

[0018] FIG11 is an example of a portion of a graphical programming language object in a visible area and a structure of a corresponding read status stored in a content index;

[0019] FIG12 shows a flow chart describing one embodiment of sub-steps for calculating a predicted canvas height and a predicted canvas width of a canvas according to one embodiment of the present disclosure;

[0020] FIG13 shows a flowchart describing an example of sub-steps for calculating a predicted canvas height and a predicted canvas width of a canvas according to an embodiment of the present disclosure;

[0021] FIG14 is an example of a graphic programming language file written in a ladder diagram;

[0022] FIG15 shows a flow chart describing one embodiment of sub-steps for displaying at least one visual object in a viewable area according to one embodiment of the present disclosure;

[0023] 16A and 16B are schematic diagrams of a viewable area with a scroll bar according to some embodiments of the present disclosure;

[0024] FIG17 is an example of a graphic programming language file written in a ladder diagram;

[0025] FIG18 is a schematic diagram illustrating a structure of a content index of a new viewable area according to an embodiment of the present disclosure;

[0026] FIG19 is an example of a graphic programming language file written in a ladder diagram;

[0027] FIG. 20 is a functional block diagram of a display system according to an embodiment of the present disclosure.

[0028] DESCRIPTION OF REFERENCE NUMERALS 10: Graphics programming language file 11: Canvas 12, 12': Visible area 15, 15A, 15B: Object 16: Image 161: Vertical scroll bar 162: Horizontal scroll bar 163: Cursor 2000: Display system 2001: Processor 2002: Memory device 2003: Display device 2004: User interface 2005: Program code IND_3, IND_7, IND_7': Content index S20-S26, S41-S43, S43a, S43b, S61-S69, S91-S95, S1001-S1009, S1201-S1203, S1301-S1307, S1501-S1504: Steps DETAILED DESCRIPTION

[0029] The terms used in the following description, even when used in conjunction with the detailed description of certain specific embodiments of the present technology, are intended to be interpreted in the broadest reasonable manner. Specific terms may be emphasized below; however, any term intended to be interpreted in any restrictive manner will be specifically defined in this embodiment section.

[0030] The described embodiments relate to one or more methods, systems, apparatus, and computer-readable media storing processor-executable process steps for displaying at least one object in a graphical programming language file in a viewable area based on a content index. The disclosed systems and methods are developed to enable a user to create, review, or edit content in a graphical programming language file.

[0031] A graphics programming language file includes multiple segments and multiple objects arranged within the segments. A content index stores structural information about the graphics programming language file, such as the total number of segments and multiple segment indexes. Each segment index may include the number of horizontal objects, the number of vertical objects, and the structural relationships between these objects. On the one hand, the present disclosure allows for rapid display of a portion of a graphics programming language file in the visual area because the system does not need to initially interpret and draw all objects. On the other hand, the present disclosure allows for more complete display of objects, containing more information in a more understandable format.

[0032] A graphical programming language file is a file written in a graphical programming language. In one embodiment, the graphical programming language may be any programmable logic controller (PLC) language that uses graphics to describe the logical structure between objects, such as ladder diagrams (LD), sequential function charts (SFC), function block diagrams (FBD), and the like. PLC languages ​​are used to describe the logical structure of microelectromechanical systems executed by industrial controllers. In one embodiment, a segment may also include a segment label object and / or a segment comment object.

[0033] A graphical programming language file includes a plurality of objects. Similar to building blocks, an object is a component of the graphical programming language that represents the specific electronic / mechanical control logic of the system components used to build the logical structure of the MEMS.

[0034] For example, ladder diagrams (sometimes called "ladder logic") are a popular programming language for recording the logical structure of industrial controls. The language is called ladder diagram because the diagram resembles a ladder, with two vertical rails (for power supply) and numerous "rungs" (horizontal lines) representing control circuits. This symbol is sometimes used to illustrate the interconnection of micro-motor switches and relays. In this programming language, objects can be ladder logic symbols, such as normally open (NO) contact symbols, normally closed (NC) contact symbols, output coil symbols, comparison symbols, and the like. FIG1 illustrates an embodiment of a graphical programming language file written using ladder diagrams. It should be noted that in the example graphical programming language file shown in FIG1 , multiple objects are strictly arranged in two-dimensional space, and the objects are connected by straight lines or elbow lines. However, in some applications and embodiments, the objects can be arranged arbitrarily, and the processor therefore reads object information including the object's position, width, height, and rotation angle. In some applications and embodiments, objects of a graphics programming language file may be arranged in a three-dimensional space, and thus the processor reads object information including the object's position, width, height, depth, and normal direction, where the normal direction describes a rotation angle relative to a normal direction of the three-dimensional space.

[0035] The disclosed systems and methods can be implemented using software written in various programming languages, such as C#, C++, Java, Python, Objective-C, and the like. When using object-oriented programming languages, program objects can be used to implement content indexing and various functions. These program objects are distinct from objects in graphical programming languages ​​that are displayed in a visual area using the disclosed systems and methods. However, content indexing can also be implemented using other data structures, such as databases.

[0036] 2 depicts a flow chart of a method for displaying a graphical programming language file when a user opens the graphical programming language file for the first time and thereafter according to an embodiment of the present disclosure. The method 20 may be compiled into a programming language to instruct a processor to perform the following steps.

[0037] In short, in step S21, the system creates a content index from a graphics programming language object. In step S22, the system creates a canvas with an initial canvas height as a predicted canvas height and an initial canvas width as a predicted canvas width based on the content index. Then, in step S23, the system obtains and stores information related to at least one visual object to be displayed in the visual area of ​​the canvas into the content index. In step S24, the system calculates the predicted canvas height and predicted canvas width of the canvas based on the content index. Then, in step S26, the system displays at least one visual object in the visual area. If the system receives a user instruction to update the visual area in step S26, the system may first determine the position of the new visual area on the current canvas. The system may then repeat steps S23 to S25 to display at least one visual object in the new visual area. In another embodiment, step S22 may be skipped.

[0038] FIG3 illustrates a schematic diagram of a content index structure according to one embodiment of the present disclosure. As shown in FIG3 , the content index IND_3 may include object information (e.g., object type, object annotation, input or output variables, location, object width, object height, default object width, and default object width) as well as statistical information (e.g., the number of vertical and horizontal objects, the number of visible vertical and horizontal objects, or the total number of segments). This lightweight content index requires only a small amount of memory to store. Because the content index only includes information associated with the currently visible object, the information stored in the content index increases as the user decides to display a new portion of a graphics programming language file. It should be noted that because creating the content index involves only simple logic and calculations, it takes very little time to create, even if the graphics programming language file contains a large amount of information. Therefore, the graphics programming language file can be displayed in a short time and requires less hardware resources. Experiments have shown that the loading time for graphics programming language files with large and small amounts of content is roughly the same. In other words, in the present disclosure, the loading time for displaying graphics programming language files with large and small amounts of content is roughly constant, regardless of file size.

[0039] When the content index is first created in step S21, it may only include the total number of segments, representing the number of all segments in the graphics programming language file. When the system parses the first visual segment, such as segment 1, as at least one visual segment, structural information for the multiple objects in this segment, such as the number of horizontal and vertical objects in the segment, is derived into a segment index, which is stored in the content index. After the system calculates the actual object height and actual object width of at least one visual object to be displayed in the visual area, this object information is stored in the content index. The content index may also include display information for a specific display of a visual area. This display information may be updated or removed during the display of another new visual area.

[0040] In step S21, the system creates a content index for a graphic programming language file in one of a plurality of file formats. Step S21 may also include steps S41 to S43 as shown in FIG4 . A graphic programming language file may include multiple sections, and each section may include multiple objects. Referring to FIG4 , in step S41, when a user opens a graphic programming language file or a file including a graphic programming language file to be displayed, the system may create an empty content index and parse the graphic programming language file to obtain and store the total number of sections in the content index. For example, for graphic programming language file 10 shown in FIG1 , the system may parse graphic programming language file 10 to obtain a total number of sections of 6 and store this number in the content index. In one embodiment, the file and / or graphic programming language file is marked in the Extensible Markup Language (XML) file format. In one embodiment, the file may include multiple graphic programming language files written in one or more programming languages, one of which is the graphic programming language file to be displayed. In this case, the system may first review the content of the file to identify the different programming language sections. For example, the first portion of the file may be written using a ladder diagram, the second portion may be written using a sequential function diagram, and the third portion may be written using a function block diagram. The system may determine which graphical programming language file to display first, either by default or by user input. The content of a graphical programming language file may also refer to a number of lines of program code in the file. A content index is created from the graphical programming language file to store the total number of segments and related information (e.g., default settings such as preset segment height, preset segment width, default object height, or default object width; segment number). In one embodiment, the content index may be in XML format. In one embodiment, the content index may be implemented as a program object based on a class structure or other data structure in C#, C++, Java, Objective-C, or other suitable programming languages.

[0041] In step S42, the system may determine the position of the visible area. In one embodiment, the position of the visible area on the canvas may be determined by the coordinates of a representative point, such as the upper left corner, height, and width. In an embodiment where the visible area is rectangular, the system may determine the height and width of the visible area by a preset setting or by user input before or after the graphics programming language file is opened. Alternatively, the position of the visible area may be determined by the coordinates of four vertices. Figure 5 depicts a schematic diagram of a visible area on a canvas for displaying a graphics programming language file according to an embodiment of the present disclosure, wherein the graphics programming language file 10 may be substantially similar to the graphics programming language file 10 shown in Figure 1. In the example shown in Figure 5, the origin and diagonal vertices of the visible area 12 are (X0, Y0) and (X3, Y3), respectively. When the origin (X0, Y0) is (0, 0) and the diagonal vertex (X3, Y3) is (Wv, Hv), the width Wv may be calculated by (X3–X0), and the height Hv may be calculated by (Y3–Y0).

[0042] In step S43, the system may identify one or more potential visible segments expected to be displayed in the visible area according to the default segment height (S43a), and obtain and store the number of horizontal objects N. H,MAX , the number of vertical objects N V,MAX And the related object structure information of each of the one or more potential visible segments is entered into the content index (S43b). H,MAX is the maximum number of objects arranged horizontally in a segment, and the number of vertical objects N V,MAX is the maximum number of objects arranged in the vertical direction in a segment. In one embodiment, the relevant object information may record the method of connecting objects in the current segment, such as whether they are connected in series or in parallel, and / or the order in which these objects are connected. In one embodiment, the connection relationship of objects can be managed by assigning an object ID to each object. In another embodiment, step S43 and its subsequent steps can be subsequently included as part of step S22 or S23. In step S43, in addition to the potential visible segment, the system can also obtain the horizontal object count, vertical object count, and related object structure information of all other segments of the graphics programming language file. Step S43 may also include steps S61 to S69 as shown in Figure 6.

[0043] In step S61, the system may designate an initial section as the current section. In one embodiment, the first section of the graphic programming language file may be the initial section. For example, section 1 of the graphic programming language file 10 shown in FIG5 may be the initial section.

[0044] In step S62, the system parses the current section of the graphics programming language file to obtain the number of horizontal objects N in the current section. H,MAX, the number of vertical objects N V,MAX For example, as shown in FIG5 , the number of horizontal objects N in section 1 of the graphic programming language file 10 is H,MAX and the number of vertical objects N V,MAX 4 and 2 respectively. Along the horizontal direction X, the first column of segment 1 contains four objects, the second column of segment 1 contains one object, and thus the horizontal object number N of segment 1 is H,MAX = 4. Along the vertical direction Y, each of the first, third, and fourth columns of segment 1 contains one object, the second column of segment 1 contains two objects, and thus the vertical object number N of segment 1 is V,MAX is 2. However, the system may employ any other suitable algorithm to calculate the number of horizontal objects and the number of vertical objects.

[0045] Next, in step S63, the system determines whether the current segment is outside the visible area. In one embodiment, each segment initially has the same preset segment height. Therefore, each segment can be assigned a vertical coordinate, such as a Y coordinate, to represent the vertical position of the segment. For example, when the preset segment height is 2 pixels, the vertical coordinates of the first, second, and third segments are 0, 2, and 4 pixels, respectively. In an embodiment where the visible area is 3 pixels (height) x 6 pixels (width), segments 1 and 2 are determined to be within the visible area, while segment 3 is determined to be outside the visible area.

[0046] In step S64, if the current segment is not outside the visible area (i.e., completely or partially within it), the system may retrieve or store the segment information in the content index. An empty segment index for each segment may be previously created, and the segment information may be stored in the segment index. In one embodiment, if a segment contains a segment label object and / or a segment annotation object in the visible area, the relevant content of these objects described in the graphics programming language file (e.g., the text of the segment label object and / or segment annotation object) may also be parsed and stored in the corresponding segment index. For example, in the embodiment shown in FIG5 , segment 1 contains a segment label object and a segment annotation object, both of which are within the visible area. The relevant content of these objects described in the graphics programming language file (e.g., the text of the segment label object) may be stored in the segment index of segment 1. However, because the segment label object and segment annotation object of segment 2 are not set to be displayed, the system may not retrieve the relevant content.

[0047] In step S65, the system may designate an object in the current segment as the current object and determine whether the object is outside the visible area. If the current object is not outside the visible area, in step S66, the system obtains and stores the object information of the current object into the content index, and in step S67 accumulates the number of visible horizontal objects and the number of visible vertical objects in the current segment. The object information of an object may include type, annotation text, and input / output variables, and may be stored in the segment index of the segment where the object is located. The number of visible horizontal objects in a segment is the maximum number of visible objects arranged in the horizontal direction in the segment, and the number of vertical objects in the segment is the maximum number of visible objects arranged in the vertical direction in the segment. Then, the system may designate the next object in the current segment as the current object and repeat steps S65 to S67 until the current object is outside the visible area or there are no more objects to be parsed in the current segment. In step S68, the accumulated number of visible horizontal objects N in the current segment is calculated. H,VISIBLE and the number of visible vertical objects N V,VISIBLE is stored in the content index and advances to the next segment of the graphic programming language file. The system may repeat steps S62 to S68 until the current segment is outside the visible area or there are no more segments in the graphic programming language object. For example, as shown in Figure 5, when parsing segment 1, the system may initially determine that object 15 is the current object and obtain and store the object information in the content index. The object information of object 15 may include the annotation "Push Button", the variable "IO.0", and the type "open contact". After repeating steps S65 to S67 until all objects in the visible area are parsed, the system may store a visible vertical object count of 2 and a visible horizontal object count of 3 in the segment index of segment 1 and advance to segment 2. For segment 2, steps S62 to S68 are repeated again, and because segment 3 is outside the visible area, only steps S62 to S63 are performed for segment 3.

[0048] FIG7 schematically illustrates the structure of a content index IND_7 according to one embodiment of the present disclosure. Content index IND_7 is created for graphics programming language file 10 after step S21 is executed. As shown in FIG7 , because each of Segment 1 and Segment 2 is partially located within visible area 12, information related to each of these segments is parsed and stored as a segment index in content index IND_7. On the other hand, information related to Segments 3 through 6 is not parsed and stored in the content index because they are located outside visible area 12. Please note that the blocks in content index IND_7 refer to memory device spaces or registers allocated when the steps are executed. Blocks filled with dashed lines store data, while empty blocks do not store data.

[0049] In another embodiment, the system may parse all sections in the graphic programming language file in step S21 to obtain section information including each section and store the section index into the content index.

[0050] As shown in FIG2 , in step S22 , a canvas having an initial canvas height as a predicted canvas height and an initial canvas width as a predicted canvas width can be established based on the content index. The initial canvas height and the initial canvas width can be calculated in a variety of ways. For the initial canvas height, at least three embodiments are available. In a first embodiment, the initial canvas height is a preset canvas height, which can be determined by a preset setting or user input. Therefore, no calculation is required. In a second embodiment, the initial canvas height Ht is equal to the total number of segments N in the graphics programming language file. SEC,TOTAL Multiply by the preset segment height H SEC,DEF (i.e. Ht=H SEC,DEF *N SEC,TOTAL ). In the example shown in FIG8 , when the graphic programming language file has a total number of segments N of 6 SEC,TOTAL And the preset section height H SEC,DEF When the initial canvas height Ht is 80 pixels, the initial canvas height Ht is 80*6=480 pixels. In the third embodiment, at step S21, the system has identified one or more potential visible segments, and the vertical object count is stored in the content index. Then at step S22, the system considers the vertical object count N of the potential visible segment. V,MAX To calculate the initial canvas height. Therefore, for the calculation of the initial canvas height, the potential visible area uses the default object height H OBJ,DEF Multiply by the number of vertical objects N V,MAX The predicted segment height is used for the other segments, while the preset segment height H is used for the other segments. SEC,DEF For example, a graphics programming language file has six sections, two of which are potentially visible sections. The vertical object counts of the potentially visible sections are 2 and 3, respectively, the preset section height is 3 pixels, and the default object height is 2 pixels. Therefore, the initial canvas height is 22 pixels. In one embodiment, the section height needs to add the default section label height, the default section annotation height, and the preset section border height; however, those skilled in the art may adjust the definition of the section height based on actual needs.

[0051] At least two embodiments are available for the initial canvas width. In the first embodiment, the initial canvas width is a preset canvas width. Therefore, no calculation is required. In the second embodiment, in step S21, the system has identified one or more potential visual segments, and the number of horizontal objects is stored in the content index. Then in step S22, the system calculates the initial canvas width taking into account the number of horizontal objects in the potential visual segment. The predicted segment width of each visual segment is equal to the number of horizontal objects NH,MAX Multiply by the default object width W OBJ,DEF (i.e. Wt=W OBJ,DEF *N H,MAX ). The initial canvas width is the maximum predicted width of all potential visual segments. For example, if the number of horizontal objects N in two potential visual segments is H,MAX 5 and 8 respectively, and the default object width W OBJ,DEF If the predicted width of the visible area 12 is 100 pixels, then the initial canvas width Wt is 800 pixels (8*100). However, in one embodiment, if the predicted widths of all potentially visible segments are smaller than the default canvas width, the system may determine to use the default canvas width as the initial canvas width. It should be understood that once the relative size of the visible area 12 is adjusted by the programmer, the total height Ht and total width Wt of the canvas 11 will be updated and converted to the actual height and actual width of the canvas 11 when the programmer browses the file 10.

[0052] In one embodiment, after the initial canvas height and initial canvas width are determined, a scroll bar may be generated based on the position of the visible area relative to the canvas. In addition to the scroll bar, other user interfaces may be provided to allow the user to determine the position of the visible area for displaying sections and objects of a graphical programming language file. For example, a small canvas preview window may provide an overview of the entire canvas and allow the user to click or drag to select the visible area. Arrow icons for moving the visible area up, down, left, and right are also alternatives.

[0053] In step S23 shown in FIG2 , the system retrieves and stores information related to at least one visual object to be displayed in the visible area of ​​the canvas into a content index. In one embodiment, the information related to the at least one visual object may include a section index, wherein the section index includes the actual height and actual width of each of the at least one visual object. In one embodiment, the information related to the at least one visual object may include object information for each of the at least one visual object.

[0054] Step S23 may also include steps S91 to S95 as shown in FIG9 . In step S91, the system identifies at least one visual object in at least one visible segment to be displayed in the visible area. In one embodiment, the system may determine the vertical coordinates of the visible area on the canvas. Next, predicted vertical coordinates of multiple segments are calculated based on the content index. The system may identify at least one visible segment having a predicted vertical coordinate corresponding to the vertical coordinate of the visible area on the canvas. In one embodiment, to first identify the at least one visible segment, the predicted vertical coordinate of a segment may be calculated by summing the predicted segment heights of each segment preceding the segment, with the segment height of an unresolved segment being the preset segment height, and the predicted segment height of a resolved segment being the sum of the predicted column heights of each column in the resolved segment. The predicted column height of a column without a displayed object is the default object height, and the predicted column height of a column with at least one displayed object is the maximum actual object height. Alternatively, the predicted vertical coordinate of a segment can be calculated by summing the predicted segment heights of each segment preceding the segment, where the predicted segment height is the preset segment height. That is, for segment 3, the predicted vertical coordinate can be twice the preset segment height. In one embodiment, to identify at least one visual object, the system determines the horizontal coordinates of the visible area on the canvas and calculates predicted horizontal and vertical coordinates for multiple objects in the at least one visual segment based on a content index. The at least one visual object having predicted horizontal and vertical coordinates corresponding to the horizontal and vertical coordinates of the visible area on the canvas is identified. The predicted vertical coordinate of an object in one of the at least one visual segment can be calculated by summing the predicted segment heights of each segment preceding the segment and the predicted column heights of each column preceding the object in the segment. Each segment can be either a resolved segment or an unresolved segment. The predicted segment height of an unresolved segment is the preset segment height, and the predicted segment height of a resolved segment is the sum of the predicted column heights of each column in the resolved segment. The predicted column height for a column without a displayed object is the default object height, and the predicted column height for a column with at least one displayed object is the maximum actual object height. Alternatively, the predicted vertical coordinate of an object in at least one of at least one visible segment is calculated by summing the total segment heights of the segments preceding the segment and the total column heights of the columns preceding the object in the segment. The total segment height of the segments preceding the segment may be the preset segment height multiplied by the number of segments preceding the segment in which the object is located. The total column height may be the preset column height multiplied by the number of columns preceding the object in the segment. It should be noted that in some embodiments, when calculating the predicted vertical coordinate of at least one visible object and the predicted vertical coordinate of at least one visible segment, the system may also take into account the segment label height and / or the segment annotation height.For example, when the segment label object and the segment annotation object of segment 1 are in the visible area, the vertical coordinate of segment 2 is the sum of the segment label height, the segment annotation height, and the predicted segment height of segment 1.

[0055] Next, in step S92, the system obtains a segment index and object information for at least one visual object in at least one visible segment. It should be understood that if the segment index and object information have already been obtained and stored in the content index (e.g., in step S21), the system can skip step S92. In step S93, the system calculates the actual width and actual height of the at least one visual object in the at least one visible segment based on the object information. If the at least one visual object includes multiple visual objects and the at least one visible segment includes multiple visual segments, the system can repeat steps S91 to S94 until all visual objects in all visible segments are identified.

[0056] FIG10 depicts an example process flow diagram for executing a method including steps S91 to S95 according to one embodiment of the present disclosure. In step S1001, the system may designate a current segment. At the beginning of step S23, the system may first designate an initial segment as the current segment. In one embodiment, the system may designate the first segment of a graphical programming language file as the initial segment. Next, in step S1002, the system may determine whether the current segment is outside the visible area. If so, the system returns to step S1001 to designate the next segment as the current segment; otherwise, the system determines that the current segment is a visible segment and proceeds to step S1003. In one embodiment, if the system determines that a segment is a visible segment, in step S1002, it adds the segment to a visible segment list. The visible segment list is created in the content index to record the visible segments of the visible area and can be released from memory if the user updates the visible area to a new location. Each visible segment in the visible segment list can be displayed completely or partially within the visible area. As previously mentioned, the system can determine this based on the predicted vertical coordinates of the current segment and the vertical coordinates of the visible area. For example, the vertical coordinate of the visible area is 3 pixels, the height of the visible area is 6 pixels, and because no segments have been parsed before, the height of each segment is 2 pixels. The system first designates segment 1 as the current segment and determines that it is not within the visible area. The system can then designate the next segment, segment 2, as the current segment and determine that it is a visible segment, and proceed to step S1003.

[0057] In step S1003, the system obtains a segment index for the current segment, where the current segment is at least one visible segment, and stores it in the content index. The content index may include the number of horizontal objects and the number of vertical objects in the current segment. In one embodiment, the segment index may also include segment information, which may be substantially similar to the segment information described above with reference to step S64, and the relevant details are omitted here for brevity. However, in one embodiment, if the segment index for the current segment has been previously obtained and stored in the content index, step S1003 may be skipped.

[0058] In step S1004, the system designates an object in the current segment as the current object. When step S1004 is executed for the current segment for the first time, the system may designate an initial object in the current segment as the current object. In one embodiment, the system may designate the first object in the current segment as the initial object. Next, in step S1005, the system may determine whether the current object in the current segment is outside the visible area. In one embodiment, as previously described, the system may determine this based on the predicted coordinates of the current object. If the system determines that the current object is within the visible area and is therefore a visible object, the system may proceed to step S1006; otherwise, the system returns to step S1004 to designate the next object as the current object. In one embodiment, in step S1005, if the system determines that an object is a visible object, it may add the object to a visible object list. The visible object list is created in the content index to record the visible objects in the visible area and may be released from memory when the user updates the visible area to a new location. Each visual object in the visual object list may be displayed completely or partially in the visual area.In one embodiment, an object ID is used for the visual object list.

[0059] In step S1006, the system may obtain object data for the current object, where the current object is one of at least one visual object, and calculate the actual width and actual height of the current object. Object information, such as object type, object name, object annotation, and input or output variables, is retrieved and stored in the content index. However, in one embodiment, if the object information for the current object has been previously obtained and stored in the content index, this step may be omitted. The system calculates the actual height and actual width of the current object based on the object information. In one embodiment, the system may generate a graph specification for the current object based on the object information. The graph specification for the current object may include the actual height, actual width, object type, object name, input variables, and output variables of the current object. The graph specification for the current object may be stored in the content index. For example, the graph specification includes a graphics data object and the location of the graphics data object. In one embodiment, the graphics data object may specify the brightness and / or color of each pixel rendered to generate the image of the object. Additionally, each object may be assigned a predicted two-dimensional coordinate, such as (X, Y), representing the predicted location of a representative point of each object, such as the upper left corner. Therefore, the object coordinates, the actual object height, and the actual object width can determine the predicted area of ​​the object on the canvas. Alternatively, in the case where the object is a rectangle, the four coordinates of the four vertices can be used to determine the predicted area of ​​the object on the canvas. In one embodiment, after obtaining the actual height and actual width of the object, the system can set the read state of the object to true. In one embodiment, if all objects in the current segment have been parsed, the read state of the segment is set to true. In one embodiment, the system can accumulate the actual segment width and the actual segment height, which represent the width and height of the visible part of the segment, respectively. For example, as shown in Figure 11, if object 15 is the current object, the processor can obtain object information including the annotation "Push Button", the variable "IO.0", and the type "open contact", and generate a detailed description for it. Then, the system obtains its actual width and actual height, and identifies the location of the object. Actual segment width W SEC,ACTUAL And the actual section height H SEC,ACTUAL It can also be accumulated and the object's read status is set to true.

[0060] In S1007, the system can confirm whether all visible objects have been recognized. In one embodiment, the system calculates and determines whether there is excess space in the visible area horizontally or vertically to display the next object. In one embodiment, the system compares the actual width of the first visible object with the width of the visible area to determine whether the next horizontal object is to be displayed. The system also sequentially or simultaneously compares the actual height of the first visible object with the height of the visible area to determine whether the next vertical object is to be displayed. In addition, when the visible object is the last object horizontally, the horizontal comparison is terminated. Similarly, when the visible object is the last object vertically in the last segment, the vertical comparison is terminated. If one or more visible objects in the current segment remain unrecognized, the system returns to step S1004 and designates the next object as the current object. Steps S1004 through S1007 are repeated until all objects in the current segment are recognized.

[0061] If all visible objects in the current segment are recognized, the system determines whether all visible areas are recognized in step S1008. If not, the system returns to step S1001 to assign the next segment as the current segment and repeats steps S1001 to S1008 until all visible areas are recognized.

[0062] In one embodiment, in step S1007, if all visual objects in the current segment are identified, the system may also calculate the predicted segment width and predicted segment height of the current segment. The system may also calculate the predicted segment width by summing up the predicted segment width of each object calculated as the number of horizontal objects. Each object is a displayed object or a non-displayed object. If the actual object width and actual object height of the object have been calculated in advance, the object is a displayed object; otherwise, the object is a non-displayed object. Therefore, the predicted width of the displayed object is the actual object width, and the predicted width of the non-displayed object is the default object width. The system may calculate the predicted segment height of the current segment by summing up the predicted column height of each column in the current segment. The predicted column height of a column without a displayed object is the default object height and the predicted column height of a column with at least one displayed object is the maximum actual object height of the column.

[0063] Alternatively, in another embodiment, in step S1007, after the system determines that all objects in the current segment have been identified, the system may obtain and store the visible horizontal object count and visible vertical object count of the current segment in the content index. The visible horizontal object count of a segment is the maximum number of visible objects arranged horizontally in the segment, and the visible vertical object count of the segment is the maximum number of visible objects arranged vertically in the segment. Next, in step S1007, the system may calculate the virtual height and virtual width of the current segment, which are the predicted width and predicted height of the portion outside the visible area, respectively. The virtual width of the segment can be calculated by multiplying the default object width by the difference between the horizontal object count and the visible horizontal object count. For example, as shown in Figure 8, segment 1 has a horizontal object count of 4 and a visible horizontal object count of 3. Therefore, the virtual width of segment 1 is 1 times the default object width. Similarly, the virtual height of the segment can be calculated by multiplying the default object height by the difference between the number of vertical objects and the number of visible vertical objects. For example, as shown in Figure 8, segment 2 has a vertical object count of 2 and a visible vertical object count of 1. Therefore, the virtual height of segment 2 is 1 times the default object height.

[0064] If all segments are identified, the system may proceed to step S1009. The system stores the segment index, object information, and the actual width and actual height of all visible objects in all visible segments in the content index. In another embodiment, each of the segment index, object information, actual width, and actual height may be stored directly in the content index when obtained, and step S1009 may be skipped. In one embodiment, the actual width, actual height, virtual width, and virtual height of all visible segments may also be stored in the content index. In another embodiment, each of the actual width, actual height, virtual width, and virtual height of the visible segments may be stored directly in the content index when calculated in step S1007.

[0065] In step S24, the system calculates a predicted canvas height and a predicted canvas width based on the content index. In one embodiment, step S24 may further include steps S1201 to S1203 as shown in FIG12 . In step S1201, the system may sum the predicted segment heights of each segment in the graphics programming language file to obtain a predicted canvas height. In one embodiment, the predicted segment height of a visible segment is the sum of its actual segment height and its virtual segment height. Next, in step S1202, the system may compare the predicted segment width of each visible segment with the current maximum segment width. In one embodiment, the predicted segment width of a visible segment may be the sum of its actual segment width and its virtual segment width. In step S1203, if the maximum predicted segment width of each visible segment is greater than the current maximum segment width, the system stores the maximum segment width of each visible segment as the new maximum predicted segment width for the predicted canvas width. FIG13 depicts an example of a flowchart for executing steps S1201 to S1203. In step S1301, the system may designate a segment as the current segment. For example, initially, the system may designate the first segment of a graphics programming language file as the current segment. Next, the system may verify that the current segment is a visible segment (step S1302). If so, in step S1303, the system verifies whether the predicted segment width of the current segment is the maximum segment width compared to the current maximum segment width. It should be understood that the system may compare the predicted segment width with the initial canvas width or directly designate the predicted segment width of the current segment as the maximum segment width. In step S1304, if the predicted segment width is greater, the system updates the predicted canvas width and replaces the predicted segment width with the maximum segment width. Next, in step S1305, the system accumulates the predicted segment height of the current segment into the predicted canvas height. Then, if a next segment exists, the system may designate the next segment as the current segment and repeat steps S1301 to S1306. If not, in step S1307, the system stores the predicted canvas height and predicted canvas width in the content index and ends step S24. In another embodiment, the predicted segment width and predicted segment height of each segment in the graphics programming language file are stored in a segment width list and a segment height list in the content index, respectively. Therefore, the system can identify the maximum predicted segment width from the segment width list as the predicted canvas width and calculate the predicted canvas height by summing all predicted segment heights in the segment height list.

[0066] For example, in the embodiment shown in FIG. 14 , the predicted canvas height H of the canvas 11 is canvas It can be calculated by summing the predicted segment heights of all segments in the graphics programming language file 10. Therefore, the predicted canvas width H canvas Equal to the actual height H of segment 1 SEC,ACTUAL[1], the actual height H of section 2 SEC,ACTUAL[2] , virtual height H of segment 2 SEC,VIRTUAL[2] and the segment height H of the remaining segments SEC,VIRTUAL[3:6] If the predicted segment width of segment 1 is greater than the predicted segment width of segment 2, the predicted segment width W canvas Equal to the actual width W of segment 1 SEC,ACTUAL[1] and the virtual width W of segment 1 SEC,VIRTUAL[1] The sum of .

[0067] In one embodiment, if scroll bars have not been generated, the system may generate a horizontal scroll bar based on the predicted canvas width and a vertical scroll bar based on the predicted canvas height. In another embodiment, if scroll bars have been previously generated, the system may adjust the scroll bars based on the size and position of the visible area. The predicted canvas height and predicted canvas width are used to calculate the size of the canvas. In addition to scroll bars, other user interfaces may be provided to allow the user to determine the position of the visible area for displaying sections and objects of a graphics programming language file. For example, a small canvas preview image may provide an overview of the entire canvas and allow the user to click or drag to select the visible area. Arrow icons for moving the visible area up, down, left, or right may also be provided as an alternative.

[0068] In step S25, the system then displays at least one visual object in the visual area. In one embodiment, the at least one visual object may include only one visual object, or in another embodiment, multiple visual objects. In one embodiment, the system may generate a layout image based on the detailed drawing description for each of the at least one visual object. A detailed drawing description may be generated for each of the at least one visual object. The detailed drawing description includes all necessary information for the drawing routine used to render the visual object, such as the object's actual height and width, object type, object name, object annotation, input or output variables, and the like. The detailed drawing description for an object may be stored in the object information for that object in the content index. In one embodiment, the detailed drawing description is instead stored in the visual object list. In one embodiment, if a section label object and / or section annotation object are visible for a section, the system may also generate a detailed drawing description for each of them. However, if the system has already generated a detailed drawing description in step S24, this step may be omitted. In one embodiment, when an object-oriented programming language is used to implement the system, program objects are used to implement the detailed drawing description and various functions. This program object is distinct from the objects of a graphics programming language file to be displayed by the disclosed system and method. For example, a detailed diagram includes a graphics data object and the location of the graphics data object. In one embodiment, the graphics data object may specify the brightness and / or color of each pixel used to render the image of the object. However, detailed diagrams may also be implemented in other data structures, such as a database. After generating a detailed diagram for each visual object, the system's drawing routine generates and displays a layout image of all visual objects to be displayed in the visual area. As previously described, some visual objects may be displayed completely, while others may be displayed partially.

[0069] In one embodiment, step S25 may further include steps S1501 to S1504 as shown in FIG15 . In step S1501, the system designates a segment in the visible segments as the current segment and, for display, parses the segment index of the current segment in the content index. In one embodiment, the system may select the segment from a list of visible segments in the content index. In one embodiment, the system may parse the image specifications of the segment label object and the segment annotation object, and render and display the segment label object and the segment annotation object. In one embodiment, the system may parse the segment index to obtain the segment background setting, and render and display the background of the visible segment.

[0070] Next, in step S1503, the system designates an object from the visible objects in the current section as the current object and parses its object information in the content index for display. In one embodiment, the system may select the object from a list of visible objects in the current section in the content index. In another embodiment, the system may parse the current object's detailed description in the object information and render and display the object.

[0071] In step S1503, the system determines whether there is a next visual object in the current segment. In one embodiment, the system may determine this based on the list of visual objects in the content index. If so, the system returns to step S1502 and designates the next visual object as the current object and parses its object information. Steps S1502 to S1503 may be repeated until there are no more visual objects in the current segment. Next, in step S1504, the system determines whether there is a next visual segment. In one embodiment, the system may determine this based on the list of visual segments in the content index. If so, the system returns to step S1501 to designate the next segment as the current segment and parse its segment index. Steps S1501 to S1504 may be repeated until there are no more visual segments. In another embodiment, the system may generate and display the image of the entire visible area including all visible objects and visible segments at once based on the information parsed in steps S1501 to S1504, rather than displaying the visible objects and visible segments one by one.

[0072] FIG16A depicts an image of a portion of a graphical programming language file based on a content index, wherein the portion is within a visible area, according to one embodiment of the present disclosure. The graphical programming language file 10 and the visible area 12 in FIG16A may be similar to the graphical programming language file 10 and the visible area 12 shown in FIG1 , FIG5 , FIG8 , FIG11 , or FIG14 , respectively. The content index may have a structure substantially similar to the content index IND_3 shown in FIG3 . In this embodiment, in addition to the image 16 of the visible area 12 , the system also generates a cursor 163 and horizontal and vertical scroll bars 162 and 161 for the visible area 12 . A user can use the cursor 163 to move the horizontal and vertical scroll bars 162 and 161 to input user commands that change the position of the visible area 12 . In another embodiment, the visible area 12 may be viewed as a sliding window of the canvas 11 , with user commands controlling the movement of the sliding window, causing the processor to parse a portion of the content index corresponding to the sliding window, thereby drawing and displaying an image corresponding to the portion of the content index. For a graphic programming language file 10 with massive content, since only a portion of the content index needs to be parsed and displayed in the sliding window, the required running time and hardware resources are limited by the sliding window.

[0073] Figure 16B depicts an image of a graphical programming language file that is part of a visible area according to a content index according to one embodiment of the present invention. The image of Figure 16B may be substantially similar to the image shown in Figure 16A. In this embodiment, the system may generate multiple element pages. In one embodiment, the file opened by the user includes multiple graphical programming language files, and each element page is generated corresponding to one of the graphical programming language files in the file. That is, the file can be divided into multiple pages or chapters to suit a specific software product (e.g., Page-Oriented CFC). Experiments have shown that for multiple projects, the processor and memory performance is almost the same because the required runtime and hardware resources are limited by the sliding window that the programmer is currently browsing. In other words, the loading time is almost constant and has nothing to do with how many files are running at the same time.

[0074] In step S26, the system may receive a user instruction to update the visible area to be displayed. The system may then determine the location of the new visible area on the current canvas. As previously described, various user interfaces may be used to allow the user to select the new location of the visible area, including but not limited to scroll bars, a small preview image of the canvas, arrow icons for moving the visible area up, down, left, and right, and the like.

[0075] Then, the system may return to execute step S23 and repeat steps S23 to S25 to display the portion of the graphic programming language file in the new visible area.

[0076] In step S23, the system retrieves and stores information associated with at least one visual object to be displayed in the visible area of ​​the new canvas into the content index. The system may first identify at least one visual object to be displayed in the new visible area based on the content index. As previously described, the system may also perform steps S91 to S95 for the new visible area, which may be substantially similar to the description previously used to display the initial visible area. With respect to step S92, if the segment index and object information for at least one visual object in the visible area have been previously retrieved, the system will not retrieve them again. Furthermore, if a portion of the new visible area is identical to a portion of the previously displayed visible area, the actual height and actual width of the objects in this area should have been previously calculated and therefore do not need to be recalculated in step S93. In one embodiment, the system may identify these already calculated objects by identifying their read status as true. However, in embodiments where the system generates a detailed diagram including a graphics data object for each visual object, the system may still need to regenerate the graphics data objects for the new visual area because the graphics data objects can be released from memory after the system receives a user instruction to move the visual image to a new location.

[0077] FIG17 depicts an example of a user updating a visual area to display a new area of ​​a graphical programming language file according to one embodiment of the present disclosure. The visual area 12 and graphical programming language file 10 shown in FIG17 may be substantially similar to the visual area 12 and graphical programming language file 10 shown in FIG1 , FIG5 , FIG8 , FIG11 , or FIG14 . In this embodiment, the system receives a user instruction to move the visual area 12 to a new visual area 12′. The system may first identify the location of the new visual area. In the embodiment shown in FIG17 , the system may need to identify the location of the visual area 12′ using the new origin and new diagonal vertices of the visual area, which are (X0′, Y0′) and (X3′, Y3′), respectively. The system may also identify the visual height Hv and visual width Wv of the visual area 12′, which in this embodiment are the same as the visual height Hv and visual width Wv of the visual area 12, respectively. In this embodiment, the system performs steps S1001 to S1009 as shown in FIG10 to execute step S23. In step S1001, the system assigns the initial segment as the current segment. The system may assign segment 1 as the initial segment and proceed to step S1002. As previously described, the system may determine whether the current segment is displayed outside the visible area 12' based on the predicted vertical coordinates of the current segment and the vertical coordinates of the visible area. If so, the system returns to S1001 and assigns the next segment as the current segment. The predicted vertical coordinate of a segment can be calculated by summing up the predicted segment heights of each segment before the segment. The predicted segment height of an unresolved segment is the preset segment height, and the predicted segment height of the resolved segment is the calculated predicted segment height, which can be calculated by referring to the contents of step S23. Therefore, when the preset segment height is 2 pixel units and the calculated predicted segment height H of segment 1 is SEC,CAL[1] The calculated predicted segment height H of segment 2 is 4 pixel units and SEC,CAL[2]When the pixel value is 3, the predicted vertical coordinates of segments 1 to 6 are 0, 4, 7, 9, 11, and 13 pixel units, respectively. Therefore, for segments 1 to 3, the system only repeats steps S1001 to S1002 because each of them is outside the visible area, that is, it is not a visible segment. Next, when the current segment is segment 4, the system determines that it is a visible segment and proceeds to step S1003. Because segment 4 has not been parsed before, the system needs to obtain the segment index of segment 4 and store it in the content index. The segment index of segment 4 can include the number of vertical objects and the number of horizontal objects. In this embodiment, although segment 4 contains a segment label object and a segment annotation object, because they are set to be hidden and therefore invisible to the user, the system does not need to obtain and store their information. In step S1004, the system may first designate the initial object, object 15A, as the current object. In step S1005, because it is unresolved, the system determines that it is outside the visible area based on the default object width and default object height. The system then returns to step S1004 and designates the next object, object 15B, as the current object, and determines that it is not outside the visible area and is therefore a visible object. In one embodiment, the system may add object 15B to a new visible object list established for the new visible area 12'. Because object information for object 15B was not previously retrieved, the system may need to retrieve the object information, which may include the variable "QO.0" and the type "Boolean." The system may then recognize that object 15B is also an unresolved object, meaning that its actual height and actual width have not been calculated. In one embodiment, the system may recognize this based on the fact that the read status of object 15B is false. The system calculates its actual height and actual width. In one embodiment, the system sets the read status of object 15B to true after the calculation. The system may execute steps S1001 to S1008 until all visible objects in all visible segments are identified. Next, the system stores the segment index, object information, and the actual width and actual height of all visible objects in all visible segments in the content index. However, in some embodiments, the system may store each of the segment index, object information, and the actual width and actual height of all visible objects in all visible segments as they are obtained. Because steps S1001 to S1009 may be substantially similar to those described above, their details may be omitted.

[0078] FIG18 depicts a schematic diagram of a content index according to one embodiment of the present disclosure. Content index IND_7′ is an updated content index derived from the content index used to display visible area 12. As shown in FIG18 , because segments 4 and 5 are partially located within visible area 12′, information regarding segments 4 and 5 is retrieved and stored as segment indexes in content index IND_7. Information regarding segments 1 and 2, because they are partially displayed within visible area 12, is retrieved and stored within the content index, remaining within the content index. On the other hand, because segments 3 and 6 have never been partially displayed, information regarding segments 3 and 6 is not parsed and stored within the content index. Please note that the blocks in content index IND_7′ refer to memory device space or registers allocated when the steps are executed. Blocks filled with dashed lines store data, while empty blocks do not store data.

[0079] The system then proceeds to step S24 to calculate the predicted canvas height and predicted canvas width of the canvas according to the content index. The details of step S24 for displaying the new visible area 12 ′ may be substantially similar to the above-mentioned step for displaying the content of the visible area 12 .

[0080] In the embodiment shown in FIG. 19 , the predicted canvas height H canvas The actual segment height H of segment 1 can be calculated by adding up the actual segment height H SEC,ACTUAL[1] , the actual section height H of section 2 SEC,ACTUAL[2] , virtual segment height H of segment 2 SEC,VIRTUAL[2] , virtual segment height H of segment 3 SEC,VIRTUAL[3] , the actual section height H of section 4 SEC,ACTUAL[4] , the actual section height H of section 5 SEC,ACTUAL[5] and the virtual segment height H of segment 5 SEC,VIRTUAL[5] To calculate and determine the predicted canvas width W canvas The segment width of segment 5 can be determined because the segment width of segment 5 is the largest among the segment width of segment 4, the segment width of segment 5, and the original predicted canvas width. Therefore, the predicted canvas width will be adjusted to the actual segment width W of segment 5. SEC,ACTUAL[5] and the virtual segment width W SEC,VIRTUAL[5] The sum of .

[0081] In one embodiment, the system can generate a new horizontal scroll bar or adjust the existing horizontal scroll bar based on the predicted canvas width, and generate a new vertical scroll bar or adjust the existing vertical scroll bar based on the predicted canvas height. In another embodiment, if scroll bars have already been generated, the system can generate / adjust the scroll bars based on the size and position of the visible area relative to the canvas. The predicted canvas height and predicted canvas width are used to calculate the canvas size. As previously mentioned, in addition to scroll bars, other user interfaces that allow the user to determine the position of the visible area to display sections and objects of a graphics programming language file can replace scroll bars and can also be generated / adjusted.

[0082] Then, in step S25, at least one visual object in the visible area is displayed. The details of step S25 may be substantially similar to those described above. It should be noted that because the system only needs to display the image of the visible area, even if there are more graphics programming language files to be parsed, the time it takes to generate the image can be kept relatively short. In this embodiment, segment 3 in Figure 19 is not a visible segment and is not parsed during the display of the new visible area 12'. In addition, the actual height and actual width of the objects in segment 3 are not calculated.

[0083] FIG20 depicts a schematic diagram of a display system 2000 according to one embodiment of the present disclosure. Display system 2000 includes a processor 2001, a memory device 2002, a display device 2003, and a user interface 2004. Display device 2003 is configured to display images corresponding to visible areas 12 and 12′. User interface 2004 is configured to receive user instructions. Memory device 2002 is configured to store a content index (e.g., content index IND_3, IND_7, or IND_7′), a graphics programming language file 10, and program code 2005. Processor 2001 is connected to display device 2003, user interface 2004, and memory device 2002, wherein program code 2005 is configured to instruct processor 2001 to execute the steps and associated sub-processes of a method for generating a content index, an image corresponding to visible area 12, and a new image corresponding to a new visible area 12′ according to user instructions. In one embodiment, the memory device 2002 may be at least one of a random access memory (RAM) device, a read-only memory (ROM) device, an electrically erasable programmable read-only memory (EEPROM) device, a flash memory device, a compact disc read-only memory (CD-ROM) device, a digital versatile disc (DVD) or optical disc storage device, a magnetic disk, an optical disc, an optical disc storage device, or other magnetic disk storage device. In one embodiment, the program code 2005 may be written in various programming languages, such as XML, JavaScript Object Notation (JSON), C#, C++, Java, Python, Objective-C, and the like.

[0084] The present disclosure has the advantage of shortening the time required to display objects in the visible area when a system opens a graphics programming language file containing a large amount of content, while maintaining the flexibility to display objects in a user-friendly manner. The aforementioned method and system do not generate an image for each object in the graphics programming language file when the system opens it, as generating images for all objects is very time-consuming. Instead, the disclosed method and system identify the objects to be displayed in the visible area based on a content index and generate images only for these objects. Furthermore, after the user selects a new visible area, the images generated for the objects displayed in the original visible area can be removed or deleted to free up more memory space. The system identifies the objects to be displayed in the visible area and calculates their actual object height and actual object width based on object information such as labels, input / output variables, or annotations. Thus, these objects can be displayed at the appropriate size to include all relevant information. Without this dynamic calculation, objects would be displayed in a fixed manner, and their content might not be fully displayed, making it more difficult for users to read and understand the content in the graphics programming language file. To display the new visible area after the original one, the system calculates the actual height and actual width of visible objects in the new visible area. Therefore, the system does not need to analyze the area between the original and new visible areas. Furthermore, to reduce processing time, the actual height and actual width of objects between the original and new visible areas are not calculated.

[0085] The description of the embodiments is provided to enable one skilled in the art to make and use the invention. Various modifications to the embodiments will be apparent to one skilled in the art, and the underlying principles established herein may be applied to other embodiments without requiring any inventive step. The claimed subject matter is not limited to the embodiments shown herein but is to be construed in the widest sense consistent with the principles and novel features disclosed herein. Other embodiments are contemplated within the spirit and scope of the invention. Therefore, the invention is intended to cover modifications and variations within the scope of the appended claims and their equivalents.

Claims

1. A method for displaying a portion of a graphics programming language file having a plurality of objects arranged in a plurality of sections, comprising: (1) creating a content index from the graphic programming language file; (2) obtaining and storing information about at least one visual object to be displayed in at least one visual section of the visual area of ​​the canvas into a content index; (3) calculating a predicted canvas height and a predicted canvas width of the canvas according to the content index; and (4) Displaying the at least one visual object in the visual area.

2. The method according to claim 1, wherein step (1) comprises the steps of: (1.1) parsing the graphic programming language file to obtain and store a total number of segments into the content index; (1.2) determining the position of the visible area; (1.3) identifying one or more potential viewable segments expected to be displayed in the viewable area according to predetermined segment heights; and (1.4) Obtain and store the horizontal object count, the vertical object count, and related object structure information of each of the one or more potential visible segments into the content index.

3. The method according to claim 2, before obtaining and storing information about the at least one visual object to be displayed in the visible area of ​​the canvas into the content index, further comprising: According to the content index, the canvas is created with an initial canvas height as the predicted canvas height and an initialized canvas width as the predicted canvas width. 4 . The method of claim 3 , wherein the initial canvas height is the total number of segments multiplied by the preset segment height, and the initial canvas width is the maximum number of horizontal objects of the one or more potentially visible segments multiplied by a default object width.

5. The method according to claim 1, wherein step (2) comprises the steps of: (2.1) identifying the at least one visual object to be displayed in at least one visual segment within the visual area; (2.2) obtaining a segment index and object information of the at least one visible object in the at least one visible segment; (2.3) calculating the actual width and actual height of the at least one visible object in the at least one visible segment according to the object information; (2.4) if the at least one visual object includes a plurality of visual objects and the at least one visual segment includes a plurality of visual segments, repeating steps (2.1) to (2.4) until all visual objects in all visual segments are identified; as well as (2.5) Storing the section index, the object information, and the actual widths and actual heights of all visible objects in all visible sections into the content index.

6. The method according to claim 5, wherein: In step (2.1), the at least one visible segment is first identified by: Determining the vertical coordinate of the visible area on the canvas; Calculating predicted vertical coordinates of the plurality of segments according to the content index; and The at least one segment having a predicted vertical coordinate corresponding to the vertical coordinate of the visible area on the canvas is identified.

7. The method of claim 6, wherein the predicted vertical coordinate of a segment is calculated by summing the predicted segment heights of each segment preceding the segment, the predicted segment height of an unresolved segment is a preset segment height, the predicted height of a resolved segment is the sum of the predicted column heights of each column in the resolved segment, the predicted column height of a column without a displayed object is a default object height, and the predicted column height of a column with at least one displayed object is a maximum actual object height.

8. The method according to claim 6, wherein: In step (2.1), the at least one visual object is identified by the following steps: Determining the horizontal coordinates of the visible area on the canvas; calculating predicted horizontal coordinates and predicted vertical coordinates of the plurality of objects in the at least one visible segment according to the content index; as well as The at least one visual object having predicted horizontal coordinates and predicted vertical coordinates corresponding to the horizontal coordinates and the vertical coordinates of the visual area on the canvas is identified.

9. The method of claim 8, wherein the predicted vertical coordinate of an object in at least one visible segment is calculated by summing the predicted segment heights of each segment preceding the segment and the predicted column heights of each column preceding the object in the segment, each segment being a resolved segment or an unresolved segment, the predicted segment height of an unresolved segment being a preset segment height, the predicted segment height of a resolved segment being the sum of the predicted column heights of each column in the resolved segment, the predicted column height of a column without a displayed object being a default object height, and the predicted column height of a column with at least one displayed object being a maximum actual object height.

10. The method of claim 9, wherein the predicted horizontal coordinate of an object in one of the at least one visible segment is calculated by summing the predicted object widths of each object preceding the object, each object being a displayed object or a non-displayed object, the predicted object width of the displayed object being the actual object width, and the predicted object width of the non-displayed object being a default object width.

11. The method according to claim 1, wherein step (2) comprises the steps of: (2a) assigning the initial segment as the current segment; (2b) determining whether the current segment is outside the visible area; (2c) if the current segment is not outside the visible area, obtaining a segment index of the current segment of the at least one visible segment; (2d) assigning the initial object in the current section as the current object; (2e) determining whether the current object of the current section is outside the visible area; (2f) if the current object is not outside the visible area, obtaining object information of the current object, which is the at least one visible object, and calculating the actual width and actual height of the current object; (2g) designating the next object as the current object and repeating steps (2.5) to (2.7) until all visible objects in the current segment are identified; and (2h) designating the next segment as the current segment and repeating steps (2.2) to (2.8) until all visible segments are identified; as well as (2i) Storing the section index, the object information, and the actual object widths and the actual object heights of all visible objects in all visible sections into the content index.

12. The method according to claim 11, wherein step (2c) further comprises: Sets the read status of the current section to true.

13. The method according to claim 11, wherein step (2f) further comprises: Sets the read status of the current object to true.

14. The method of claim 11, wherein step (2f) further comprises: A detailed view description is generated for the current object, wherein the detailed view description includes the actual height, the actual width, the object type, the object name, the input variables, and the output variables of the current object.

15. The method of claim 11, wherein step (2g) further comprises: Calculating a predicted segment width of the current segment by adding up the predicted object widths of each object that is included in a horizontal number of objects; Each object is a displayed object or a non-displayed object, the predicted width of the displayed object is the actual object width, and the predicted width of the non-displayed object is a default object width; as well as Calculating a predicted section height of the current section by summing the predicted column heights of each column in the current section; The predicted column height of a column without a displayed object is a default object height, and the predicted column height of a column with at least one displayed object is a maximum actual object height of the column.

16. The method according to claim 1, wherein step (3) comprises the steps of: (3.1) summing the predicted segment heights of each segment in the graphics programming language file to obtain the predicted canvas height; and (3.2) Comparing the predicted segment width of each visible segment with the current maximum segment width; and (3.3) If the maximum predicted segment width of each visible segment is greater than the current maximum segment width, store the maximum predicted segment width of each visible segment as a new maximum segment width for the maximum canvas width.

17. The method according to claim 1, wherein step (3) further comprises: generating a horizontal scroll bar according to the predicted canvas width; as well as Generate a vertical scroll bar based on the predicted canvas height.

18. The method according to claim 1, wherein step (4) further comprises: A layout image is generated for each of the at least one visual object according to a diagram specification.

19. A display system for displaying a portion of a graphics programming language file having a plurality of objects arranged in a plurality of sections, comprising: a display device for displaying an image of at least one visual object in a visible area corresponding to the canvas; A user interface for receiving user instructions; A memory device for storing the graphic programming language file, a content index of the graphic programming language file, and a program code; as well as A processor is connected to the display device, the user interface, and the memory device, wherein the program code is used to instruct the processor to perform operations including: (1) creating the content index from the graphic programming language file; (2) obtaining and storing information about the at least one visual object to be displayed in at least one visual section in the visual area of ​​the canvas into the content index; (3) calculating a predicted canvas height and a predicted canvas width of the canvas according to the content index; and (4) Displaying the at least one visual object in the visual area.

Images