Navigation view generation method of online collaborative drawing board, related device and medium

Abstract

The invention provides a navigation view generation method of an online collaborative drawing board, a related device and a medium. The method comprises the following steps: generating an envelope graph surrounding each drawing board element in the online collaborative drawing board; determining a reduction ratio based on the first size of the envelope graph and the second size of the navigation view; based on the first position of each drawing board element relative to a first original point in the online collaborative drawing board and the reduction rate, determining a second position of each reduced drawing board element relative to the first original point; based on the position relation between a second original point and the first original point in the navigation view, converting the second position into a third position of each reduced drawing board element relative to the second original point; and at the third position, rendering the shrunk drawing board element, thereby generating and displaying a rendered navigation view. According to the embodiment of the invention, the navigation view generation efficiency and operability of the online collaborative drawing board can be improved. The embodiment of the invention can be applied to scenes such as opening and editing of the navigation view in the online collaborative drawing board.

Description

Technical Field

[0001] The present disclosure relates to the field of document processing, and in particular to a method for generating a navigation view of an online collaborative drawing board, a related device and a medium. Background Art

[0002] Online collaborative drawing board is a platform that allows different users to collaborate and share in real time at the same time. Users who log in to the online collaborative drawing board can draw pictures, import text or create files on the online collaborative drawing board, and these operations will also be displayed in real time to other users who log in to the online collaborative drawing board.

[0003] The online collaboration canvas is relatively large, and usually only a small part of it is displayed to the user. However, when the user needs to view other canvas objects outside the currently displayed screen in the online collaboration canvas, he needs to slide back and forth on the screen to view other canvas objects. There is a lack of a method to quickly jump to other canvas objects that need to be viewed. Although there are methods in some other fields that use navigation views to quickly complete the jump of elements in the main interface, the navigation view generation process is relatively complicated, and the view elements displayed by the navigation view are relatively small, which is very difficult to operate. Summary of the invention

[0004] The embodiments of the present disclosure provide a method, a related device and a medium for generating a navigation view of an online collaborative drawing board, which can improve the efficiency and operability of generating a navigation view of an online collaborative drawing board.

[0005] According to one aspect of the present disclosure, a method for generating a navigation view of an online collaborative drawing board is provided, comprising:

[0006] Generate an envelope graphic surrounding each drawing board element in the online collaborative drawing board;

[0007] determining a reduction ratio based on a first size of the envelope graphic and a second size of the navigation view;

[0008] Based on the first position of each of the artboard elements relative to the first origin in the online collaborative artboard and the reduction ratio, determining the second position of each of the reduced artboard elements relative to the first origin;

[0009] Based on the positional relationship between the second origin and the first origin in the navigation view, converting the second position into a third position of each reduced artboard element relative to the second origin;

[0010] At the third position, the reduced artboard element is rendered, thereby generating and displaying the rendered navigation view.

[0011] According to one aspect of the present disclosure, a navigation view generating device for an online collaborative drawing board is provided, comprising:

[0012] A first generating unit, configured to generate an envelope graphic surrounding each drawing board element in the online collaborative drawing board;

[0013] A first determining unit, configured to determine a reduction ratio based on a first size of the envelope graphic and a second size of the navigation view;

[0014] A second determining unit, configured to determine, based on the first position of each of the artboard elements relative to the first origin in the online collaborative artboard and the reduction ratio, a second position of each of the reduced artboard elements relative to the first origin;

[0015] a position conversion unit, configured to convert the second position into a third position of each reduced artboard element relative to the second origin based on a positional relationship between the second origin and the first origin in the navigation view;

[0016] An element rendering unit is used to render the reduced artboard element at the third position, thereby generating and displaying the rendered navigation view.

[0017] Optionally, the first generating unit is specifically configured to:

[0018] Acquire the maximum first coordinate and the minimum first coordinate of each drawing board element in the online collaborative drawing board along the first axis, and the maximum second coordinate and the minimum second coordinate along the second axis, wherein the first axis is perpendicular to the second axis;

[0019] Generate a first line passing through the maximum first coordinate and perpendicular to the first axis, a second line passing through the minimum first coordinate and perpendicular to the first axis, a third line passing through the maximum second coordinate and perpendicular to the second axis, and a fourth line passing through the minimum second coordinate and perpendicular to the second axis;

[0020] A figure enclosed by the first line, the second line, the third line, and the fourth line is determined as the envelope figure.

[0021] Optionally, the first size includes a first width and a first height, and the second size includes a second width and a second height;

[0022] The first determining unit is specifically configured to:

[0023] Acquire the maximum first coordinate and the minimum first coordinate of each drawing board element in the online collaborative drawing board along the first axis, and the maximum second coordinate and the minimum second coordinate along the second axis, wherein the first axis is perpendicular to the second axis;

[0024] Determine the first width based on the maximum first coordinate and the minimum first coordinate, and determine the first height based on the maximum second coordinate and the minimum second coordinate;

[0025] Obtain a maximum third coordinate and a minimum third coordinate of a boundary of the navigation view along the first axis, and a maximum fourth coordinate and a minimum fourth coordinate along the second axis;

[0026] Determine the second width based on the maximum third coordinate and the minimum third coordinate, and determine the second height based on the maximum fourth coordinate and the minimum fourth coordinate;

[0027] The reduction ratio is determined based on the first width, the first height, the second width, and the second height.

[0028] Optionally, the first determining unit is further configured to:

[0029] determining a first sub-reduction ratio based on the second width and the first width;

[0030] determining a second sub-reduction ratio based on the second height and the first height;

[0031] The minimum value of the first sub-reduction ratio and the second sub-reduction ratio is determined as the reduction ratio.

[0032] Optionally, the first position is embodied as a first reference point coordinate of a first rectangular envelope surrounding the artboard element relative to the first origin, a third width and a third height of the first rectangular envelope; the second position is embodied as a second reference point coordinate of a second rectangular envelope surrounding the reduced artboard element relative to the first origin, a fourth width and a fourth height of the second rectangular envelope;

[0033] The second determining unit is specifically configured to:

[0034] Determine the coordinates of the second reference point based on the coordinates of the first reference point and the reduction ratio;

[0035] determining the fourth width based on the third width and the reduction ratio;

[0036] Based on the third height and the reduction ratio, the fourth height is determined.

[0037] Optionally, the navigation view generating device further includes:

[0038] A second generating unit, configured to generate the first rectangular envelope surrounding the drawing board element;

[0039] A first acquisition unit, configured to acquire the coordinates of the first reference point of the first rectangular envelope relative to the first origin;

[0040] A second acquisition unit, configured to acquire a maximum fifth coordinate and a minimum fifth coordinate of the first rectangular envelope along a first axis, and a maximum sixth coordinate and a minimum sixth coordinate along a second axis, wherein the first axis is perpendicular to the second axis;

[0041] a third determining unit, configured to determine the third width based on the maximum fifth coordinate and the minimum fifth coordinate;

[0042] a fourth determining unit, configured to determine the third height based on the maximum sixth coordinate and the minimum sixth coordinate;

[0043] The first integration unit is used to integrate the first reference point coordinates, the third width, and the third height into the first position.

[0044] Optionally, the positional relationship includes a first position offset of the second origin relative to the first origin on the first axis, and a second position offset of the second origin relative to the first origin on the second axis; the second position is reflected as a second reference point coordinate of a second rectangular envelope surrounding the reduced artboard element relative to the first origin, a fourth width and a fourth height of the second rectangular envelope; the third position is reflected as a third reference point coordinate of a second reference point of the second rectangular envelope surrounding the reduced artboard element relative to the second origin, a fifth width and a fifth height of the second rectangular envelope;

[0045] The position conversion unit is specifically used for:

[0046] determining the third reference point coordinates based on the second reference point coordinates, the first position offset, the second position offset, and the reduction ratio;

[0047] The fifth width is determined to be equal to the fourth width, and the fifth height is determined to be equal to the fourth height.

[0048] Optionally, the second reference point coordinates include a first sub-coordinate along the first axis and a second sub-coordinate along the second axis; the third reference point coordinates include a third sub-coordinate along the first axis and a fourth sub-coordinate along the second axis;

[0049] The position conversion unit is further specifically used for:

[0050] generating an affine transformation matrix based on the first position offset, the second position offset, and the reduction ratio;

[0051] The third and fourth partial coordinates are determined based on the first partial coordinates, the second partial coordinates, and the affine transformation matrix.

[0052] Optionally, the navigation view generating device further includes:

[0053] a fifth determining unit, configured to determine a fifth position of a first screen boundary after reduction relative to the first origin based on a fourth position of a first screen boundary currently displayed in the online collaborative drawing board relative to the first origin and the reduction ratio;

[0054] a first conversion unit, configured to convert the fifth position into a sixth position of the first screen boundary after reduction relative to the second origin based on the positional relationship between the second origin and the first origin in the navigation view;

[0055] The first rendering unit is configured to render the reduced first screen boundary at the sixth position.

[0056] Optionally, the fourth position is embodied as a fourth reference point coordinate of a fourth reference point of the first screen boundary relative to the first origin, a sixth width and a sixth height of the first screen boundary; the fifth position is embodied as a fifth reference point coordinate of a fifth reference point of the first screen boundary after reduction relative to the first origin, a seventh width and a seventh height of the first screen boundary after reduction;

[0057] The fifth determining unit is specifically configured to:

[0058] Determining the fifth reference point coordinates based on the fourth reference point coordinates and the reduction ratio;

[0059] determining the seventh width based on the sixth width and the reduction ratio;

[0060] Based on the sixth height and the reduction ratio, the seventh height is determined.

[0061] Optionally, the navigation view generating device further includes:

[0062] A third acquisition unit, configured to acquire coordinates of the fourth reference point of the first screen boundary relative to the first origin;

[0063] a fourth acquisition unit, configured to acquire a maximum seventh coordinate and a minimum seventh coordinate of the first screen boundary along a first axis, and a maximum eighth coordinate and a minimum eighth coordinate along a second axis, wherein the first axis is perpendicular to the second axis;

[0064] a sixth determining unit, configured to determine the sixth width based on the maximum seventh coordinate and the minimum seventh coordinate;

[0065] a seventh determining unit, configured to determine the sixth height based on the maximum eighth coordinate and the minimum eighth coordinate;

[0066] The second integration unit is used to integrate the fourth reference point coordinates, the sixth width, and the sixth height into the fourth position.

[0067] Optionally, the navigation view generating device further includes:

[0068] A first response unit, configured to determine a first center position of the reduced first artboard element in response to triggering of the reduced first artboard element outside the reduced first screen boundary in the navigation view;

[0069] A fifth acquisition unit, configured to acquire, in the navigation view, a reduced second picture centered at the first center position and having the same size as the reduced first picture;

[0070] The first display unit is used to restore the reduced second picture to a second picture based on the reduction ratio, and display the second picture instead of the first picture.

[0071] Optionally, the navigation view generating device further includes:

[0072] a second response unit, configured to, in response to triggering of a reduced first artboard element outside a boundary of the reduced first screen in the navigation view, obtain a reduced third screen including the reduced first artboard element in the navigation view, wherein the reduced third screen has the same size as the reduced first screen;

[0073] A translation unit, used for translating the reduced third picture in the navigation video until it moves to the reduced painting board element containing the largest number;

[0074] The second display unit is used to restore the reduced third picture containing the largest number of the reduced artboard elements to a third picture based on the reduction ratio, and display the third picture to replace the first picture.

[0075] Optionally, the navigation view generating device further includes:

[0076] a third response unit, in response to a drag operation on the reduced second artboard element in the navigation view to a seventh position relative to the second origin, moving the reduced second artboard element to the seventh position;

[0077] a second conversion unit, configured to convert the seventh position into an eighth position of a second artboard element relative to the first origin based on the positional relationship between the second origin and the first origin in the navigation view;

[0078] A moving unit, used for moving the second drawing board element to the eighth position in the online collaborative drawing board;

[0079] The returning unit is used to return to the step of determining the reduction ratio based on the first size of the envelope graphic and the second size of the navigation view if the envelope graphic surrounding each drawing board element in the online collaborative drawing board changes after moving to the eighth position.

[0080] Optionally, the first generating unit is further configured to:

[0081] Determine a first viewing number of each drawing board element in the online collaborative drawing board by a target object;

[0082] Determine a second number of times each drawing board element in the online collaborative drawing board is viewed by each platform object other than the target object;

[0083] Determine a first target artboard element from among the artboard elements based on the first viewing number and the second viewing number;

[0084] The envelope graphic surrounding each of the first target artboard elements in the online collaborative artboard is generated.

[0085] Optionally, the first generating unit is further configured to:

[0086] Determine, among the various drawing board elements in the online collaborative drawing board, a second target drawing board element generated by the target object;

[0087] The envelope graphic surrounding each of the second target artboard elements in the online collaborative artboard is generated.

[0088] According to one aspect of the present disclosure, an electronic device is provided, including a memory and a processor, wherein the memory stores a computer program, and the processor implements the above-mentioned method for generating a navigation view of an online collaborative drawing board when executing the computer program.

[0089] According to one aspect of the present disclosure, a computer-readable storage medium is provided, wherein the storage medium stores a computer program, and when the computer program is executed by a processor, the navigation view generation method of the online collaborative drawing board as described above is implemented.

[0090] According to one aspect of the present disclosure, a computer program product is provided, which includes a computer program, and the computer program is read and executed by a processor of a computer device, so that the computer device executes the navigation view generation method of the online collaborative drawing board as described above.

[0091] In the disclosed embodiment, an envelope graphic is generated to surround each drawing board element in the online collaborative drawing board, for example, a minimum envelope graphic is generated close to all drawing board elements in the online collaborative drawing board. Based on the first size of the envelope graphic and the second size of the navigation view, the reduction rate is determined. Based on the first position of each drawing board element relative to the first origin in the online collaborative drawing board and the reduction rate, the second position of each reduced drawing board element relative to the first origin is determined. However, the second position is only a relative position relative to the first origin in the online collaborative drawing board, and must be converted to a relative position relative to the second origin of the navigation view before the screen element can be rendered in the navigation view according to the relative position. Therefore, based on the positional relationship between the second origin and the first origin in the navigation view, the second position is converted into a third position of each reduced drawing board element relative to the second origin. Then, at the third position, the reduced drawing board element is rendered, thereby generating and displaying the rendered navigation view. Since there is a large blank space in the online collaborative drawing board, and there is no drawing board element in the blank space, generating a navigation view based on the area of ​​the entire online collaborative drawing board often results in the reduced drawing board elements in the navigation view being too small and difficult to operate. By generating an envelope graphic that surrounds each canvas element in the online collaborative canvas, removing the surrounding blank areas, and determining the reduction ratio, the generated navigation view does not contain many blank areas, thereby improving the convenience of operation of the navigation view. Since the above method determines the reduction ratio, and based on the first position of each canvas element relative to the first origin and the reduction ratio, quickly obtains the second position of the canvas element relative to the first origin after reduction, and through the positional relationship between the second origin in the navigation view and the first origin in the online collaborative canvas, quickly converts the second position to a third position relative to the second origin, and renders based on the third position, quickly obtains a navigation view including each canvas element after reduction, so that the user can operate the canvas elements outside the current display screen according to the navigation view, thereby improving the efficiency of generating the navigation view of the online collaborative canvas.

[0092] Other features and advantages of the present disclosure will be described in the following description, and partly become apparent from the description, or understood by practicing the present disclosure. The purpose and other advantages of the present disclosure can be realized and obtained by the structures particularly pointed out in the description, claims and drawings. BRIEF DESCRIPTION OF THE DRAWINGS

[0093] The accompanying drawings are used to provide further understanding of the technical solution of the present disclosure and constitute a part of the specification. Together with the embodiments of the present disclosure, they are used to explain the technical solution of the present disclosure and do not constitute a limitation on the technical solution of the present disclosure.

[0094] Figure 1 is an architecture diagram of a system to which the method for generating a navigation view of an online collaborative drawing board according to an embodiment of the present disclosure is applied;

[0095] FIG. 2A to FIG. 2C It is a schematic diagram of an interface for opening an online collaborative drawing board navigation view scene according to an embodiment of the present disclosure;

[0096] Figure 3 It is an overall flow chart of a method for generating a navigation view of an online collaborative drawing board provided by an embodiment of the present disclosure;

[0097] Figure 4A is a schematic diagram of an envelope graph provided by an embodiment of the present disclosure;

[0098] Figure 4B It is a schematic diagram of reducing the elements of the drawing board provided by an embodiment of the present disclosure;

[0099] Figure 4C is a schematic diagram of a second origin of view navigation provided by an embodiment of the present disclosure;

[0100] Figure 4D is another schematic diagram of a second origin of view navigation provided by an embodiment of the present disclosure;

[0101] Figure 5 yes Figure 3 A flow chart of generating an envelope graph in step 310;

[0102] Figure 6 yes Figure 5 A schematic diagram of generating envelope graphics in ;

[0103] Figure 7 is a flow chart of generating an envelope graphic based on a first target artboard element provided by an embodiment of the present disclosure;

[0104] Figure 8 yes Figure 7 A schematic diagram of generating envelope graphics in ;

[0105] Fig. 9 is a flow chart of generating an envelope graphic based on a second target artboard element provided by an embodiment of the present disclosure;

[0106] Fig.10 yes Fig. 9 A schematic diagram of generating an envelope graphic based on a second target artboard element;

[0107] Fig.11 yes Figure 3 A flow chart of determining the reduction ratio in step 320;

[0108] FIG. 12A to FIG. 12C is a schematic diagram of generating a navigation view based on envelope graphics of multiple different sizes provided by an embodiment of the present disclosure;

[0109] Fig.13 yes Fig.11 A flow chart of determining the reduction ratio in step 1150;

[0110] Fig.14 yes Figure 3 A flowchart of determining the second position of each reduced artboard element relative to the first origin in step 330;

[0111] Fig.15A and Fig. 15B yes Fig.14 A schematic diagram of determining a second position of each reduced artboard element relative to the first origin;

[0112] Fig.16 yes Figure 3 A flow chart of converting the second position into a third position in step 340;

[0113] Fig.17 yes Fig.16 A flowchart of determining the coordinates of the third reference point in step 1610;

[0114] Fig.18 is a flow chart for determining a first position provided by an embodiment of the present disclosure;

[0115] Fig.19 is a flow chart of rendering a first screen boundary after zooming out in a navigation view provided by an embodiment of the present disclosure;

[0116] Fig. 20 is a schematic diagram of a first screen boundary after being reduced provided by an embodiment of the present disclosure;

[0117] Fig.21 is a schematic diagram of converting a first screen boundary into a reduced first screen boundary provided by an embodiment of the present disclosure;

[0118] Fig. 22 yes Fig.19 A flowchart of step 1910 determining a fifth position of the first picture boundary after reduction relative to the first origin;

[0119] Fig.23 is a flow chart for determining a fourth position provided by an embodiment of the present disclosure;

[0120] Fig.24 It is a flow chart of triggering a first reduced artboard element outside the boundary of the first reduced screen in the navigation view provided by an embodiment of the present disclosure;

[0121] Fig.25A and Fig.25B It is a schematic diagram of triggering a first reduced artboard element outside the boundary of the first reduced screen in the navigation view provided by an embodiment of the present disclosure;

[0122] Fig.26 is another schematic diagram of triggering a first reduced artboard element outside a boundary of a first reduced screen in a navigation view provided by an embodiment of the present disclosure;

[0123] Fig. 27 is another schematic diagram of triggering a first reduced artboard element outside a boundary of a first reduced screen in a navigation view provided by an embodiment of the present disclosure;

[0124] Fig.28 is a flow chart of dragging a reduced second artboard element in a navigation view provided by an embodiment of the present disclosure;

[0125] Fig.29 It is a schematic diagram of dragging a reduced second artboard element in a navigation view provided by an embodiment of the present disclosure;

[0126] Fig.30 It is a schematic diagram of realizing synchronization between an online collaborative drawing board and a navigation view provided by an embodiment of the present disclosure;

[0127] Fig.31 is a schematic diagram of performing a drag operation on the boundary of a first screen after being reduced in a navigation view provided by an embodiment of the present disclosure;

[0128] Fig.32 is a module diagram of a navigation view generating device of an online collaborative drawing board according to an embodiment of the present disclosure;

[0129] Fig.33 According to the embodiment of the present disclosure, Figure 3 The terminal structure diagram of the navigation view generation method of the online collaborative drawing board shown;

[0130] Fig.34 According to the embodiment of the present disclosure, Figure 3 The server structure diagram of the navigation view generation method of the online collaborative drawing board is shown. DETAILED DESCRIPTION

[0131] In order to make the purpose, technical solution and advantages of the present disclosure more clear, the present disclosure is further described in detail below in conjunction with the accompanying drawings and embodiments. It should be understood that the specific embodiments described herein are only used to explain the present disclosure and are not used to limit the present disclosure.

[0132] Before further describing the embodiments of the present disclosure in detail, the nouns and terms involved in the embodiments of the present disclosure are described. The nouns and terms involved in the embodiments of the present disclosure are subject to the following interpretations:

[0133] Online collaboration drawing board: Online collaboration refers to multiple objects cooperating with each other through the Internet and other communication methods to complete a task together. The online collaboration drawing board refers to a drawing board that can provide online collaboration functions for multiple objects. Each object can be edited on the drawing board to exchange information. In addition, objects can draw images, place text boxes, draw tables, etc. on the drawing board. In addition, the online collaboration drawing board can also be considered a smart whiteboard, which is a canvas with wireless expansion space, suitable for a variety of scenarios such as project reports, brainstorming, and online teaching.

[0134] View navigation: is a method to help users switch views on a web page.

[0135] Online collaborative drawing board is a platform that allows different users to collaborate and share in real time at the same time. Users who log in to the online collaborative drawing board can draw pictures, import text or create files on the online collaborative drawing board, and these operations will also be displayed in real time to other users who log in to the online collaborative drawing board.

[0136] The online collaboration canvas is relatively large, and usually only a small part of it is displayed to the user. However, when the user needs to view other canvas objects outside the currently displayed screen in the online collaboration canvas, he needs to slide back and forth on the screen to view other canvas objects. There is a lack of a method to quickly jump to other canvas objects that need to be viewed. Although there are methods in some other fields that use navigation views to quickly complete the jump of elements in the main interface, the navigation view generation process is relatively complicated, and the view elements displayed by the navigation view are relatively small, which is very difficult to operate.

[0137] Based on this, the embodiment of the present disclosure provides a method for generating a navigation view of an online collaborative drawing board, a related device and a medium. The method for generating a navigation view of an online collaborative drawing board can improve the efficiency and operability of generating a navigation view of an online collaborative drawing board.

[0138] System architecture and scenario description of the application of the embodiments of the present disclosure

[0139] Figure 1 The system architecture diagram is applied to the method for generating a navigation view of an online collaborative drawing board according to an embodiment of the present disclosure, and includes: an object terminal 110 , the Internet 120 , a gateway 130 , and a server 140 .

[0140] The object terminal 110 is a device used by the object to view the online collaborative drawing board, and the object can also edit the online collaborative drawing board through the object terminal 110. It includes various forms such as desktop computers, laptops, PDAs (personal digital assistants), mobile phones, car terminals, home theater terminals, and dedicated terminals. In addition, it can be a single device or a collection of multiple devices. For example, multiple devices are connected through a local area network and share a display device to work together, forming a terminal. The object terminal 110 can also communicate with the Internet 120 in a wired or wireless manner to exchange data.

[0141] The gateway 130 is also called an internetwork connector or a protocol converter. The gateway 130 realizes network interconnection at the transport layer and is a computer system or device that acts as a converter. The gateway 130 is a translator between two systems that use different communication protocols, data formats or languages, or even completely different architectures. At the same time, the gateway 130 can also provide filtering and security functions. The message sent by the object terminal 110 to the server 140 is sent to the corresponding server 140 through the gateway 130. The message sent by the server 140 to the object terminal 110 is also sent to the corresponding object terminal 110 through the gateway 130.

[0142] The server 140 refers to a computer system that can provide navigation view generation services of online collaborative drawing boards to the object terminal 110. Compared with the object terminal 110, the server 140 has higher requirements in terms of stability, security, performance, etc. The server 140 can be a high-performance computer in a network platform, a cluster of multiple high-performance computers, a part of a high-performance computer (such as a virtual machine), a combination of parts of multiple high-performance computers (such as virtual machines), etc. The server 140 can also communicate with the Internet 120 in a wired or wireless manner to exchange data.

[0143] The embodiments of the present disclosure may be applied in a variety of scenarios, such as a scenario regarding opening an online collaborative drawing board navigation view scenario.

[0144] Figure 2A is a schematic diagram of an online collaborative drawing board provided by an embodiment of the present disclosure. The online collaborative drawing board is essentially an infinite canvas. Figure 2A The online collaborative artboard shown is only part of the online collaborative artboard. Figure 2A It includes all the elements of the online collaborative artboard. In addition, Figure 2A The dotted frame in the online collaborative drawing board shown is the border of the window of the online collaborative drawing board at the target terminal. Figure 2B shown.

[0145] Reference Figure 2B , Figure 2B The online collaborative drawing board window shown includes a navigation view control. Clicking the navigation view control can generate a navigation view of the online collaborative drawing board.

[0146] Figure 2C The following is a schematic diagram of the interface of the online collaborative drawing board window obtained by the method for generating the navigation view of the online collaborative drawing board provided in the embodiment of the present disclosure. The navigation view can intuitively display the positional relationship between the various drawing board elements, and the blank area in the navigation view is small, while the various drawing board elements are large, which improves the operational convenience of the navigation view. In addition, the generation efficiency of the navigation view method of the online collaborative drawing board in the embodiment of the present disclosure is significantly improved, and the loading time of the navigation view is only 2 seconds.

[0147] It should be understood that the above content only illustrates some application scenarios of the present disclosure. The business scenarios to which the present disclosure can be applied may include but are not limited to the specific embodiments listed above.

[0148] General description of the disclosed embodiments

[0149] It should be emphasized that the embodiments of the present disclosure can be applied to a variety of application scenarios, such as the generation and update of navigation views in online collaborative drawing boards, and the dragging of elements in navigation views. The related art lacks a method for quickly jumping to display other drawing board objects that need to be viewed. In addition, although there are methods in some other fields that use navigation views to quickly complete the jump of elements in the main interface, the navigation view generation process is relatively complicated, and the view elements displayed by the navigation view are relatively small, which is very difficult to operate. Some embodiments of the present disclosure provide a navigation view generation method, related devices and media for an online collaborative drawing board, which can improve the efficiency and operability of the navigation view generation of the online collaborative drawing board.

[0150] The method for generating a navigation view of an online collaborative drawing board is to process each drawing board element in the online collaborative drawing board to generate a navigation view. The method can quickly obtain a navigation view and enable an object to operate drawing board elements outside the current display screen according to the navigation view, thereby improving the efficiency of generating a navigation view of the online collaborative drawing board.

[0151] The method for generating a navigation view of an online collaborative drawing board according to the embodiment of the present disclosure may be executed on the target terminal 110 , may be executed on the server 140 , or may be executed partially on the target terminal 110 and the other partially on the server 140 .

[0152] like Figure 3 As shown, according to one embodiment of the present disclosure, a method for generating a navigation view of an online collaborative drawing board includes:

[0153] Step 310: Generate an envelope graphic surrounding each drawing board element in the online collaborative drawing board;

[0154] Step 320: Determine a reduction ratio based on the first size of the envelope graphic and the second size of the navigation view;

[0155] Step 330: Based on the first position of each artboard element relative to the first origin in the online collaborative artboard and the reduction ratio, determine the second position of each reduced artboard element relative to the first origin;

[0156] Step 340: based on the positional relationship between the second origin and the first origin in the navigation view, convert the second position into a third position of each reduced artboard element relative to the second origin;

[0157] Step 350: Render the zoomed-out artboard element at the third position, thereby generating and displaying a rendered navigation view.

[0158] Steps 310 to 350 are described in detail below.

[0159] In step 310 , an envelope graphic surrounding each drawing board element in the online collaborative drawing board is generated.

[0160] Artboard elements refer to elements of an online collaborative artboard, which may be pictures, shapes, tables, text boxes, etc. Figure 4A The online collaborative drawing board shown includes five drawing board elements, namely, a hexagon, a teardrop shape, a text box, a diamond shape, a V shape, and a five-pointed star.

[0161] The envelope graphic refers to the smallest graphic that surrounds each drawing board element in the online collaborative drawing board. The envelope graphic can be a rectangle, a circle, a polygon, or even any irregular image. The envelope graphic can be set as needed. In order to reduce the processing data in the process of generating the navigation view, the embodiment of the present disclosure sets the envelope graphic to a rectangle. For example, Figure 4A The envelope graphic in is a rectangle, and the rectangle is the minimum rectangle that encloses each artboard element in the online collaborative artboard.

[0162] In step 320 , a reduction ratio is determined based on the first size of the envelope graphic and the second size of the navigation view.

[0163] The first size refers to the size of the envelope graphic, the second size refers to the size of the navigation view, and the reduction ratio refers to the size relationship between the second size and the first size when the envelope graphic is fully displayed in the navigation view.

[0164] There are usually multiple drawing board elements in the online collaborative drawing board, and the window corresponding to the online collaborative drawing board usually only displays part of the drawing board elements. In addition, the navigation view is only located in a corner of the online collaborative drawing board window. Therefore, the first size is usually larger than the second size. In order for the navigation view to fully display the envelope graph, it is necessary to calculate the reduction ratio based on the first size and the second size. Since the first size is usually larger than the second size, the reduction ratio is usually less than 1. Figure 2C and Figure 4A , the second size of the navigation view is much smaller than the first size of the envelope image.

[0165] It should be noted that if the online collaborative drawing board includes only a small number of drawing board elements, for example, when performing initial drawing on the online collaborative drawing board, the second size of the navigation view may be larger than the first size, and the reduction ratio may be greater than 1.

[0166] In step 330, based on the first position of each artboard element relative to the first origin in the online collaborative artboard and the reduction ratio, the second position of each reduced artboard element relative to the first origin is determined.

[0167] The first origin is the origin in the online collaborative drawing board. In the same online collaborative drawing board, the first origin is always located at the same position. The setting of the first origin facilitates the positioning of each drawing board element in the online collaborative drawing board.

[0168] The first position is the position of each drawing board element in the online collaborative drawing board relative to the first origin. In order to determine the first position, a coordinate system can be established based on the first origin to determine the coordinates of each drawing board element in the coordinate system, and the coordinates are used as the first position of the drawing board element.

[0169] It should be noted that the first position of the artboard element can be reflected as multiple coordinate points of the artboard element, and the specific positions of the coordinate points are determined based on the shape of the artboard element. Figure 4A If the drawing board element is a hexagon, the first position of the drawing board element can be reflected as the six vertices of the hexagon. If the drawing board element is a five-pointed star, its first position is reflected as the 10 vertices of the five-pointed star.

[0170] In addition, refer to Figure 4A For a teardrop-shaped canvas element, which includes an arc segment, if the first position is represented by multiple coordinate points, the first position of the teardrop-shaped canvas element requires too many coordinate points, so it can be represented by a function expression.

[0171] It should be noted that, in order to reduce data processing, the embodiment of the present disclosure may also determine the rectangular envelope of each artboard element, and use the position of the rectangular envelope to represent the first position of the corresponding artboard element. Figure 4AEach drawing board element in the online collaborative drawing board is provided with a corresponding envelope, and the first position of the drawing board element can be reflected as the position of the corresponding rectangular envelope.

[0172] The reduced artboard element is the artboard element that is reduced by the reduction ratio. Figure 4B , each drawing board element of the online collaborative drawing board is reduced based on the reduction ratio to obtain the reduced drawing board element. For the reduced drawing board element, not only the size of the drawing board element itself needs to be reduced, but also the distance between the drawing board element and the first origin needs to be reduced based on the reduction ratio.

[0173] It should be noted that the reduction of each drawing board element in the online collaboration drawing board can be regarded as the reduction of the online collaboration drawing board.

[0174] The second position is the position of the artboard element relative to the first origin after reduction. If the first position of a point in the artboard element relative to the first origin is (6,8) and the reduction ratio is 0.5, then the second position of the point in the artboard element relative to the first origin after reduction is (3,4).

[0175] In step 340 , based on the positional relationship between the second origin and the first origin in the navigation view, the second position is converted into a third position of each reduced artboard element relative to the second origin.

[0176] The second origin is the origin of the navigation view. The second origin can be set to any position in the second origin as needed. Figure 4C , the second origin is set at the upper left corner of the view navigation, and the position of the second origin is always fixed. Figure 4D The second origin is set at the upper left corner of the envelope graph after reduction, and the second position changes according to the change of the envelope graph.

[0177] The third position is the position of the canvas element relative to the second origin after being reduced. The first position is the position of the canvas element in the coordinate system corresponding to the first origin, and the second position is the position of the canvas element in the coordinate system corresponding to the first origin after being reduced. In the process of converting from the first position to the second position, the coordinate system does not change, but the size of the canvas element after being reduced changes. The third position is the position of the canvas element in the coordinate system corresponding to the second origin after being reduced. In the process of converting from the second position to the third position, the size of the canvas element after being reduced does not change, but the coordinate system changes.

[0178] The conversion from the second position to the third position can be determined based on the positional relationship between the second origin and the first origin. The positional relationship between the second origin and the first origin can be reflected as the distance between the two, or the position of the second origin in the coordinate system corresponding to the first origin, or the position of the first origin in the coordinate system corresponding to the second origin.

[0179] Assume that the first origin is (0,0), and the position of the second origin in the coordinate system corresponding to the first origin is (2,1). If the second position of the canvas element relative to the first origin after reduction is (3,4), then the third position of the canvas element relative to the second origin after reduction is (1,3).

[0180] In step 350 , at the third position, the zoomed-out artboard element is rendered, thereby generating and displaying a rendered navigation view.

[0181] After determining the third position of the reduced artboard element relative to the second origin, the position of the reduced artboard element in the view navigation can be determined based on the third position and the second origin. Therefore, the reduced artboard element can be rendered based on the position, i.e., the third position, so as to generate and display the rendered navigation view. Figure 2C The navigation view in Figure 2A The rendering result of the navigation view corresponding to the online collaboration artboard.

[0182] The embodiments of steps 310 to 350 described above generate an envelope graphic that surrounds each drawing board element in the online collaborative drawing board, for example, a minimum envelope graphic is generated close to all drawing board elements in the online collaborative drawing board. Based on the first size of the envelope graphic and the second size of the navigation view, the reduction ratio is determined. Based on the first position of each drawing board element relative to the first origin in the online collaborative drawing board and the reduction ratio, the second position of each reduced drawing board element relative to the first origin is determined. However, the second position is only a relative position relative to the first origin in the online collaborative drawing board, and must be converted into a relative position relative to the second origin of the navigation view before the screen element can be rendered in the navigation view according to the relative position. Therefore, based on the positional relationship between the second origin and the first origin in the navigation view, the second position is converted into a third position of each reduced drawing board element relative to the second origin. Then, at the third position, the reduced drawing board element is rendered, thereby generating and displaying the rendered navigation view. Since there is a large blank space in the online collaborative drawing board, and there are no drawing board elements in the blank space, generating a navigation view based on the area of ​​the entire online collaborative drawing board often results in the reduced drawing board elements in the navigation view being too small and difficult to operate. By generating an envelope graphic surrounding each drawing board element in the online collaborative drawing board and removing the surrounding blank areas, the reduction ratio is determined, so that the generated navigation view does not contain many blank areas, thereby improving the convenience of operation of the navigation view. Since the above method determines the reduction ratio, and based on the first position and reduction ratio of each drawing board element relative to the first origin, the second position of the reduced drawing board element relative to the first origin is quickly obtained, and the positional relationship between the second origin in the navigation view and the first origin in the online collaborative drawing board is used to quickly convert the second position into a third position relative to the second origin, and rendering is performed based on the third position, a navigation view including each reduced drawing board element is quickly obtained, so that the user can operate the drawing board elements outside the current display screen according to the navigation view, thereby improving the efficiency of generating the navigation view of the online collaborative drawing board.

[0183] The above is a general description of step 310 to step 350. Since step 350 has been described in detail above, only the specific implementation process of step 310 to step 340 will be described in detail below.

[0184] Detailed description of step 310

[0185] In step 310 , an envelope graphic surrounding each drawing board element in the online collaborative drawing board is generated.

[0186] In one embodiment, referring to Figure 5 , step 310 includes:

[0187] Step 510: obtaining the maximum first coordinate and the minimum first coordinate of each drawing board element along the first axis, and the maximum second coordinate and the minimum second coordinate along the second axis, wherein the first axis is perpendicular to the second axis;

[0188] Step 520, generating a first line passing through the maximum first coordinate and perpendicular to the first axis, a second line passing through the minimum first coordinate and perpendicular to the first axis, a third line passing through the maximum second coordinate and perpendicular to the second axis, and a fourth line passing through the minimum second coordinate and perpendicular to the second axis;

[0189] Step 530: determine a figure enclosed by the first line, the second line, the third line, and the fourth line as an envelope figure.

[0190] Steps 510 to 530 are described in detail below.

[0191] In step 510, the maximum first coordinate and the minimum first coordinate of each drawing board element in the online collaborative drawing board along the first axis, and the maximum second coordinate and the minimum second coordinate along the second axis are obtained, wherein the first axis is perpendicular to the second axis.

[0192] The first axis and the second axis are two coordinate axes in a coordinate system established based on the first origin.

[0193] The specific directions of the first axis and the second axis can be set as needed, as long as the first axis and the second axis are perpendicular. For example, in an online collaborative drawing board, if most of the drawing board elements are concentrated in a certain direction of the origin, for the convenience of calculation, the first axis and the second axis can be set so that most of the drawing board elements are located in the first quadrant of the coordinate system corresponding to the first origin. In addition, in order to facilitate the conversion between the second position and the third position of the drawing board elements after reduction, the directions of the coordinate axes corresponding to the first axis, the second axis and the second origin are kept consistent.

[0194] The maximum first coordinate is the maximum coordinate of each artboard element along the first axis, and the minimum first coordinate is the minimum coordinate of each artboard element along the first axis. Figure 6 , the maximum first coordinate is the maximum coordinate of the text box of the artboard element along the first axis, and the minimum first coordinate is the minimum coordinate of the hexagonal artboard element along the first axis.

[0195] The maximum second coordinate is the maximum coordinate of each artboard element along the second axis, and the minimum second coordinate is the minimum coordinate of each artboard element along the second axis. Figure 6 , the maximum second coordinate is the maximum coordinate of the V-shaped artboard element along the second axis, and the minimum second coordinate is the minimum coordinate of the teardrop-shaped artboard element along the second axis.

[0196] In step 520 , a first line passing through the maximum first coordinate and perpendicular to the first axis, a second line passing through the minimum first coordinate and perpendicular to the first axis, a third line passing through the maximum second coordinate and perpendicular to the second axis, and a fourth line passing through the minimum second coordinate and perpendicular to the second axis are generated.

[0197] The first line is a straight line passing through the maximum first coordinate and perpendicular to the first axis. Assuming that the first axis is the x-axis and the maximum first coordinate is 10, the first line can be expressed as x=10.

[0198] The second line is a straight line passing through the minimum first coordinate and perpendicular to the first axis, and the first line and the second line are parallel to each other. Assuming that the first axis is the x-axis and the minimum first coordinate is 3, the second line can be expressed as x=3.

[0199] The third line is a straight line passing through the maximum second coordinate and perpendicular to the second axis. Assuming that the second axis is the y axis and the maximum second coordinate is 12, the third line can be expressed as y=12.

[0200] The fourth line is a straight line passing through the minimum second coordinate and perpendicular to the second axis. Assuming that the second axis is the y axis and the minimum second coordinate is 4, the fourth line can be expressed as y=4.

[0201] In step 530, a figure enclosed by the first line, the second line, the third line, and the fourth line is determined as an envelope figure.

[0202] The envelope figure is a closed figure formed by the first line, the second line, the third line, and the fourth line. If the first line is x=10, the second line is x=3, the third line is y=12, and the fourth line is y=4, then the envelope figure is a closed figure formed by x=10, x=3, y=12, and y=4, and the figure is a rectangle.

[0203] Reference Figure 6 , the disclosed embodiment determines the first line based on the maximum first coordinate of each artboard element along the first axis, and determines the second line based on the minimum first coordinate of each artboard element along the first axis. Based on the maximum second coordinate of each artboard element along the second axis, a third line passing through the maximum second coordinate and perpendicular to the second axis is generated. Afterwards, based on the minimum second coordinate of each artboard element along the second axis, a fourth line passing through the minimum second coordinate and perpendicular to the second axis is generated. The closed figure surrounded by the first line, the second line, the third line, and the fourth line is the envelope figure.

[0204] The embodiments of the above steps 510 to 530 determine the envelope graphic based on the maximum first coordinate and the minimum first coordinate of each canvas element in the online collaborative canvas along the first axis, and the maximum second coordinate and the minimum second coordinate along the second axis. The obtained envelope graphic is the minimum rectangle that surrounds each canvas element in the online collaborative canvas, which can reduce the blank area as much as possible, thereby increasing the size of each canvas element in the navigation view, making the operation of the navigation view simpler and more convenient.

[0205] In another embodiment, referring to Figure 7 , step 310 includes:

[0206] Step 710: determining a first viewing number of each drawing board element in the online collaborative drawing board by a target object;

[0207] Step 720: Determine a second number of times each drawing board element in the online collaborative drawing board is viewed by each platform object other than the target object;

[0208] Step 730: Determine a first target artboard element from each artboard element based on the first viewing number and the second viewing number;

[0209] Step 740: Generate an envelope graphic that surrounds each first target drawing board element in the online collaborative drawing board.

[0210] Steps 710 to 740 are described in detail below.

[0211] In step 710 , a first viewing number of each artboard element in the online collaborative artboard by a target object is determined.

[0212] The online collaborative drawing board refers to a drawing board that can provide online collaborative functions for multiple objects, and the target object is one of the multiple objects and is the user object of the platform terminal to which the navigation view generation method of the online collaborative drawing board is applied. Figure 8 The multiple collaborative objects of the online collaborative drawing board include object A, object B and object C, wherein object A is the user object of the terminal, and the terminal is the terminal to which the navigation view generation method of the online collaborative drawing board is applied, therefore, object A is the target object.

[0213] The first viewing number is the number of times the target object views each artboard element. The first viewing number corresponds to the artboard element, and different artboard elements have different first viewing numbers by the target object.

[0214] In step 720 , a second number of times each artboard element in the online collaborative artboard is viewed by each platform object other than the target object is determined.

[0215] The platform object is the object used by the platform terminal of the online collaborative drawing board navigation view generation method application, refer to Figure 8 , the platform objects of the online collaborative drawing board include object A, object B and object C.

[0216] The second viewing count is the number of times each platform object other than the target object views each artboard element. The second viewing count corresponds to the platform object and the artboard element. For example, refer to Figure 8 ,For each artboard element, the second viewing times of object B and object C are different.

[0217] In step 730 , a first target artboard element is determined among the artboard elements based on the first viewing number and the second viewing number.

[0218] The first target artboard element is determined based on the first view count and the second view count.

[0219] It should be noted that the second viewing times of each platform object for each canvas element in the online collaborative canvas are different. Therefore, it is necessary to preferentially calculate the average of the second viewing times of each canvas element and update the second viewing times by the average. For example, for canvas element A, the second viewing times of object B is 12, and the second viewing times of object C is 24, then the second viewing times of canvas element A is finally 18.

[0220] After determining the average of the second viewing count, the total viewing count of each artboard element may be determined based on the first viewing count and the second viewing count. The total viewing count may be the average of the first viewing count and the second viewing count, or may be the weighted sum of the first viewing count and the second viewing count. Thereafter, the first target artboard element is determined from each artboard element according to the total viewing count.

[0221] It should be noted that after determining the total number of views, the multiple artboard elements are sorted in descending order according to the total number of views, and the first preset number of artboard elements are used as the first artboard element. In addition, a preset threshold can also be set to use the artboard element with a total number of views greater than the preset threshold as the first artboard element.

[0222] In step 740 , an envelope graphic is generated to surround each first target artboard element in the online collaborative artboard.

[0223] After the first artboard element is determined, an envelope graphic is generated so that the envelope graphic surrounds each first target artboard element in the online collaborative artboard.

[0224] Reference Figure 8The platform objects of the online collaborative drawing board include object A, object B, and object C. The first viewing times of each drawing board element by the target object, i.e., object A, are obtained, and the second viewing times of each drawing board element by the platform objects other than the target object, i.e., object B and object C, are obtained. A first drawing board element is determined in the drawing board elements based on the first viewing times and the second viewing times, so as to generate an envelope graphic surrounding each first target drawing board element in the online collaborative drawing board.

[0225] The envelope graphic in the embodiment of the above steps 710 to 740 is a graphic that surrounds each first target canvas element in the online collaborative canvas, and the first canvas element is determined based on the first view count and the second view count, and the first view count corresponds to the target object, and the second view count corresponds to the platform object other than the target object. Then, the first canvas element in the finally determined envelope graphic is more in line with the needs of the target object, and the number of canvas elements that need to be processed during the navigation view generation process is reduced, thereby improving the generation efficiency of the navigation view.

[0226] In another embodiment, referring to Fig. 9 , step 310 includes:

[0227] Step 910: Determine, among the various drawing board elements in the online collaborative drawing board, a second target drawing board element generated by the target object;

[0228] Step 920: Generate an envelope graphic that surrounds each second target drawing board element in the online collaborative drawing board.

[0229] Step 910 and step 920 are described in detail below.

[0230] In step 910, a second target artboard element generated by a target object is determined among various artboard elements in the online collaborative artboard.

[0231] The second target artboard element is an artboard element drawn by the target object in the online collaborative artboard.

[0232] The online collaborative drawing board can provide online collaborative functions for multiple objects, so during the use of the online collaborative drawing board, multiple objects can draw drawing board elements as needed. The second target drawing board element is the user object of the platform terminal to which the navigation view generation method of the online collaborative drawing board is applied.

[0233] In step 920 , an envelope graphic is generated to surround each second target artboard element in the online collaborative artboard.

[0234] After the second artboard elements are determined, an envelope graphic is generated so that the envelope graphic surrounds each second target artboard element in the online collaborative artboard.

[0235] exist Figure 2A In the online collaborative drawing board shown in FIG. 1 , if the diamond, V-shape and five-pointed star are generated by the target object, and other drawing board elements are generated by other platform objects other than the target object, then the final generated envelope graph is as follows: Fig.10 As shown, the envelope pattern only includes a diamond, a V-shape and a five-pointed star.

[0236] The envelope graphics generated by the embodiments of the above steps 910 and 920 are graphics that surround each second target canvas element generated by the target object in the online collaborative canvas. This method is suitable for the target object to only focus on the canvas elements generated by itself, and can improve the generation efficiency of the navigation view while meeting the needs of the target object.

[0237] In one embodiment, the disclosed embodiment is provided with a control in the view navigation interface of the online collaborative drawing board, and the control can switch the envelope graphics displayed in the navigation view, that is, switch between the envelope graphics surrounding each target drawing board element in the online collaborative drawing board, the envelope graphics surrounding each first target drawing board element in the online collaborative drawing board, and the envelope graphics surrounding each second target drawing board element in the online collaborative drawing board, thereby improving the flexibility of the navigation view display.

[0238] Detailed description of step 320

[0239] In step 320 , a reduction ratio is determined based on the first size of the envelope graphic and the second size of the navigation view.

[0240] In one embodiment, the first size includes a first width and a first height, and the second size includes a second width and a second height. Fig.11 , step 320 includes:

[0241] Step 1110: obtaining the maximum first coordinate and the minimum first coordinate of each drawing board element along the first axis, and the maximum second coordinate and the minimum second coordinate along the second axis, wherein the first axis is perpendicular to the second axis;

[0242] Step 1120: determine a first width based on the maximum first coordinate and the minimum first coordinate, and determine a first height based on the maximum second coordinate and the minimum second coordinate;

[0243] Step 1130: Obtain the maximum third coordinate and the minimum third coordinate of the boundary of the navigation view along the first axis, and the maximum fourth coordinate and the minimum fourth coordinate along the second axis;

[0244] Step 1140: determine the second width based on the maximum third coordinate and the minimum third coordinate, and determine the second height based on the maximum fourth coordinate and the minimum fourth coordinate;

[0245] Step 1150: Determine a reduction ratio based on the first width, the first height, the second width, and the second height.

[0246] Steps 1110 to 1150 are described in detail below.

[0247] In step 1110, the maximum first coordinate and the minimum first coordinate of each drawing board element in the online collaborative drawing board along the first axis, and the maximum second coordinate and the minimum second coordinate along the second axis are obtained, wherein the first axis is perpendicular to the second axis.

[0248] The first axis and the second axis are two coordinate axes in a coordinate system established based on the first origin.

[0249] The specific directions of the first axis and the second axis can be set as needed, as long as the first axis and the second axis are perpendicular. For example, in an online collaborative drawing board, if most of the drawing board elements are concentrated in a certain direction of the origin, for the convenience of calculation, the first axis and the second axis can be set so that most of the drawing board elements are located in the first quadrant of the coordinate system corresponding to the first origin. In addition, in order to facilitate the conversion between the second position and the third position of the drawing board elements after reduction, the directions of the coordinate axes corresponding to the first axis, the second axis and the second origin remain consistent, and the first axis is parallel to two sides of the navigation view, and the second axis is perpendicular to the other two sides of the navigation view.

[0250] The maximum first coordinate is the maximum coordinate of each artboard element along the first axis, and the minimum first coordinate is the minimum coordinate of each artboard element along the first axis. Figure 6 , the maximum first coordinate is the maximum coordinate of the text box of the artboard element along the first axis, and the minimum first coordinate is the minimum coordinate of the hexagonal artboard element along the first axis.

[0251] The maximum second coordinate is the maximum coordinate of each artboard element along the second axis, and the minimum second coordinate is the minimum coordinate of each artboard element along the second axis. Figure 6 , the maximum second coordinate is the maximum coordinate of the V-shaped artboard element along the second axis, and the minimum second coordinate is the minimum coordinate of the teardrop-shaped artboard element along the second axis.

[0252] In step 1120 , a first width is determined based on the maximum first coordinate and the minimum first coordinate, and a first height is determined based on the maximum second coordinate and the minimum second coordinate.

[0253] The first width is the length of the envelope graph in the first axis direction. The first width is specifically the difference between the maximum first coordinate and the minimum first coordinate. Assuming that the maximum first coordinate is 36 and the minimum first coordinate is 12, the first width of the envelope graph is 24.

[0254] The first height is the length of the envelope graph in the second axis direction. The first height is specifically the difference between the maximum second coordinate and the minimum second coordinate. Assuming that the maximum second coordinate is 25 and the minimum second coordinate is 7, the first draft including the graph is 18.

[0255] In step 1130 , the maximum third coordinate and the minimum third coordinate of the boundary of the navigation view along the first axis, and the maximum fourth coordinate and the minimum fourth coordinate along the second axis are obtained.

[0256] The maximum third coordinate is the maximum coordinate of the boundary of the navigation view along the first axis, and the minimum third coordinate is the minimum coordinate of the boundary of the navigation view along the first axis. The maximum fourth coordinate is the maximum coordinate of the boundary of the navigation view along the second axis, and the minimum fourth coordinate is the minimum coordinate of the boundary of the navigation view along the second axis.

[0257] In step 1140 , a second width is determined based on the maximum third coordinate and the minimum third coordinate, and a second height is determined based on the maximum fourth coordinate and the minimum fourth coordinate.

[0258] The second width is the length of the border of the navigation view in the first axis direction. The second height is the length of the border of the navigation view in the second axis direction.

[0259] It should be noted that the maximum third coordinate, the minimum third coordinate, the maximum fourth coordinate and the minimum fourth coordinate are determined based on the coordinate system corresponding to the first origin. The maximum third coordinate, the minimum third coordinate, the maximum fourth coordinate and the minimum fourth coordinate are determined in order to obtain the second width and the second height, so these coordinates can also be determined in other ways.

[0260] In step 1150 , a reduction ratio is determined based on the first width, the first height, the second width, and the second height.

[0261] The reduction ratio is determined based on the first width, the first height, the second width, and the second height, so that the resulting envelope graphic can be fully displayed in the navigation view. FIG. 12A to FIG. 12C The second width and the second height of the view navigation are usually fixed, while the first width and the first height will change with the number and position of the artboard elements. Therefore, in order to enlarge the image of the reduced artboard elements in the navigation view as much as possible, it is necessary to determine the reduction rate based on the first width, the first height, the second width and the second height.

[0262] The embodiment of the above-mentioned steps 1110 to 1150 first determines the first width and the first height of the envelope graphic, and determines the second width and the second width of the boundary of the navigation view, so as to determine the reduction ratio based on the first width, the second height, the second width, and the second height. Then, the reduction ratio finally determined can accurately match the envelope graphic and the navigation view, thereby improving the operability of the navigation view.

[0263] The above is a general description of step 1110 to step 1150. Since step 1110 to step 1140 have been described in detail above, only the specific implementation process of step 1050 will be described in detail below.

[0264] In step 1150 , a reduction ratio is determined based on the first width, the first height, the second width, and the second height.

[0265] In one embodiment, referring to Fig.13 , step 1150 includes:

[0266] Step 1310: determining a first sub-reduction ratio based on the second width and the first width;

[0267] Step 1320: Determine a second sub-reduction ratio based on the second height and the first height;

[0268] Step 1330: Determine the minimum value of the first sub-reduction ratio and the second sub-reduction ratio as the reduction ratio.

[0269] Steps 1310 to 1330 are described in detail below.

[0270] In step 1310 , a first sub-reduction ratio is determined based on the second width and the first width.

[0271] The first sub-reduction ratio is determined based on the second width and the first width, and is specifically a ratio of the second width to the first width. If the first width is w and the first width is W, then the first sub-reduction ratio is w / W.

[0272] In step 1320 , a second sub-reduction ratio is determined based on the second height and the first height.

[0273] The second sub-reduction ratio is determined based on the second height and the first height, and is specifically the ratio of the second height to the first height. If the first height is h and the first height is H, then the second sub-reduction ratio is h / H.

[0274] In step 1230, the minimum value of the first sub-reduction ratio and the second sub-reduction ratio is determined as the reduction ratio.

[0275] The reduction ratio is the minimum value of the first sub-reduction ratio and the second sub-reduction ratio. Assuming that the first sub-reduction ratio is w / W and the second sub-reduction ratio is h / H, when the first sub-reduction ratio is greater than the second sub-reduction ratio, the reduction ratio is h / H, when the first sub-reduction ratio is less than the second sub-reduction ratio, the reduction ratio is w / W, and when the first sub-reduction ratio is equal to the second sub-reduction ratio, the reduction ratio is h / H, and h / H is equal to w / W.

[0276] Reference Fig. 12A , the first height of the envelope figure is much larger than the first width, and the second sub-reduction rate is obviously smaller than the first sub-reduction rate, then the final determined reduction rate is the second sub-reduction rate.

[0277] Reference Fig. 12B , the first width of the envelope figure is much larger than the first height, and the first sub-reduction ratio is obviously smaller than the second sub-reduction ratio, then the final determined reduction ratio is the first sub-reduction ratio.

[0278] Reference FIG. 12A to FIG. 12B The first width and the first height of the envelope graphic will change according to the number and position of the artboard elements. In order to ensure that the envelope graphic can be fully displayed in the navigation view, the minimum value of the first sub-reduction ratio and the second sub-reduction ratio needs to be determined as the reduction ratio.

[0279] The embodiments of the above steps 1310 to 1330 determine the first sub-reduction ratio based on the second width and the first width, determine the second sub-reduction ratio based on the second height and the first height, and use the minimum value of the first sub-reduction ratio and the second sub-reduction ratio as the reduction ratio, thereby ensuring that the envelope graphic can be fully displayed in the navigation view, and on the basis of the full display, the envelope graphic can be displayed in the navigation view at the maximum size, so that the user can operate the drawing board elements outside the current display screen according to the navigation view, thereby improving the navigation view generation efficiency of the online collaborative drawing board.

[0280] Detailed description of step 330

[0281] In step 330, based on the first position of each artboard element relative to the first origin in the online collaborative artboard and the reduction ratio, the second position of each reduced artboard element relative to the first origin is determined.

[0282] In one embodiment, the first position is embodied as the first reference point coordinates of the first reference point of the first rectangular envelope surrounding the artboard element relative to the first origin, the third width and the third height of the first rectangular envelope. The second position is embodied as the second reference point coordinates of the second reference point of the second rectangular envelope surrounding the reduced artboard element relative to the first origin, the fourth width and the fourth height of the second rectangular envelope.

[0283] Reference Fig.14, step 330 includes:

[0284] Step 1410: Determine the coordinates of the second reference point based on the coordinates of the first reference point and the reduction ratio;

[0285] Step 1420: determining a fourth width based on the third width and the reduction ratio;

[0286] Step 1430: Determine a fourth height based on the third height and the reduction ratio.

[0287] It should be noted that the embodiment of the present disclosure represents the canvas element in the form of a first rectangular envelope. Correspondingly, the first position of the canvas element is reflected as the first reference point coordinates of the first rectangular envelope relative to the first origin, the third width and the third height of the first rectangular envelope.

[0288] The first reference point is any point in the first rectangular envelope. In order to facilitate the first position, the embodiment of the present disclosure uses the upper left corner vertex of the first rectangular envelope as the first reference point. The third width is the length of the first rectangular envelope in the first axis direction. The third height is the length of the first rectangular envelope in the second axis direction. Fig.15A For the V-shaped canvas element, the embodiment of the disclosure uses the upper left corner vertex (x_1, y_1) of the corresponding first rectangular envelope as the first reference point, the third width is w, and the third height is h, then the first position can be expressed as (x_1, y_1, w, h). Based on the first reference point, the third width, and the third height, the four vertices of the first rectangular envelope can be determined, and then the first position can be determined.

[0289] It should be noted that the artboard element is represented by the first rectangular envelope, and the artboard element after reduction is also represented by the rectangular envelope, which is the second rectangular envelope, and the second rectangular envelope is the reduced first rectangular envelope. Correspondingly, the second position of the artboard element after reduction is reflected by the second reference point coordinates of the third reference point of the second rectangular envelope relative to the first origin, the fourth width and the fourth height of the second rectangular envelope.

[0290] The second reference point corresponds to the first reference point, and is any point in the second rectangular envelope. If the first reference point is the upper left corner vertex of the first rectangular envelope, then the second reference point is the upper left corner vertex of the second rectangular envelope. The fourth width is the length of the second rectangular envelope in the first axis direction. The fourth height is the length of the second rectangular envelope in the second axis direction. Based on the second reference point, the fourth width and the fourth height, the four vertices of the second rectangular envelope can be determined, and then the second position can be represented.

[0291] Steps 1410 to 1430 are described in detail below.

[0292] In step 1410, based on the first reference point coordinates and the reduction ratio, the second reference point coordinates are determined.

[0293] The second reference point coordinates are determined based on the first reference point coordinates and the reduction ratio. Fig.15A , if the coordinates of the first reference point are (x_1, y_11) and the reduction rate is s_min, then Fig. 15B The coordinates of the second reference point of the second rectangular envelope can be expressed as (s_min*x_1, s_min*y_1).

[0294] In step 1420 , a fourth width is determined based on the third width and the reduction ratio.

[0295] The fourth width is determined based on the third width of the first rectangular envelope and the reduction ratio. Fig.15A , if the third width of the first rectangular envelope is w and the reduction rate is s_min, then Fig. 15B The fourth width of the second rectangular envelope is s_min*w.

[0296] In step 1430 , a fourth height is determined based on the third height and the reduction ratio.

[0297] The fourth height is determined based on the third height of the first rectangular envelope and the reduction ratio. Fig.15A , if the third height of the first rectangular envelope is h and the reduction rate is s_min, then Fig. 15B The fourth height of the second rectangular envelope is s_min*h.

[0298] The second position of the canvas element after reduction is reflected by the second reference point coordinates of the second rectangular envelope relative to the first origin, the fourth width and the fourth height of the second rectangular envelope, so the second position can be expressed as (s_min*x_1, s_min*y_1, s_min*w, s_min*h).

[0299] The embodiments of steps 1410 to 1430 described above represent the canvas elements and the reduced canvas elements in the form of rectangular envelopes, which can reduce the processing data in the process of generating the navigation view, and the method can quickly determine the second reference point coordinates, the fourth width and the fourth height of the second rectangular envelope corresponding to the reduced canvas elements, thereby improving the generation efficiency of the navigation view.

[0300] Detailed description of step 340

[0301] In step 340 , based on the positional relationship between the second origin and the first origin in the navigation view, the second position is converted into a third position of each reduced artboard element relative to the second origin.

[0302] In one embodiment, the positional relationship includes a first position offset of the second origin relative to the first origin on the first axis, and a second position offset of the second origin relative to the first origin on the second axis; the second position is reflected as the second reference point coordinates of the second reference point of the second rectangular envelope surrounding the reduced artboard element relative to the first origin, the fourth width and the fourth height of the second rectangular envelope. The third position is reflected as the third reference point coordinates of the second reference point of the second rectangular envelope surrounding the reduced artboard element relative to the second origin, the fifth width and the fifth height of the second rectangular envelope.

[0303] Reference Fig.16 , step 340 includes:

[0304] Step 1610: Determine the coordinates of the third reference point based on the coordinates of the second reference point, the first position offset, the second position offset, and the reduction ratio;

[0305] Step 1620: Determine the fifth width to be equal to the fourth width, and determine the fifth height to be equal to the fourth height.

[0306] It should be noted that the positional relationship between the second origin and the first origin is represented by a first position offset and a second position offset, wherein the first position offset is an offset of the second origin relative to the first origin on the first axis, and the second position offset is an offset of the second origin relative to the first origin on the second axis. Fig. 15B , the second origin is located in the first quadrant of the coordinate system corresponding to the first origin, then the first position offset can be considered as the distance between the second origin and the first origin on the first axis, and the second position offset can be considered as the distance between the second origin and the first origin on the second axis. If the coordinates of the second origin in the coordinate system corresponding to the first origin are (delta_x, delta_y), then the first position offset is delta_x, and the second position offset is delta_y.

[0307] It should be noted that after the reduction, the drawing board element is represented by the second rectangular envelope, and the second position is reflected by the second reference point coordinates of the second rectangular envelope relative to the first origin, the fourth width and the fourth height of the second rectangular envelope. Correspondingly, the third position is reflected by the third reference coordinates of the second reference point of the second rectangular envelope relative to the second origin, the fifth width and the fifth height of the second rectangular envelope. Since the second position and the third position are both reflected by the position of the second rectangular envelope, the fifth width is equal to the fourth width, and the fifth height is equal to the fourth height.

[0308] Step 1610 and step 1620 are described in detail below.

[0309] In step 1610, the third reference point coordinates are determined based on the second reference point coordinates, the first position offset, the second position offset, and the reduction ratio.

[0310] The third reference point is determined based on the coordinates of the second reference point, the first position offset, the second position offset, and the reduction ratio. Specifically, the first position offset and the second position offset can represent the coordinates of the second origin in the coordinate system corresponding to the first origin. In order to facilitate calculation, the embodiment of the present disclosure sets the second origin based on the envelope graphic surrounding each drawing board element, and then the coordinates of the reduced second origin in the coordinate system corresponding to the first origin can be determined according to the reduction ratio, the first position offset, and the second position offset. According to the coordinates of the reduced second origin in the coordinate system corresponding to the first origin, the coordinates of the first origin in the coordinate system corresponding to the second origin after reduction can be determined, and then the second reference point coordinates of the second reference point relative to the first origin can be converted into the third reference point coordinates of the first reference point relative to the second origin.

[0311] Assuming the first position offset is 4 and the second position offset is 6, the coordinates of the second origin in the coordinate system corresponding to the first origin are (4,6). If the reduction ratio is 0.5, the coordinates of the second origin in the coordinate system corresponding to the first origin after reduction are (2,3), and the coordinates of the first origin in the coordinate system corresponding to the second origin after reduction are determined to be (-2,-3). If the coordinates of the second reference point are (0,7), they can be converted to the coordinates of the third reference point (-2,4).

[0312] In step 1620 , the fifth width is determined to be equal to the fourth width, and the fifth height is determined to be equal to the fourth height.

[0313] Since the second position and the third position are both represented by the position of the second rectangular envelope, the fifth width is equal to the fourth width, and the fifth height is equal to the fourth height.

[0314] Assuming that the second position is (0,7,2,2), it can be determined that the second reference point coordinates are (0,7), the fourth width is 2, the fourth height is 2, and the third reference point coordinates are (-2,4), then the third position can be expressed as (-2,4, 2,2).

[0315] In the embodiments of the above steps 1610 and 1620, the positional relationship between the second origin and the first origin is represented by the first position offset and the second position offset, and then the second rectangle including the third reference point coordinates relative to the second origin is determined by the first position offset, the second position offset, the reduction ratio, and the second reference point coordinates of the second rectangular envelope surrounding the reduced artboard element relative to the first origin. Afterwards, the fifth width is determined to be equal to the fourth width, and the fifth height is determined to be equal to the fourth height, and then the third position of the reduced artboard element relative to the second origin is determined. This method can accurately convert the second position of the reduced artboard element into the third position of the reduced artboard element relative to the second origin, thereby improving the accuracy of view navigation generation.

[0316] The above is a general description of step 1610 and step 1620. Since step 1620 has been described in detail above, only the specific implementation process of step 1610 will be described in detail below.

[0317] In step 1610, the third reference point coordinates are determined based on the second reference point coordinates, the first position offset, the second position offset, and the reduction ratio.

[0318] In one embodiment, the second reference point coordinates include a first sub-coordinate along the first axis and a second sub-coordinate along the second axis. The third reference point coordinates include a third sub-coordinate along the first axis and a fourth sub-coordinate along the second axis.

[0319] Reference Fig.17 , step 1610 includes:

[0320] Step 1710: Generate an affine transformation matrix based on the first position offset, the second position offset, and the reduction ratio;

[0321] Step 1720: Determine the third and fourth partial coordinates based on the first partial coordinates, the second partial coordinates, and the affine transformation matrix.

[0322] It should be noted that the first sub-coordinate is the coordinate of the second reference point coordinate on the first axis, and the second sub-coordinate is the coordinate of the second reference point coordinate on the second axis. Fig. 15B The coordinates of the second reference point in are (s_min*x_1, s_min*y_1), then the first sub-coordinate is s_min*x_1 and the second sub-coordinate is s_min*y_1.

[0323] The third partial coordinate is the coordinate of the third reference point coordinate on the first axis, and the fourth partial coordinate is the coordinate of the third reference point coordinate on the second axis.

[0324] Step 1710 and step 1720 are described in detail below.

[0325] In step 1710, an affine transformation matrix is ​​generated based on the first position offset, the second position offset, and the reduction ratio.

[0326] The affine transformation matrix is ​​a conversion matrix between the second reference point coordinates and the third reference point coordinates, which is determined based on the first position offset, the second position offset, and the reduction ratio. The affine transformation matrix can be expressed as:

[0327]

[0328] Among them, delta_x is the first position offset, delta_y is the second position offset, and s_min is the reduction rate.

[0329] In step 1720 , third and fourth partial coordinates are determined based on the first partial coordinates, the second partial coordinates, and the affine transformation matrix.

[0330] The third reference point coordinates, ie, the third sub-coordinates and the fourth sub-coordinates may be determined based on the second reference point coordinates and the affine transformation matrix.

[0331] Assuming the coordinates of the second reference point are (x_2, y_2), then the first sub-coordinate is x_2, the second sub-coordinate is y_2, then the coordinates of the third reference point can be expressed as:

[0332]

[0333] Among them, M is the affine transformation matrix, the coordinates of the third reference point are (x_3, y_3), the third sub-coordinate is x_3, and the fourth sub-coordinate is y_3.

[0334] The embodiments of step 1710 and step 1720 above construct an affine transformation matrix based on the first position offset, the second position offset, and the reduction rate to convert the second reference point coordinates into the third reference point coordinates based on the affine transformation matrix. This method can achieve precise conversion, and the second position of each reduced canvas element can be converted into the third position only through the affine transformation matrix, thereby improving the generation efficiency of the navigation view.

[0335] How to determine the first position

[0336] In the embodiment of the above steps 1310 to 1330, the first position is embodied as the first reference point coordinates of the first rectangular envelope surrounding the artboard element relative to the first origin, the third width and the third height of the first rectangular envelope. In this case, refer to Fig.18 , the first position is determined by:

[0337] Step 1810, generating a first rectangular envelope surrounding the drawing board element;

[0338] Step 1820, obtaining the first reference point coordinates of the first reference point of the first rectangular envelope relative to the first origin;

[0339] Step 1830, obtaining the maximum fifth coordinate and the minimum fifth coordinate of the first rectangular envelope along the first axis, and the maximum sixth coordinate and the minimum sixth coordinate along the second axis, wherein the first axis is perpendicular to the second axis;

[0340] Step 1840: Determine the third width based on the maximum fifth coordinate and the minimum fifth coordinate;

[0341] Step 1850: Determine a third height based on the maximum sixth coordinate and the minimum sixth coordinate;

[0342] Step 1860: Integrate the first reference point coordinates, the third width, and the third height into a first position.

[0343] Steps 1810 to 1860 are described in detail below.

[0344] In step 1810, a first rectangular envelope surrounding the artboard element is generated.

[0345] The first rectangular envelope is the smallest rectangle that encloses the artboard element. Figure 4A and Fig.15A For a V-shaped artboard element, the first rectangular envelope can completely surround the V-shaped artboard element, and it is the smallest rectangle that can surround the artboard element.

[0346] In step 1820, the first reference point coordinates of the first reference point of the first rectangular envelope relative to the first origin are obtained.

[0347] Based on the first rectangular envelope and the position of the first reference point in the first rectangular envelope, first reference point coordinates of the first reference point relative to the first origin can be determined.

[0348] Reference Fig.15A If the first reference point is located at the vertex of the upper left corner of the first rectangular envelope, the coordinates of the first reference point are (x_1, y_1). If the first reference point is located at the vertex of the lower left corner of the first rectangular envelope, the coordinates of the first reference point relative to the first origin are (x_1, y_1+h).

[0349] In step 1830 , the maximum fifth coordinate and the minimum fifth coordinate of the first rectangular envelope along the first axis, and the maximum sixth coordinate and the minimum sixth coordinate along the second axis are obtained, wherein the first axis is perpendicular to the second axis.

[0350] The maximum fifth coordinate is the maximum coordinate of the first rectangular envelope along the first axis, and the minimum fifth coordinate is the minimum coordinate of the first rectangular envelope along the first axis. Fig.15A, the maximum fifth coordinate of the first rectangular envelope is x_1+w, and the minimum fifth coordinate is x_1.

[0351] The maximum sixth coordinate is the maximum coordinate of the first rectangular envelope along the second axis, and the minimum sixth coordinate is the minimum coordinate of the first rectangular envelope along the second axis. Fig.15A , the maximum sixth coordinate of the first rectangular envelope is y_1+h, and the minimum sixth coordinate is y_1.

[0352] In step 1840 , a third width is determined based on the maximum fifth coordinate and the minimum fifth coordinate.

[0353] The third width is the length of the first rectangular envelope in the first axis direction. The third width is specifically the difference between the maximum fifth coordinate and the minimum fifth coordinate. If the maximum fifth coordinate of the first rectangular envelope is x_1+w and the minimum fifth coordinate is x_1, then the third width is w.

[0354] In step 1850 , a third height is determined based on the maximum sixth coordinate and the minimum sixth coordinate.

[0355] The third height is the length of the first rectangular envelope in the second axis direction. The third height is specifically the difference between the maximum sixth coordinate and the minimum sixth coordinate. Assuming that the maximum sixth coordinate of the first rectangular envelope is y1+h and the minimum sixth coordinate is y1, then the third height is h.

[0356] In step 1860 , the first reference point coordinates, the third width, and the third height are integrated into a first position.

[0357] The first position is reflected as the first reference point coordinates of the first rectangular envelope surrounding the canvas element relative to the first origin, the third width and the third height of the first rectangular envelope. If the first reference point coordinates are (x_1, y_1+h), the third width is w, and the third height is h, then the first reference point coordinates are (x_1, y_1, w, h).

[0358] The embodiment of steps 1810 to 1860 above generates a first rectangular envelope surrounding the canvas element, and determines the first reference point coordinates of the first reference point relative to the first origin, the third width and the third height of the first rectangular envelope based on the coordinates of each vertex of the first rectangular envelope relative to the first origin, and then obtains the first position of the canvas element. This method can accurately determine the first position of the canvas element, thereby improving the efficiency of generating the navigation view.

[0359] Rendering of the first screen border after zooming out in the navigation view

[0360] The navigation view displays an envelope graphic surrounding each artboard element in the online collaborative artboard. In addition, the navigation view can also display the position of the online collaborative artboard window in the envelope graphic, so that the object can determine the current viewing position, thereby improving the information transmission efficiency of the navigation view.

[0361] In one embodiment, referring to Fig.19 After step 350, the navigation view generation method further includes:

[0362] Step 1910: determining a fifth position of the first screen boundary after reduction relative to the first origin based on the fourth position of the first screen boundary currently displayed in the online collaborative drawing board relative to the first origin and the reduction ratio;

[0363] Step 1920: based on the positional relationship between the second origin and the first origin in the navigation view, convert the fifth position into a sixth position of the first screen boundary after zooming out relative to the second origin;

[0364] Step 1930: At the sixth position, render the first screen boundary after reduction.

[0365] Steps 1910 to 1930 are described in detail below.

[0366] In step 1910, based on the fourth position of the first screen boundary currently displayed in the online collaborative drawing board relative to the first origin and the reduction ratio, the fifth position of the first screen boundary after reduction relative to the first origin is determined.

[0367] The first screen border is the border of the screen displayed in the online collaboration drawing board window. Figure 2A and Figure 2B , Figure 2B The first screen border of the displayed online collaboration drawing board window is Figure 2A A dotted box in an online collaborative artboard.

[0368] The fourth position is the position of the first screen boundary relative to the first origin, and can also be understood as the coordinates of the first screen boundary corresponding to the first origin.

[0369] Since the first screen boundary is a rectangle, the fourth position may be reflected as the positions of four vertices of the first screen boundary, or may be reflected as a function expression of four sides of the first screen boundary.

[0370] The reduced screen boundary is the screen boundary after the first screen boundary is reduced based on the reduction ratio, and is the same as the first screen boundary, and has a rectangular shape. The fifth position refers to the position of the screen boundary after the reduction ratio relative to the first origin.

[0371] After determining the fourth position and the reduction ratio, the fourth position can be converted based on the reduction ratio to obtain the fifth position of the first screen boundary relative to the first origin after reduction. If the fourth position of a vertex of the first screen boundary relative to the first origin is (6,8) and the reduction ratio is 0.5, then the fifth position of the vertex of the first screen boundary relative to the first origin after reduction is (3,4).

[0372] Reference Fig.21 In the embodiment of the present disclosure, the first screen boundary is reduced based on the reduction ratio to obtain the reduced first screen interface, and the reduction ratio of the first screen boundary is the same as that of the envelope graphic to achieve proportional reduction.

[0373] In step 1920 , based on the positional relationship between the second origin and the first origin in the navigation view, the fifth position is converted into a sixth position of the first screen boundary after zooming out relative to the second origin.

[0374] The sixth position is the position of the first screen boundary after reduction relative to the second origin, and may also be understood as the position of the first screen boundary after reduction in the coordinate system corresponding to the second origin.

[0375] In the process of converting the fifth position into the sixth position, the size of the first screen boundary after reduction does not change, but the reference coordinate system of the position changes.

[0376] The conversion from the fifth position to the sixth position is determined based on the positional relationship between the second origin and the first origin. The positional relationship between the second origin and the first origin can be reflected as the distance between the two, or the position of the second origin in the coordinate system corresponding to the first origin, or the position of the first origin in the coordinate system corresponding to the second origin.

[0377] Assume that the first origin is (0,0), and the position of the second origin in the coordinate system corresponding to the first origin is (2,1). If the second position of a vertex on the boundary of the first screen relative to the first origin after reduction is (3,4), then the third position of the fixed point of the artboard element relative to the second origin after reduction is (1,3).

[0378] In step 1930 , at the sixth position, the first screen boundary after reduction is rendered.

[0379] After determining the sixth position of the first screen boundary after reduction relative to the second origin, the position of the first screen boundary after reduction in the view navigation can be determined based on the sixth position and the second origin. Therefore, the first screen boundary can be rendered based on the position, i.e., the sixth position, so as to generate and include the view navigation of the first screen boundary. Fig. 20 The first screen boundary after zooming out in the view navigation is Figure 2A The rendering result of the first screen border in .

[0380] It should be noted that, refer to Fig.21 The window of the online collaborative drawing board may also include blank areas outside the envelope graphic. In this case, in order to minimize the blank areas in the navigation view, only the first drawing board boundary within the graphic is rendered. Then, one of the edges of the rendered first screen boundary coincides with the edge of the envelope graphic.

[0381] The embodiment of the above steps 1910 to 1930 renders the boundary of the first screen currently displayed in the online collaborative drawing board to the navigation view, which facilitates the object to determine the current viewing position and improves the information transmission efficiency of the navigation view.

[0382] The above is a detailed description of step 1910 to step 1930. Since step 1920 and step 1930 have been described in detail above, only the specific implementation process of step 1910 will be described in detail below.

[0383] In step 1910, based on the fourth position of the first screen boundary currently displayed in the online collaborative drawing board relative to the first origin and the reduction ratio, the fifth position of the first screen boundary after reduction relative to the first origin is determined.

[0384] In one embodiment, the fourth position is embodied as the fourth reference point coordinates of the fourth reference point of the first screen boundary relative to the first origin, the sixth width and the sixth height of the first screen boundary. The fifth position is embodied as the fifth reference point coordinates of the fifth reference point of the first screen boundary after reduction relative to the first origin, the seventh width and the seventh height of the first screen boundary after reduction.

[0385] Reference Fig. 22 , step 1910 includes:

[0386] Step 2210: Determine the coordinates of the fifth reference point based on the coordinates of the fourth reference point and the reduction ratio;

[0387] Step 2220: determining a seventh width based on the sixth width and the reduction ratio;

[0388] Step 2230: Determine the seventh height based on the sixth height and the reduction ratio.

[0389] It should be noted that the fourth reference point is any point in the first screen boundary. In order to facilitate the fourth position, the embodiment of the present disclosure uses the upper left corner vertex of the first screen boundary as the fourth reference point. The sixth width is the width of the first screen boundary, which can also be understood as the length of the first screen boundary in the first axis direction. The sixth height is the height of the first screen boundary, which can also be understood as the length of the first screen boundary in the second axis direction.

[0390] The fifth reference point corresponds to the fourth reference point, and is any point on the boundary of the first image after the image is reduced. Fig.21 , if the fourth reference point is the upper left corner vertex of the first screen boundary, then the fifth reference point is the upper left corner vertex of the first screen boundary after reduction. The seventh width is the width of the first screen boundary after reduction, which can also be understood as the length of the first screen boundary in the first axis direction. The seventh height is the height of the first screen boundary after reduction, which can also be understood as the length of the first screen boundary in the second axis direction after reduction.

[0391] Steps 2210 to 2230 are described in detail below.

[0392] In step 2210, based on the fourth reference point coordinates and the reduction ratio, the fifth reference point coordinates are determined.

[0393] The coordinates of the fifth reference point are determined based on the coordinates of the fourth reference point and the reduction ratio. If the coordinates of the fourth reference point are (x_0, y_0) and the reduction ratio is s_min, then the coordinates of the fifth reference point are (s_min*x_0, s_min*y_0).

[0394] In step 2220, a seventh width is determined based on the sixth width and the reduction ratio.

[0395] The seventh width is determined based on the sixth width and the reduction ratio. The seventh width is specifically the product of the sixth width and the reduction ratio. If the sixth width is w_0, then the seventh width is s_min*w_0.

[0396] In step 2230, a seventh height is determined based on the sixth height and the reduction ratio.

[0397] The sixth height is determined based on the sixth height and the reduction ratio. The seventh height is specifically the product of the sixth height and the reduction ratio. If the sixth height is h_0, then the seventh height is s_min*h_0.

[0398] In the above-mentioned embodiment of steps 2210 to 2230, the fourth reference point coordinates of the fourth reference point of the first screen boundary relative to the first origin, the sixth width and the sixth height of the first screen boundary are reflected as the fourth position, and the fifth reference point coordinates of the fifth reference point of the first screen boundary after reduction relative to the first origin, and the seventh width and the seventh height of the first screen boundary after reduction are reflected as the fifth position, and the fourth position is processed based on the reduction rate to obtain the fifth position. This method can quickly determine the fifth position of the first screen boundary after reduction, thereby improving the generation efficiency of the navigation view.

[0399] In one embodiment, referring to Fig.23 , the fourth position is determined by:

[0400] Step 2310: Obtain the coordinates of a fourth reference point of the first picture boundary relative to the first origin;

[0401] Step 2320, obtaining the maximum seventh coordinate and the minimum seventh coordinate of the first picture boundary along the first axis, and the maximum eighth coordinate and the minimum eighth coordinate along the second axis, wherein the first axis is perpendicular to the second axis;

[0402] Step 2330: determine the sixth width based on the maximum seventh coordinate and the minimum seventh coordinate;

[0403] Step 2340: Determine the sixth height based on the maximum eighth coordinate and the minimum eighth coordinate;

[0404] Step 2350: Integrate the fourth reference point coordinates, the sixth width, and the sixth height into a fourth position.

[0405] Steps 2310 to 2350 are described in detail below.

[0406] In step 2310 , the coordinates of a fourth reference point of the first screen boundary relative to the first origin are obtained.

[0407] The fourth reference point is any point in the boundary of the first picture. The coordinates of the fourth reference point are the coordinates of the fourth reference point in the coordinate system corresponding to the first origin.

[0408] Reference Fig.21 In order to conveniently reflect the fourth position, the embodiment of the present disclosure uses the upper left corner vertex of the first screen boundary as the fourth reference point, and the coordinates of the fourth reference point are (x_0, y_0).

[0409] In step 2320 , the maximum seventh coordinate and the minimum seventh coordinate of the first screen boundary along the first axis, and the maximum eighth coordinate and the minimum eighth coordinate along the second axis are obtained, wherein the first axis is perpendicular to the second axis.

[0410] The maximum seventh coordinate is the maximum coordinate of the first screen boundary along the first axis. The minimum seventh coordinate is the minimum coordinate of the first screen boundary along the first axis. Fig.21 , the maximum seventh coordinate is x_0+w_0, and the minimum seventh coordinate is x_0.

[0411] The maximum eighth coordinate is the maximum coordinate of the first screen boundary along the second axis. The minimum eighth coordinate is the minimum coordinate of the first screen boundary along the second axis. Fig.21 , the maximum eighth coordinate is y_0+h_0, and the minimum eighth coordinate is y_0.

[0412] In step 2330 , a sixth width is determined based on the maximum seventh coordinate and the minimum seventh coordinate.

[0413] The sixth width is the length of the first screen boundary along the first axis, and is specifically the difference between the maximum seventh coordinate and the minimum seventh coordinate. If the maximum seventh coordinate is x_0+w_0 and the minimum seventh coordinate is x_0, then the sixth width is w_0.

[0414] In step 2340, the sixth height is determined based on the maximum eighth coordinate and the minimum eighth coordinate.

[0415] The sixth height is the length of the first screen boundary along the second axis, and the sixth height is specifically the difference between the maximum eighth coordinate and the minimum eighth coordinate. If the maximum eighth coordinate is y_0+h_0 and the minimum eighth coordinate is y_0, then the sixth height is h_0.

[0416] In step 2350, the fourth reference point coordinates, the sixth width, and the sixth height are integrated into a fourth position.

[0417] The fourth position is represented by the fourth reference point coordinates, the sixth width, and the sixth height. If the fourth reference point coordinates are (x_0, y_0), the sixth width is w_0, and the sixth height is h_0, then the fourth position can be expressed as (x_0, y_0, w_0, h_0).

[0418] The embodiment of steps 2310 to 2350 above obtains the coordinates of the fourth reference point of the first screen boundary relative to the first origin, and determines the sixth width based on the maximum seventh coordinate and the minimum seventh coordinate of the first screen boundary along the first axis, and determines the sixth height based on the maximum eighth coordinate and the minimum eighth coordinate along the second axis. This method can accurately determine the fourth position of the first screen boundary, thereby improving the efficiency of generating the navigation view.

[0419] Operations on the zoomed-out artboard elements of the navigation view

[0420] When using the navigation view, the object can also click, drag, and perform other operations on the navigation view as needed to update the artboard displayed in the current online collaboration artboard window.

[0421] In the above steps 1910 to 1930, based on the fourth position of the first screen boundary currently displayed in the online collaborative drawing board relative to the first origin and the reduction ratio, the fifth position of the first screen boundary after reduction relative to the first origin is determined, and then the fifth position is converted into a sixth position of the first screen boundary after reduction relative to the second origin, so as to render the first screen boundary after reduction at the sixth position. In this case, in one embodiment, referring to Fig.24 After step 1930, the navigation view generation method further includes:

[0422] Step 2410: in response to triggering of a reduced first artboard element outside a boundary of the reduced first screen in the navigation view, determining a first center position of the reduced first artboard element;

[0423] Step 2420: in the navigation view, obtain a reduced second picture centered at the first center position and having the same size as the reduced first picture;

[0424] Step 2430: based on the reduction ratio, restore the reduced second picture to the second picture, and display the second picture instead of the first picture.

[0425] Steps 2410 to 2430 are described in detail below.

[0426] In step 2410 , in response to triggering of a reduced first artboard element outside a boundary of the reduced first screen in the navigation view, a first center position of the reduced first artboard element is determined.

[0427] The first center position is the center position of the first artboard element after zooming out triggered in the navigation view.

[0428] Fig.25A and Fig.25B Navigation view and Figure 2A In the online collaborative drawing board, Fig.25A In the present invention, the object clicks on the reduced water drop-shaped artboard element, and the reduced water drop-shaped artboard element is located outside the boundary of the first screen. In response to triggering the reduced water drop-shaped artboard element in the navigation view, the first center position of the reduced water drop-shaped artboard element is determined.

[0429] In step 2420, in the navigation view, a reduced second screen is obtained that is centered at the first center position and has the same size as the reduced first screen.

[0430] The first image after reduction is the image displayed in the boundary of the first image after reduction. After determining the first artboard element after reduction, the boundary of the first image after reduction is moved so that the boundary of the first image after movement coincides with the first center position, thereby obtaining the boundary of the second image after reduction. The second image after reduction is the image displayed in the boundary of the second image after reduction.

[0431] Step 2430: based on the reduction ratio, restore the reduced second picture to the second picture, and display the second picture instead of the first picture.

[0432] After determining the reduced second screen, the reduced second screen is restored based on the reduction ratio to obtain the second screen, and the second screen is displayed to replace the first screen, that is, the second screen is rendered to the window of the online collaborative drawing board.

[0433] Reference Fig.25AIn response to triggering the reduced teardrop-shaped artboard element in the navigation view, the navigation view and each artboard element are processed to generate a second screen, and the second screen is rendered. The final rendering result is as follows: Fig.25B It can be clearly seen that the second screen is centered on the water drop-shaped drawing board element, and the boundary of the second screen displayed by the navigation view matches the second screen of the online collaboration drawing board window.

[0434] The embodiments of steps 2410 to 2430 described above respond to the triggering of the reduced first canvas element outside the boundary of the reduced first screen in the navigation view, and re-render the window of the online collaborative canvas. The rendered interface is centered on the triggered first canvas element. This method improves the operability of the navigation view and the switching efficiency of the online collaborative canvas window. This method pays more attention to the triggered first canvas element.

[0435] In another embodiment, referring to Fig.26 After step 1930, the navigation view generation method further includes:

[0436] Step 2610: in response to triggering of a reduced first artboard element outside a boundary of the reduced first screen in the navigation view, obtaining a reduced third screen including the reduced first artboard element in the navigation view, wherein the reduced third screen has the same size as the reduced first screen;

[0437] Step 2620: The reduced third picture is translated in the navigation video until it moves to the reduced artboard element containing the largest number;

[0438] Step 2630: based on the reduction ratio, restore the reduced third picture containing the largest number of reduced artboard elements to the third picture, and display the third picture instead of the first picture.

[0439] Steps 2610 to 2630 are described in detail below.

[0440] In step 2610, in response to triggering of a reduced first artboard element outside the boundary of the reduced first screen in the navigation view, a reduced third screen including the reduced first artboard element is obtained in the navigation view, and the reduced third screen has the same size as the reduced first screen.

[0441] The reduced third screen is a screen generated in response to triggering of a reduced first artboard element outside the boundary of the reduced first screen in the navigation view, and the reduced third screen includes the reduced first artboard element and has the same size as the reduced first screen.

[0442] In step 2620 , the zoomed-out third frame is translated in the navigation video until it moves to the zoomed-out artboard element containing the largest number.

[0443] After the reduced third picture is determined, the reduced third picture is moved so that the reduced third picture includes the maximum number of reduced artboard elements.

[0444] Step 2630: based on the reduction ratio, restore the reduced third picture containing the largest number of reduced artboard elements to the third picture, and display the third picture instead of the first picture.

[0445] After determining the reduced third screen, the reduced third screen is restored based on the reduction ratio to obtain the third screen, and the third screen is displayed to replace the first screen, that is, the third screen is rendered to the window of the online collaborative drawing board.

[0446] Reference Fig.21 In response to the object clicking on the rectangular envelope corresponding to the reduced teardrop-shaped artboard element, the navigation view and each artboard element are processed to generate a third screen, and the third screen is rendered. The final rendering result is as follows: Fig. 27 As shown. It can be clearly seen that the third screen contains a water drop-shaped artboard element, and the third screen contains the largest number of artboard elements. The boundary of the third screen displayed in the navigation view matches the third screen of the online collaboration artboard window.

[0447] The embodiments of steps 2610 to 2630 described above respond to the triggering of the reduced first canvas element outside the boundary of the reduced first screen in the navigation view, and re-render the window of the online collaborative canvas. The rendered interface includes a maximum number of canvas elements. This method improves the operability of the navigation view and the switching efficiency of the online collaborative canvas window. This method pays more attention to the correlation between the first canvas element and the surrounding canvas elements of the first canvas element.

[0448] In one embodiment, referring to Fig.28 After step 1930, the navigation view generation method further includes:

[0449] Step 2810: in response to a drag operation on the reduced second artboard element in the navigation view to a seventh position relative to the second origin, move the reduced second artboard element to the seventh position;

[0450] Step 2820: based on the positional relationship between the second origin and the first origin in the navigation view, convert the seventh position to an eighth position of the second artboard element relative to the first origin;

[0451] Step 2830: In the online collaborative drawing board, move the second drawing board element to the eighth position;

[0452] Step 2840: If the envelope graphic surrounding each artboard element in the online collaborative artboard changes after moving to the eighth position, return to the step of determining the reduction ratio based on the first size of the envelope graphic and the second size of the navigation view.

[0453] Steps 2810 to 2840 are described in detail below.

[0454] In step 2810 , in response to a drag operation on the reduced second artboard element in the navigation view to a seventh position relative to the second origin, the reduced second artboard element is moved to the seventh position.

[0455] The reduced second artboard element may be any reduced artboard element in the navigation view, and may be located within or outside the reduced first screen boundary.

[0456] The seventh position is another position in the navigation view that is different from the current position of the second artboard element. The object can move the mouse to drag the reduced second artboard element to the seventh position relative to the second origin.

[0457] Reference Fig.25A and Fig.29 The object drags the reduced five-pointed star artboard element in the navigation view and drags it to the upper edge of the boundary of the first screen after the current reduction.

[0458] In step 2820, based on the positional relationship between the second origin and the first origin in the navigation view, the seventh position is converted to an eighth position of the second artboard element relative to the first origin.

[0459] The seventh position is the position of the second artboard element relative to the second origin after being reduced, and the eighth position is the position of the second artboard element relative to the first origin. In the position conversion process, firstly, based on the positional relationship between the second origin and the first origin in the navigation view, the seventh position is converted to the position of the second artboard element relative to the first origin after being reduced, and then the position is restored to the eighth position of the second artboard element relative to the first origin based on the reduction ratio.

[0460] In step 2830, in the online collaborative artboard, the second artboard element is moved to an eighth position.

[0461] The online collaborative artboard and view navigation are updated synchronously, and based on the reduced second artboard element at the seventh position, the second artboard element is moved to the eighth position.

[0462] It should be noted that if the position of the second drawing board element before moving or the seventh position after moving is located within the boundary of the first drawing board after the reduction, the window of the online collaboration drawing board needs to be updated synchronously. Fig.29Based on the movement of the reduced second artboard element corresponding to the five-pointed star artboard element in the navigation view, the position of the five-pointed star artboard element in the viewport changes accordingly.

[0463] In step 2840, if the envelope graphic surrounding each artboard element in the online collaborative artboard changes after moving to the eighth position, return to the step of determining the reduction ratio based on the first size of the envelope graphic and the second size of the navigation view.

[0464] If the envelope graphic surrounding each artboard element in the online collaborative artboard changes after moving to the eighth position, return to the step of determining the reduction ratio based on the first size of the envelope graphic and the second size of the navigation view to update the navigation view.

[0465] Reference Fig.30 In the embodiment of the present disclosure, when operating the zoomed-out drawing board element in the navigation view, the interface of the online collaboration drawing board and the online collaboration drawing board window will be updated along with the navigation view.

[0466] The embodiments of steps 2810 to 2840 described above update the online collaborative drawing board and the window of the online collaborative drawing board in response to dragging the reduced second drawing board element in the navigation view. In addition, if the envelope graphic of the updated online collaborative drawing board changes, the navigation view is regenerated. This method improves the operability of the navigation view and enables fast synchronization between the online collaborative drawing board and the navigation view.

[0467] In one embodiment, in response to dragging the first screen boundary after being reduced in the navigation view to a ninth position relative to the second origin, the first screen boundary after being reduced is moved to the ninth position. Based on the positional relationship between the second origin and the first origin in the navigation view, the ninth position is converted to a tenth position of the first screen boundary relative to the first origin, so as to render the window of the online collaborative drawing board based on the tenth position. Fig.31 For Fig.29 The result of moving the first screen border after zooming out in view navigation.

[0468] In one embodiment, referring to Fig.30 In the embodiment of the present disclosure, when the canvas element in the online collaborative canvas window is operated, the online collaborative canvas and the interface of the navigation view will be updated following the online collaborative canvas window. Specifically, in response to the movement of the third canvas element in the online collaborative canvas window, the position of the reduced third canvas element in the online collaborative canvas is updated according to the position of the third canvas element after the movement. If the updated third canvas element causes a change in the envelope graphic, return to the step of determining the reduction ratio based on the first size of the envelope graphic and the second size of the navigation view.

[0469] It is to be understood that, although the steps in the above-mentioned flowcharts are sequentially displayed according to the characterization of arrows, these steps are not necessarily executed in sequence according to the order of arrow characterization. Unless there is a clear description in the present embodiment, the execution of these steps does not have a strict order restriction, and these steps can be executed in other orders. Moreover, at least a portion of the steps in the above-mentioned flowcharts can include multiple steps or multiple stages, and these steps or stages are not necessarily executed at the same time, but can be executed at different times, and the execution order of these steps or stages is not necessarily to be carried out in sequence, but can be executed in turn or alternately with other steps or at least a portion of the steps or stages in other steps.

[0470] It should be noted that in each specific implementation of the present disclosure, when it comes to the need to perform relevant processing based on data related to object characteristics such as object attribute information or attribute information sets, the permission or consent of the object will be obtained first, and the collection, use and processing of these data will comply with relevant laws, regulations and standards. In addition, when the embodiment of the present application needs to obtain object attribute information, the object's separate permission or separate consent will be obtained through a pop-up window or jump to a confirmation page. After clearly obtaining the object's separate permission or separate consent, the necessary object-related data for the normal operation of the embodiment of the present disclosure will be obtained.

[0471] Description of the apparatus and device of the present disclosure

[0472] Reference Fig.32 , Fig.32 A schematic diagram of the structure of a navigation view generating device for an online collaborative drawing board provided in an embodiment of the present disclosure. The navigation view generating device 3200 for an online collaborative drawing board includes:

[0473] The first generating unit 3210 is used to generate an envelope graphic surrounding each drawing board element in the online collaborative drawing board;

[0474] A first determining unit 3220, configured to determine a reduction ratio based on a first size of the envelope graph and a second size of the navigation view;

[0475] A second determining unit 3230, configured to determine a second position of each reduced artboard element relative to the first origin in the online collaborative artboard based on the first position of each artboard element relative to the first origin in the online collaborative artboard and the reduction ratio;

[0476] A position conversion unit 3240, configured to convert the second position into a third position of each reduced artboard element relative to the second origin based on the positional relationship between the second origin and the first origin in the navigation view;

[0477] The element rendering unit 3250 is used to render the reduced artboard element at the third position, thereby generating and displaying the rendered navigation view.

[0478] Optionally, the first generating unit 3210 is specifically configured to:

[0479] Obtaining the maximum first coordinate and the minimum first coordinate of each drawing board element in the online collaborative drawing board along the first axis, and the maximum second coordinate and the minimum second coordinate along the second axis, wherein the first axis is perpendicular to the second axis;

[0480] Generate a first line passing through the maximum first coordinate and perpendicular to the first axis, a second line passing through the minimum first coordinate and perpendicular to the first axis, a third line passing through the maximum second coordinate and perpendicular to the second axis, and a fourth line passing through the minimum second coordinate and perpendicular to the second axis;

[0481] A figure enclosed by the first line, the second line, the third line, and the fourth line is determined as an envelope figure.

[0482] Optionally, the first size includes a first width and a first height, and the second size includes a second width and a second height;

[0483] The first determining unit 3220 is specifically configured to:

[0484] Obtaining the maximum first coordinate and the minimum first coordinate of each drawing board element in the online collaborative drawing board along the first axis, and the maximum second coordinate and the minimum second coordinate along the second axis, wherein the first axis is perpendicular to the second axis;

[0485] Determine a first width based on the maximum first coordinate and the minimum first coordinate, and determine a first height based on the maximum second coordinate and the minimum second coordinate;

[0486] Get the maximum third coordinate and the minimum third coordinate of the boundary of the navigation view along the first axis, and the maximum fourth coordinate and the minimum fourth coordinate along the second axis;

[0487] Determine a second width based on the maximum third coordinate and the minimum third coordinate, and determine a second height based on the maximum fourth coordinate and the minimum fourth coordinate;

[0488] Based on the first width, the first height, the second width, and the second height, a reduction ratio is determined.

[0489] Optionally, the first determining unit 3220 is further configured to:

[0490] determining a first sub-reduction ratio based on the second width and the first width;

[0491] Determining a second sub-reduction ratio based on the second height and the first height;

[0492] The minimum value of the first sub-reduction ratio and the second sub-reduction ratio is determined as the reduction ratio.

[0493] Optionally, the first position is embodied as the first reference point coordinates of the first reference point of the first rectangular envelope surrounding the artboard element relative to the first origin, the third width and the third height of the first rectangular envelope; the second position is embodied as the second reference point coordinates of the second reference point of the second rectangular envelope surrounding the reduced artboard element relative to the first origin, the fourth width and the fourth height of the second rectangular envelope;

[0494] The second determining unit 3230 is specifically configured to:

[0495] Determining the coordinates of the second reference point based on the coordinates of the first reference point and the reduction ratio;

[0496] determining a fourth width based on the third width and the reduction ratio;

[0497] Based on the third height and the reduction ratio, a fourth height is determined.

[0498] Optionally, the navigation view generating device 3200 further includes:

[0499] A second generating unit, used to generate a first rectangular envelope surrounding the drawing board element;

[0500] A first acquisition unit, used to acquire a first reference point coordinate of a first reference point of the first rectangular envelope relative to a first origin;

[0501] A second acquisition unit, configured to acquire a maximum fifth coordinate and a minimum fifth coordinate of the first rectangular envelope along a first axis, and a maximum sixth coordinate and a minimum sixth coordinate along a second axis, wherein the first axis is perpendicular to the second axis;

[0502] a third determining unit, configured to determine a third width based on the maximum fifth coordinate and the minimum fifth coordinate;

[0503] a fourth determining unit, configured to determine a third height based on the maximum sixth coordinate and the minimum sixth coordinate;

[0504] The first integration unit is used to integrate the first reference point coordinates, the third width, and the third height into a first position.

[0505] Optionally, the positional relationship includes a first position offset of the second origin relative to the first origin on the first axis, and a second position offset of the second origin relative to the first origin on the second axis; the second position is reflected as the second reference point coordinates of the second reference point of the second rectangular envelope surrounding the reduced artboard element relative to the first origin, a fourth width and a fourth height of the second rectangular envelope; the third position is reflected as the third reference point coordinates of the second reference point of the second rectangular envelope surrounding the reduced artboard element relative to the second origin, a fifth width and a fifth height of the second rectangular envelope;

[0506] The position conversion unit 3240 is specifically used for:

[0507] Determining a third reference point coordinate based on the second reference point coordinate, the first position offset, the second position offset, and the reduction ratio;

[0508] The fifth width is determined to be equal to the fourth width, and the fifth height is determined to be equal to the fourth height.

[0509] Optionally, the second reference point coordinates include a first sub-coordinate along the first axis and a second sub-coordinate along the second axis; the third reference point coordinates include a third sub-coordinate along the first axis and a fourth sub-coordinate along the second axis;

[0510] The position conversion unit 3240 is further specifically used for:

[0511] generating an affine transformation matrix based on the first position offset, the second position offset, and the reduction ratio;

[0512] Based on the first partial coordinates, the second partial coordinates, and the affine transformation matrix, third partial coordinates and fourth partial coordinates are determined.

[0513] Optionally, the navigation view generating device 3200 further includes:

[0514] A fifth determining unit, configured to determine a fifth position of the first screen boundary after reduction relative to the first origin based on a fourth position of the first screen boundary currently displayed in the online collaborative drawing board relative to the first origin and a reduction ratio;

[0515] A first conversion unit, configured to convert the fifth position into a sixth position of the first screen boundary after reduction relative to the second origin based on a positional relationship between the second origin and the first origin in the navigation view;

[0516] The first rendering unit is used to render the first screen boundary after the reduction at the sixth position.

[0517] Optionally, the fourth position is embodied as a fourth reference point coordinate of a fourth reference point of the first screen boundary relative to the first origin, a sixth width and a sixth height of the first screen boundary; the fifth position is embodied as a fifth reference point coordinate of a fifth reference point of the first screen boundary after reduction relative to the first origin, a seventh width and a seventh height of the first screen boundary after reduction;

[0518] The fifth determining unit is specifically configured to:

[0519] Determining the coordinates of the fifth reference point based on the coordinates of the fourth reference point and the reduction ratio;

[0520] determining a seventh width based on the sixth width and the reduction ratio;

[0521] Based on the sixth height and the reduction rate, a seventh height is determined.

[0522] Optionally, the navigation view generating device 3200 further includes:

[0523] A third acquisition unit, used to acquire the coordinates of a fourth reference point of a first picture boundary relative to the first origin;

[0524] a fourth acquisition unit, configured to acquire a maximum seventh coordinate and a minimum seventh coordinate of a first screen boundary along a first axis, and a maximum eighth coordinate and a minimum eighth coordinate along a second axis, wherein the first axis is perpendicular to the second axis;

[0525] a sixth determining unit, configured to determine a sixth width based on the maximum seventh coordinate and the minimum seventh coordinate;

[0526] a seventh determining unit, configured to determine a sixth height based on the maximum eighth coordinate and the minimum eighth coordinate;

[0527] The second integration unit is used to integrate the fourth reference point coordinates, the sixth width, and the sixth height into a fourth position.

[0528] Optionally, the navigation view generating device 3200 further includes:

[0529] A first response unit, configured to determine a first center position of the reduced first artboard element in response to triggering of the reduced first artboard element outside the boundary of the reduced first screen in the navigation view;

[0530] a fifth acquisition unit, configured to acquire, in the navigation view, a reduced second picture centered at the first center position and having the same size as the reduced first picture;

[0531] The first display unit is used to restore the reduced second picture to the second picture based on the reduction ratio, and display the second picture to replace the first picture.

[0532] Optionally, the navigation view generating device 3200 further includes:

[0533] A second response unit is used for obtaining a reduced third screen including the reduced first artboard element in the navigation view in response to triggering of the reduced first screen element outside the boundary of the reduced first screen in the navigation view, wherein the reduced third screen has the same size as the reduced first screen;

[0534] A translation unit, used for translating the reduced third picture in the navigation video until it moves to the reduced artboard element containing the largest number;

[0535] The second display unit is used to restore the reduced third picture containing the largest number of reduced artboard elements to the third picture based on the reduction ratio, and display the third picture to replace the first picture.

[0536] Optionally, the navigation view generating device 3200 further includes:

[0537] a third response unit, in response to a drag operation on the reduced second artboard element in the navigation view to a seventh position relative to the second origin, moving the reduced second artboard element to the seventh position;

[0538] A second conversion unit, configured to convert the seventh position into an eighth position of the second artboard element relative to the first origin based on a positional relationship between the second origin and the first origin in the navigation view;

[0539] A moving unit, used to move the second drawing board element to an eighth position in the online collaborative drawing board;

[0540] The return unit is used to return to the step of determining the reduction ratio based on the first size of the envelope graphic and the second size of the navigation view if the envelope graphic surrounding each drawing board element in the online collaborative drawing board changes after moving to the eighth position.

[0541] Optionally, the first generating unit 3210 is further configured to:

[0542] Determine the first viewing number of each artboard element in the online collaborative artboard by the target object;

[0543] Determine a second viewing number of each artboard element in the online collaborative artboard by each platform object other than the target object;

[0544] Determine a first target artboard element among the artboard elements based on the first viewing number and the second viewing number;

[0545] An envelope graphic is generated to surround each first target artboard element in the online collaborative artboard.

[0546] Optionally, the first generating unit 3210 is further configured to:

[0547] Determine, among the various drawing board elements in the online collaborative drawing board, a second target drawing board element generated by the target object;

[0548] An envelope graphic is generated to surround each second target artboard element in the online collaborative artboard.

[0549] Reference Fig.33 , Fig.33The structural block diagram of the terminal part of the method for generating a navigation view of an online collaborative drawing board in the embodiment of the present disclosure is as follows: the terminal includes: a radio frequency (RF) circuit 3310, a memory 3315, an input unit 3330, a display unit 3340, a sensor 3350, an audio circuit 3360, a wireless fidelity (WiFi) module 3370, a processor 3380, and a power supply 3390. Those skilled in the art can understand that Fig.33 The terminal structure shown does not constitute a limitation on the mobile phone or computer, and may include more or fewer components than shown in the figure, or combine certain components, or arrange the components differently.

[0550] The RF circuit 3310 can be used for receiving and sending signals during information transmission or calls. In particular, after receiving the downlink information from the base station, it is sent to the processor 3380 for processing; in addition, the designed uplink data is sent to the base station.

[0551] The memory 3315 may be used to store software programs and modules. The processor 3380 executes various functional applications and data processing of the content terminal by running the software programs and modules stored in the memory 3315 .

[0552] The input unit 3330 may be used to receive input digital or character information and generate key signal input related to the setting and function control of the content terminal. Specifically, the input unit 3330 may include a touch panel 3331 and other input devices 3333.

[0553] The display unit 3340 may be used to display input information or provided information and various menus of the content terminal. The display unit 3340 may include a display panel 3341.

[0554] The audio circuit 3360, the speaker 3361, and the microphone 3362 may provide an audio interface.

[0555] In this embodiment, the processor 3380 included in the terminal can execute the navigation view generation method of the online collaborative drawing board in the previous embodiment.

[0556] The terminals of the embodiments of the present disclosure include but are not limited to mobile phones, computers, intelligent voice interaction devices, smart home appliances, vehicle terminals, aircraft, etc. The embodiments of the present invention can be applied to various scenarios, including but not limited to content recommendation, data screening, etc.

[0557] Fig.34A block diagram of the structure of a portion of a server for implementing a method for generating a navigation view of an online collaborative drawing board according to an embodiment of the present disclosure. The server may have relatively large differences due to different configurations or performances, and may include one or more central processing units (CPUs) 3422 (e.g., one or more processors) and memories 3432, and one or more storage media 3430 (e.g., one or more mass storage devices) storing application programs 3442 or data 3444. Among them, the memories 3432 and the storage media 3430 may be temporary storage or permanent storage. The program stored in the storage medium 3430 may include one or more modules (not shown in the figure), and each module may include a series of instruction operations on the server. Furthermore, the central processing unit 3422 may be configured to communicate with the storage medium 3430 to execute a series of instruction operations in the storage medium 3430 on the server.

[0558] The server may also include one or more power supplies 3426, one or more wired or wireless network interfaces 3450, one or more input and output interfaces 3458, and / or one or more operating systems 3441, such as Windows ServerTM, Mac OS XTM, UnixTM, Li nuxTM, FreeBSDTM, etc.

[0559] The central processor 3422 in the server can be used to execute the navigation view generation method of the online collaborative drawing board in the embodiment of the present disclosure.

[0560] The embodiments of the present disclosure also provide a computer-readable storage medium, which is used to store program codes, and the program codes are used to execute the navigation view generation method of the online collaborative drawing board of the aforementioned embodiments.

[0561] The embodiment of the present disclosure also provides a computer program product, which includes a computer program. A processor of a computer device reads and executes the computer program, so that the computer device executes the above-mentioned method for generating a navigation view of an online collaborative drawing board.

[0562] The terms "first", "second", "third", "fourth", etc. (if any) in the specification of the present disclosure and the above-mentioned drawings are used to distinguish similar contents, and are not necessarily used to describe a specific order or sequence. It should be understood that the data used in this way can be interchangeable where appropriate, so that the embodiments of the present disclosure described herein can, for example, be implemented in an order other than those illustrated or described herein. In addition, the terms "comprises" and "comprising" and any variations thereof are intended to cover non-exclusive inclusions, for example, a process, method, system, product or device comprising a series of steps or units is not necessarily limited to those steps or units clearly listed, but may include other steps or units that are not clearly listed or inherent to these processes, methods, products or devices.

[0563] It should be understood that in the present disclosure, "at least one (item)" means one or more, and "plurality" means two or more. "And / or" is used to describe the association relationship of associated content, indicating that three relationships may exist. For example, "A and / or B" can mean: only A exists, only B exists, and A and B exist at the same time, where A and B can be singular or plural. The character " / " generally indicates that the associated content before and after is in an "or" relationship. "At least one of the following" or similar expressions refers to any combination of these items, including any combination of single or plural items. For example, at least one of a, b or c can mean: a, b, c, "a and b", "a and c", "b and c", or "a and b and c", where a, b, c can be single or multiple.

[0564] It should be understood that in the description of the embodiments of the present disclosure, the meaning of multiple (or multiple items) is more than two, greater than, less than, exceed, etc. are understood to not include the number, and above, below, within, etc. are understood to include the number.

[0565] In the several embodiments provided in the present disclosure, it should be understood that the disclosed systems, devices and methods can be implemented in other ways. For example, the device embodiments described above are only schematic, for example, the division of units is only a logical function division, and there may be other division methods in actual implementation, such as multiple units or components can be combined or integrated into another system, or some features can be ignored or not executed. The mutual coupling or direct coupling or communication connection shown or discussed can be an indirect coupling or communication connection through some interfaces, devices or units, which can be electrical, mechanical or other forms.

[0566] The units described as separate components may or may not be physically separated, and the components shown as units may or may not be physical units, that is, they may be located in one place or distributed on multiple network units. Some or all of the units may be selected according to actual needs to achieve the purpose of the solution of this embodiment.

[0567] In addition, each functional unit in each embodiment of the present disclosure may be integrated into one processing unit, or each unit may exist physically separately, or two or more units may be integrated into one unit. The above-mentioned integrated unit may be implemented in the form of hardware or in the form of software functional units.

[0568] If the integrated unit is implemented in the form of a software functional unit and sold or used as an independent product, it can be stored in a computer-readable storage medium. Based on this understanding, the technical solution of the present disclosure is essentially or the part that contributes to the prior art or all or part of the technical solution can be embodied in the form of a software product, and the computer software product is stored in a storage medium, including a number of instructions to enable a computer device (which can be a personal computer, server 130, or network device, etc.) to perform all or part of the steps of the various embodiments of the present disclosure. The aforementioned storage medium includes: U disk, mobile hard disk, read-only memory (Read-Only Memory, referred to as ROM), random access memory (Random Access Memory, referred to as RAM), disk or optical disk and other media that can store program codes.

[0569] It should also be understood that the various implementations provided in the embodiments of the present disclosure can be combined arbitrarily to achieve different technical effects.

[0570] The above is a specific description of the implementation methods of the present disclosure, but the present disclosure is not limited to the above implementation methods. Technical personnel familiar with the art can also make various equivalent modifications or substitutions without violating the spirit of the present disclosure. These equivalent modifications or substitutions are all included in the scope defined by the claims of the present disclosure.

Claims

1. A method for generating a navigation view of an online collaborative drawing board, characterized in that: include: Generate an envelope graphic surrounding each artboard element in the online collaborative artboard; determining a reduction ratio based on a first size of the envelope graphic and a second size of the navigation view; Based on the first position of each of the artboard elements relative to the first origin in the online collaborative artboard and the reduction ratio, determining the second position of each of the reduced artboard elements relative to the first origin; Based on the positional relationship between the second origin and the first origin in the navigation view, converting the second position into a third position of each reduced artboard element relative to the second origin; At the third position, the reduced artboard element is rendered, thereby generating and displaying the rendered navigation view.

2. The method for generating a navigation view according to claim 1, characterized in that: The step of generating an envelope graphic surrounding each drawing board element in the online collaborative drawing board includes: Acquire the maximum first coordinate and the minimum first coordinate of each drawing board element in the online collaborative drawing board along the first axis, and the maximum second coordinate and the minimum second coordinate along the second axis, wherein the first axis is perpendicular to the second axis; Generate a first line passing through the maximum first coordinate and perpendicular to the first axis, a second line passing through the minimum first coordinate and perpendicular to the first axis, a third line passing through the maximum second coordinate and perpendicular to the second axis, and a fourth line passing through the minimum second coordinate and perpendicular to the second axis; A figure enclosed by the first line, the second line, the third line, and the fourth line is determined as the envelope figure.

3. The method for generating a navigation view according to claim 1, characterized in that: The first size includes a first width and a first height, and the second size includes a second width and a second height; The determining of the reduction ratio based on the first size of the envelope graphic and the second size of the navigation view includes: Acquire the maximum first coordinate and the minimum first coordinate of each drawing board element in the online collaborative drawing board along the first axis, and the maximum second coordinate and the minimum second coordinate along the second axis, wherein the first axis is perpendicular to the second axis; Determine the first width based on the maximum first coordinate and the minimum first coordinate, and determine the first height based on the maximum second coordinate and the minimum second coordinate; Obtain a maximum third coordinate and a minimum third coordinate of a boundary of the navigation view along the first axis, and a maximum fourth coordinate and a minimum fourth coordinate along the second axis; Determine the second width based on the maximum third coordinate and the minimum third coordinate, and determine the second height based on the maximum fourth coordinate and the minimum fourth coordinate; The reduction ratio is determined based on the first width, the first height, the second width, and the second height.

4. The method for generating a navigation view according to claim 3, characterized in that: The determining the reduction ratio based on the first width, the first height, the second width, and the second height includes: determining a first sub-reduction ratio based on the second width and the first width; determining a second sub-reduction ratio based on the second height and the first height; The minimum value of the first sub-reduction ratio and the second sub-reduction ratio is determined as the reduction ratio.

5. The method for generating a navigation view according to claim 1, characterized in that: The first position is embodied as a first reference point coordinate of a first rectangular envelope surrounding the artboard element relative to the first origin, a third width and a third height of the first rectangular envelope; the second position is embodied as a second reference point coordinate of a second rectangular envelope surrounding the reduced artboard element relative to the first origin, a fourth width and a fourth height of the second rectangular envelope; The determining, based on the first position of each of the artboard elements relative to the first origin in the online collaborative artboard and the reduction ratio, the second position of each of the artboard elements after reduction relative to the first origin includes: Determine the coordinates of the second reference point based on the coordinates of the first reference point and the reduction ratio; determining the fourth width based on the third width and the reduction ratio; Based on the third height and the reduction ratio, the fourth height is determined.

6. The method for generating a navigation view according to claim 5, characterized in that: The first position is determined by: Generate the first rectangular envelope surrounding the artboard element; Obtaining the first reference point coordinates of the first reference point of the first rectangular envelope relative to the first origin; Obtaining a maximum fifth coordinate and a minimum fifth coordinate of the first rectangular envelope along a first axis, and a maximum sixth coordinate and a minimum sixth coordinate along a second axis, wherein the first axis is perpendicular to the second axis; determining the third width based on the maximum fifth coordinate and the minimum fifth coordinate; determining the third height based on the maximum sixth coordinate and the minimum sixth coordinate; The first reference point coordinates, the third width, and the third height are integrated into the first position.

7. The navigation view generation method according to claim 1, characterized in that: The positional relationship includes a first position offset of the second origin relative to the first origin on the first axis, and a second position offset of the second origin relative to the first origin on the second axis; the second position is embodied as a second reference point coordinate of a second rectangular envelope surrounding the reduced artboard element relative to the first origin, a fourth width and a fourth height of the second rectangular envelope; the third position is embodied as a third reference point coordinate of a second rectangular envelope surrounding the reduced artboard element relative to the second origin, a fifth width and a fifth height of the second rectangular envelope; The converting the second position into a third position of each reduced artboard element relative to the second origin based on the positional relationship between the second origin and the first origin in the navigation view includes: determining the third reference point coordinates based on the second reference point coordinates, the first position offset, the second position offset, and the reduction ratio; The fifth width is determined to be equal to the fourth width, and the fifth height is determined to be equal to the fourth height.

8. The method for generating a navigation view according to claim 7, characterized in that: The second reference point coordinates include a first sub-coordinate along the first axis and a second sub-coordinate along the second axis; the third reference point coordinates include a third sub-coordinate along the first axis and a fourth sub-coordinate along the second axis; The determining the third reference point coordinates based on the second reference point coordinates, the first position offset, the second position offset, and the reduction ratio comprises: generating an affine transformation matrix based on the first position offset, the second position offset, and the reduction ratio; The third and fourth partial coordinates are determined based on the first partial coordinates, the second partial coordinates, and the affine transformation matrix.

9. The navigation view generation method according to claim 1, characterized in that: After rendering the reduced artboard element at the third position, thereby generating and displaying the rendered navigation view, the navigation view generation method further includes: Based on a fourth position of a first screen boundary currently displayed in the online collaborative drawing board relative to the first origin and the reduction ratio, determining a fifth position of the first screen boundary after reduction relative to the first origin; Based on the positional relationship between the second origin and the first origin in the navigation view, converting the fifth position into a sixth position of the boundary of the zoomed-out first screen relative to the second origin; At the sixth position, the reduced first screen boundary is rendered.

10. The method for generating a navigation view according to claim 9, characterized in that: The fourth position is embodied as a fourth reference point coordinate of a fourth reference point of the first screen boundary relative to the first origin, a sixth width and a sixth height of the first screen boundary; the fifth position is embodied as a fifth reference point coordinate of a fifth reference point of the first screen boundary after reduction relative to the first origin, a seventh width and a seventh height of the first screen boundary after reduction; The determining, based on a fourth position of a first screen boundary currently displayed in the online collaborative drawing board relative to the first origin and the reduction ratio, a fifth position of the first screen boundary after reduction relative to the first origin includes: Determining the fifth reference point coordinates based on the fourth reference point coordinates and the reduction ratio; determining the seventh width based on the sixth width and the reduction ratio; Based on the sixth height and the reduction ratio, the seventh height is determined.

11. The method for generating a navigation view according to claim 10, characterized in that: The fourth position is determined by: Acquire the fourth reference point coordinates of the fourth reference point of the first screen boundary relative to the first origin; Acquire a maximum seventh coordinate and a minimum seventh coordinate of the first screen boundary along a first axis, and a maximum eighth coordinate and a minimum eighth coordinate along a second axis, wherein the first axis is perpendicular to the second axis; determining the sixth width based on the maximum seventh coordinate and the minimum seventh coordinate; determining the sixth height based on the maximum eighth coordinate and the minimum eighth coordinate; The fourth reference point coordinates, the sixth width, and the sixth height are integrated into the fourth position.

12. The method for generating a navigation view according to claim 9, characterized in that: At the sixth position, after rendering the reduced first screen boundary, the navigation view generation method further includes: In response to triggering a reduced first artboard element outside the reduced first screen boundary in the navigation view, determining a first center position of the reduced first artboard element; In the navigation view, obtaining a reduced second picture centered at the first center position and having the same size as the reduced first picture; Based on the reduction ratio, the reduced second picture is restored to a second picture, and the second picture is displayed to replace the first picture.

13. The method for generating a navigation view according to claim 9, characterized in that: At the sixth position, after rendering the reduced first screen boundary, the navigation view generation method further includes: In response to triggering of a reduced first artboard element outside a boundary of the reduced first screen in the navigation view, acquiring a reduced third screen including the reduced first artboard element in the navigation view, wherein the reduced third screen has the same size as the reduced first screen; The zoomed-out third picture is translated in the navigation video until it moves to the zoomed-out painting board element containing the largest number; Based on the reduction ratio, the reduced third picture containing the largest number of the reduced artboard elements is restored as a third picture, and the third picture is displayed to replace the first picture.

14. The method for generating a navigation view according to claim 9, characterized in that: At the sixth position, after rendering the reduced first screen boundary, the navigation view generation method further includes: In response to a drag operation on the reduced second artboard element in the navigation view to a seventh position relative to the second origin, moving the reduced second artboard element to the seventh position; Based on the positional relationship between the second origin and the first origin in the navigation view, converting the seventh position into an eighth position of the second artboard element relative to the first origin; In the online collaborative drawing board, moving the second drawing board element to the eighth position; If the envelope graphic surrounding each drawing board element in the online collaborative drawing board changes after moving to the eighth position, return to the step of determining the reduction ratio based on the first size of the envelope graphic and the second size of the navigation view.

15. The method for generating a navigation view according to claim 1, characterized in that: The step of generating an envelope graphic surrounding each drawing board element in the online collaborative drawing board includes: Determine a first viewing number of each drawing board element in the online collaborative drawing board by a target object; Determine a second number of times each drawing board element in the online collaborative drawing board is viewed by each platform object other than the target object; Determine a first target artboard element from among the artboard elements based on the first viewing number and the second viewing number; The envelope graphic surrounding each of the first target artboard elements in the online collaborative artboard is generated.

16. The method for generating a navigation view according to claim 1, characterized in that: The step of generating an envelope graphic surrounding each drawing board element in the online collaborative drawing board includes: Determine, among the various drawing board elements in the online collaborative drawing board, a second target drawing board element generated by the target object; The envelope graphic surrounding each of the second target artboard elements in the online collaborative artboard is generated.

17. A navigation view generation device for an online collaborative drawing board, characterized in that: include: A first generating unit, configured to generate an envelope graphic surrounding each drawing board element in the online collaborative drawing board; A first determining unit, configured to determine a reduction ratio based on a first size of the envelope graphic and a second size of the navigation view; A second determining unit, configured to determine, based on the first position of each of the artboard elements relative to the first origin in the online collaborative artboard and the reduction ratio, a second position of each of the reduced artboard elements relative to the first origin; a position conversion unit, configured to convert the second position into a third position of each reduced artboard element relative to the second origin based on a positional relationship between the second origin and the first origin in the navigation view; An element rendering unit is used to render the reduced artboard element at the third position, thereby generating and displaying the rendered navigation view.

18. An electronic device comprising a memory and a processor, wherein the memory stores a computer program, wherein: When the processor executes the computer program, the method for generating a navigation view of an online collaborative drawing board according to any one of claims 1 to 16 is implemented.

19. A computer-readable storage medium storing a computer program, characterized in that: When the computer program is executed by a processor, the method for generating a navigation view of an online collaborative drawing board according to any one of claims 1 to 16 is implemented.

20. A computer program product, comprising a computer program, wherein the computer program is read and executed by a processor of a computer device, so that the computer device executes the method for generating a navigation view of an online collaborative drawing board according to any one of claims 1 to 16.

Images