Data visualization method and device, electronic equipment and medium

Abstract

The invention relates to a data visualization method and device, electronic equipment and a medium. The data visualization method comprises the following steps: in response to an operation of dragging a data table to a canvas by a user, determining whether a first node formed by the data table on the canvas collides with a second node in the canvas; under the condition that the first node collides with the second node, determining the node type of the second node; and generating a target node on the canvas according to the node type of the second node. Whether the two nodes are combined or not is determined by determining whether the first node and the second node collide or not, and a user can quickly combine the data set in the data table with the data set in the second node, so that the operation complexity of the visualization system is reduced. Meanwhile, the user can drag the data table to the canvas in a dragging mode to create the data set, and the data set creation mode is simple, so that the complexity of operation of the visualization system is further reduced.

Description

Technical Field

[0001] The present disclosure relates to the technical field of data visualization, and in particular to a data visualization method, device, electronic device and medium. Background Art

[0002] At present, there are problems of complex operation in the operation of visualization system. Summary of the invention

[0003] In order to overcome the problems existing in the related art, the present disclosure provides a data visualization method, device, electronic device and medium.

[0004] According to a first aspect of an embodiment of the present disclosure, a data visualization method is provided, the data visualization method comprising:

[0005] In response to a user dragging a data table to a canvas, determining whether a first node formed by the data table on the canvas collides with a second node in the canvas;

[0006] In the case where the first node collides with the second node, determining a node type of the second node;

[0007] A target node is generated on the canvas according to the node type of the second node.

[0008] In some embodiments of the present disclosure, determining whether a first node formed by the data table on the canvas collides with a second node in the canvas includes:

[0009] Determine the position information of the first node on the canvas;

[0010] Determining whether the location information is located in a collision area of ​​the second node;

[0011] When the location information is within the collision area, determining that the first node collides with the second node;

[0012] When the position information is outside the collision area, it is determined that the first node does not collide with the second node.

[0013] In some embodiments of the present disclosure, before determining whether a first node formed by the data table on the canvas collides with a second node in the canvas, the data visualization method further includes:

[0014] determining a first length of the second node in the first direction and a second length in the second direction;

[0015] Determine a sum and a difference between the first coordinate of the second node and the first length in the first direction as a first boundary and a second boundary in the first direction, respectively;

[0016] Determine a sum and a difference between the second coordinate of the second node and the second length in the second direction as a third boundary and a fourth boundary in the second direction respectively;

[0017] determining an area formed by the first boundary, the second boundary, the third boundary and the fourth boundary as the collision area;

[0018] The first direction is perpendicular to the second direction.

[0019] In some embodiments of the present disclosure, generating a target node on the canvas according to the node type of the second node includes:

[0020] In the case where the node type of the second node is a model node, displaying prompt information, wherein the prompt information is used to prompt the user whether to merge the first node with the second node;

[0021] In response to a user's confirmation operation on the prompt information, merging the first node and the second node as the target node on the canvas, and generating the target node;

[0022] In response to a user cancelling an operation on the prompt information, the node type of the first node is set as the model node on the canvas, and the set first node is generated as the target node.

[0023] In some embodiments of the present disclosure, generating a target node on the canvas according to the node type of the second node includes:

[0024] In a case where the node type of the second node is a node type other than a model node, the first node is generated as the target node on the canvas.

[0025] In some embodiments of the present disclosure, after generating a target node on the canvas according to the node type of the second node, the data visualization method further includes:

[0026] In response to an export operation by a user, exporting the target node as a first data model, wherein the first data model is used to construct a visual chart;

[0027] In response to a publishing operation by the user, the first data model is published.

[0028] In some embodiments of the present disclosure, the data visualization method further includes:

[0029] In response to a first generation operation of a third node by a user on the canvas, forming a connection node associated with the third node, wherein the node type of the third node is a model node;

[0030] In response to a first configuration operation of the user on the connection node, configuring the connection node;

[0031] When the connection node configuration is completed, the connection node is generated on the canvas.

[0032] In some embodiments of the present disclosure, the first configuration operation includes a first configuration sub-operation and a second configuration sub-operation; and in response to the user's first configuration operation on the connection node, configuring the connection node includes:

[0033] In response to a first configuration sub-operation of the user on the connection node, determining a first data set of a fourth node corresponding to the first configuration sub-operation, the type of the fourth node being the model node;

[0034] In response to a second configuration sub-operation of the user on the connection node, the first data set is connected to the second data set of the third node with a connection relationship corresponding to the second configuration sub-operation.

[0035] In some embodiments of the present disclosure, after generating the connection node on the canvas, the data visualization method further includes:

[0036] In response to an export operation by a user, exporting the connection nodes as a second data model, wherein the second data model is used to construct a visual chart;

[0037] In response to a publishing operation by the user, the second data model is published.

[0038] In some embodiments of the present disclosure, the data visualization method further includes:

[0039] In response to a second generation operation of the user on the fifth node on the canvas, a structured query language node associated with the fifth node is formed, and the node type of the fifth node is a model node;

[0040] In response to a second configuration operation of the user on the structured query language node, configuring the structured query language node;

[0041] In response to a third generation operation of the user on the structured query language node, the structured query language node is generated on the canvas.

[0042] In some embodiments of the present disclosure, after configuring the structured query language node, the data visualization method further includes:

[0043] In response to a user's operation on the structured query language node, generating a third data set corresponding to the structured query language node;

[0044] In response to a third configuration operation of the user on the structured query language node, the third data set is configured.

[0045] In some embodiments of the present disclosure, after generating the structured query language node on the canvas, the data visualization method further includes:

[0046] In response to an export operation by a user, exporting the structured query language node as a third data model, wherein the third data model is used to construct a visual chart;

[0047] In response to a publishing operation of the user, the third data model is published.

[0048] In some embodiments of the present disclosure, before determining, in response to the user dragging the data table to the canvas, whether a first node formed by the data table on the canvas collides with a second node in the canvas, the data visualization method further includes:

[0049] In response to a definition operation by a user, defining nodes of different node types;

[0050] In response to a registration operation by a user, registering nodes of each of the node types;

[0051] In response to a fourth configuration operation of the user, configuring the canvas;

[0052] In response to the user's binding operation, event binding is performed on the nodes of each node type.

[0053] According to a second aspect of an embodiment of the present disclosure, a data visualization device is provided, the data visualization device comprising:

[0054] A first determination module, wherein the first determination module is configured to determine whether a first node formed by the data table on the canvas collides with a second node in the canvas in response to a user dragging the data table to the canvas;

[0055] a second determination module, the second determination module being configured to determine a node type of the second node when the first node collides with the second node;

[0056] A generating module is configured to generate a target node on the canvas according to a node type of the second node.

[0057] According to a third aspect of an embodiment of the present disclosure, an electronic device is provided, the electronic device comprising:

[0058] processor;

[0059] a memory for storing instructions executable by the processor;

[0060] Wherein, the processor is configured to execute the data visualization method as described above.

[0061] According to a fourth aspect of an embodiment of the present disclosure, a non-transitory computer-readable storage medium is provided. When instructions in the storage medium are executed by a processor of a terminal, the terminal is enabled to perform the data visualization method as described above.

[0062] The technical solution provided by the embodiments of the present disclosure may have the following beneficial effects:

[0063] In the case where the user needs to create a data set, the user can drag the data table to the canvas. In response to the user dragging the data table to the canvas, it is determined whether the first node formed by the data table on the canvas collides with the second node in the canvas to determine whether to directly generate the first node. In the case where the first node collides with the second node, the user may want to merge the first node with the second node, and determine the node type of the second node to determine whether the second node can be merged. According to the node type, it is determined whether to merge the first node with the second node, and a target node is generated on the canvas. By determining whether the first node and the second node collide to determine whether to merge the two nodes, the user can quickly merge the data set in the data table with the data set in the second node, thereby reducing the complexity of the operation of the visualization system. At the same time, since the user can drag the data table to the canvas to create a data set by dragging, the method of creating the data set is simple, thereby further reducing the complexity of the operation of the visualization system.

[0064] It is to be understood that the foregoing general description and the following detailed description are exemplary and explanatory only and are not restrictive of the present disclosure. BRIEF DESCRIPTION OF THE DRAWINGS

[0065] The accompanying drawings, which are incorporated in and constitute a part of this specification, illustrate embodiments consistent with the present disclosure and, together with the description, serve to explain the principles of the present disclosure.

[0066] Figure 1 is a flowchart of a data visualization method according to an exemplary embodiment;

[0067] Figure 2 is a schematic diagram of a visualization system according to an exemplary embodiment;

[0068] Figure 3 is a flowchart of a data visualization method according to another exemplary embodiment;

[0069] Figure 4 is a flowchart of a data visualization method according to another exemplary embodiment;

[0070] Figure 5-1 is a schematic diagram of a visualization system according to another exemplary embodiment;

[0071] Figure 5-2 is a schematic diagram of a visualization system according to another exemplary embodiment;

[0072] Figure 6 is a flowchart of a data visualization method according to another exemplary embodiment;

[0073] Figure 7 is a flowchart of a data visualization method according to another exemplary embodiment;

[0074] Figure 8 is a flowchart of a data visualization method according to another exemplary embodiment;

[0075] Fig. 9 is a flowchart of a data visualization method according to another exemplary embodiment;

[0076] Fig.10 is a block diagram of a data visualization device according to an exemplary embodiment;

[0077] Fig.11 is a block diagram of an electronic device according to an exemplary embodiment.

[0078] In the figure:

[0079] 100 - first determination module; 200 - second determination module; 300 - generation module; 400 - electronic device; 402 - processing component; 404 - memory; 406 - power supply component; 408 - multimedia component; 410 - audio component; 412 - input / output interface; 414 - sensor component; 416 - communication component; 420 - processor. DETAILED DESCRIPTION

[0080] Exemplary embodiments will be described in detail herein, examples of which are shown in the accompanying drawings. When the following description refers to the drawings, unless otherwise indicated, the same numbers in different drawings represent the same or similar elements. The embodiments described in the following exemplary embodiments do not represent all embodiments consistent with the present disclosure. Instead, they are merely examples of devices and methods consistent with some aspects of the present disclosure as detailed in the appended claims. It should also be understood that the term "and / or" as used herein refers to and includes any or all possible combinations of one or more associated listed items.

[0081] At present, with the development of information technology and the improvement of user needs, electronic devices can visualize data through visualization systems to facilitate users to understand and analyze data. Visualization systems are widely used in the fields of industry, medical care, education, finance, military, etc. Visualization systems can present data through tables, graphics, and visualization tools. For example, data visualization can be performed through ad hoc reports, online analytical processing (OLAP) systems, and business-level data charts (Enterprise Charts, Echarts).

[0082] In the related art, a data visualization method is provided. When a user needs to add a data table to a canvas, the user needs to click on the data table and set the position of the data table in the canvas. When the data set in the data table needs to be merged with the data set of the node in the canvas, the data table and the node need to be configured separately. Therefore, during the operation of the visualization system, there is a problem of complex operation for the creation and merging of data sets.

[0083] In order to solve the above technical problems, the present disclosure provides a data visualization method, which creates a data set by dragging a data table to a canvas, avoiding clicking on the data table and setting the position of the data table in the canvas, thereby reducing the complexity of the visualization system operation. At the same time, by dragging the data table so that the first node formed by the data table on the canvas collides with the second node in the canvas, the data set in the data table can be merged with the data set in the second node without configuring the data table and the second node separately, thereby further reducing the complexity of the visualization system operation.

[0084] The present disclosure provides a data visualization method. Figure 1 As shown, the method includes:

[0085] S100 : In response to a user dragging a data table to a canvas, determining whether a first node formed by the data table on the canvas collides with a second node on the canvas.

[0086] S200: When a first node collides with a second node, determine a node type of the second node.

[0087] S300: Generate a target node on the canvas according to the node type of the second node.

[0088] In this embodiment, when a user needs to create a data set, the user can drag a data table to the canvas. In response to the user dragging the data table to the canvas, it is determined whether the first node formed by the data table on the canvas collides with the second node in the canvas to determine whether to directly generate the first node. In the case where the first node collides with the second node, the user may want to merge the first node with the second node, and determine the node type of the second node to determine whether the second node can be merged. According to the node type, it is determined whether to merge the first node with the second node, and a target node is generated on the canvas. By determining whether the first node and the second node collide to determine whether to merge the two nodes, the user can quickly merge the data set in the data table with the data set in the second node, thereby reducing the complexity of the operation of the visualization system. At the same time, since the user can drag the data table to the canvas to create a data set by dragging, the method of creating the data set is simple, thereby further reducing the complexity of the operation of the visualization system.

[0089] Exemplarily, the node type of the first node may be a table node. The second node may be any node in the canvas. Determining whether the first node formed by the data table in the canvas collides with the second node in the canvas in step S100 may be determining whether the first node collides with any second node in the canvas. In the case where the first node collides with one of the second nodes, it is determined that the first node collides with the second node.

[0090] For example, Figure 2 As shown, in the visualization system, a canvas, a data table, a data model, etc. can be displayed. When the user needs to add a data set in a data table, the data table with the corresponding name can be dragged to the canvas.

[0091] In one embodiment, if Figure 3 As shown, the determination in step S100 of whether the first node formed by the data table on the canvas collides with the second node on the canvas is determined in the following manner:

[0092] S110: Determine position information of the first node on the canvas.

[0093] S120: Determine whether the location information is located in a collision area of ​​the second node.

[0094] S130: When the location information is within the collision area, determine that the first node collides with the second node.

[0095] S140: When the location information is outside the collision area, determine that the first node does not collide with the second node.

[0096] In this embodiment, the position information of the first node on the canvas is determined to determine the position of the first node on the canvas. It is determined whether the position information is located in the collision area of ​​the second node to determine whether the first node collides with the second node. In the case where the position information is located in the collision area, the first node and the second node partially overlap, and it is determined that the first node collides with the second node. In the case where the position information is located outside the collision area, the first node is spaced from the second node, and it is determined that the first node does not collide with the second node. By determining whether the first node and the second node collide based on the position information, it is possible to determine whether the user needs to merge the first node and the second node, thereby reducing the complexity of the operation of the visualization system.

[0097] In one embodiment, if Figure 4 As shown, before determining in step S100 whether a first node formed by the data table on the canvas collides with a second node in the canvas, the data visualization method further includes:

[0098] S400: Determine a first length of a second node in a first direction and a second length in a second direction.

[0099] S410: Determine a sum and a difference between a first coordinate of a second node in the first direction and a first length as a first boundary and a second boundary in the first direction, respectively.

[0100] S420, determining a sum and a difference between the second coordinate of the second node and the second length in the second direction as a third boundary and a fourth boundary in the second direction, respectively.

[0101] S430: Determine an area formed by the first boundary, the second boundary, the third boundary, and the fourth boundary as a collision area.

[0102] The first direction is perpendicular to the second direction.

[0103] In this embodiment, the first length of the second node in the first direction and the second length in the second direction are determined to determine the area occupied by the second node in the canvas. When the first node and the second node are in critical contact, the area formed by the coordinates of the first node in the first direction and the second direction is used as the collision area. Since the shapes and sizes of the first node and the second node are the same, the sum and difference of the first coordinate of the second node and the first length in the first direction are determined as the first boundary and the second boundary in the first direction, respectively, and the sum and difference of the second coordinate of the second node and the second length in the second direction are determined as the third boundary and the fourth boundary in the second direction, respectively. Since the first node and the second node are in critical contact, the coordinates of the first node in the first direction and the second direction are located at each boundary, and the area formed by the first boundary, the second boundary, the third boundary and the fourth boundary is determined as the collision area. By determining the collision area according to the size and coordinates of the second node, it is possible to accurately determine whether the first node and the second node collide after dragging the first node, thereby improving the reliability of the operation of the visualization system.

[0104] For example, Figure 5-1 and Figure 5-2 As shown, the first direction is the x-axis direction, the second direction is the y-axis direction, the first coordinate is x1, the second coordinate is y1, the third coordinate in the position information of the first node in the first direction is x2, the fourth coordinate in the position information of the first node in the second direction is y2, the first length is l1, and the second length is l2. The collision area of ​​the second node is: the area formed by the x-axis coordinates (x1-l1) to (x1+l1) and the y-axis coordinates (y1-l2) to (y1+l2). When both x2 and y2 are within the collision area, it is determined that the first node collides with the second node. When x2 and / or y2 are outside the collision area, it is determined that the first node does not collide with the second node.

[0105] In one embodiment, in step S300, generating a target node on the canvas according to the node type of the second node may be determined in the following manner:

[0106] When the node type of the second node is a model node, prompt information is displayed, and the prompt information is used to prompt the user whether to merge the first node with the second node.

[0107] In response to the user's confirmation operation on the prompt information, the first node and the second node are merged on the canvas as a target node, and the target node is generated.

[0108] In response to the user's cancel operation on the prompt information, the node type of the first node is set as a model node on the canvas, and the set first node is generated as a target node.

[0109] In this embodiment, since the model node contains a data set and can be merged with the data set in the data table, when the node type of the second node is a model node, a prompt message is displayed to prompt the user whether to merge the first node and the second node. In response to the user's confirmation operation on the prompt message, the user hopes to merge the data set in the first node with the data set in the second node, and the first node and the second node are merged as a target node and generated on the canvas. In response to the user's cancellation operation on the prompt message, the user does not want to merge the data set in the first node with the data set in the second node, and the first node is generated as a target node after the node type of the first node is set to a model node on the canvas. By generating a merged target node when the user wants to merge the nodes, the two data sets can be quickly merged, thereby reducing the complexity of the visualization system operation.

[0110] In one embodiment, the generation of the target node on the canvas according to the node type of the second node in step S300 may also be determined in the following manner:

[0111] In a case where the node type of the second node is a node type other than a model node, the first node is generated as a target node on the canvas.

[0112] In this embodiment, since nodes of node types other than model nodes do not contain data sets or do not support the merging of data sets, when the node type of the second node is a node type other than model nodes, only the first node as the target node is generated on the canvas without displaying prompt information. By directly generating the first node when the nodes cannot be merged, the user is prevented from performing additional operations, thereby reducing the complexity of the visualization system operation.

[0113] Exemplarily, after determining in step S100 whether a first node formed by the data table on the canvas collides with a second node on the canvas, the data visualization method further includes:

[0114] When the first node does not collide with the second node, the first node is generated on the canvas.

[0115] In one embodiment, after the target node is generated on the canvas according to the node type of the second node in step S300, the data visualization method further includes:

[0116] In response to the user's export operation, the target node is exported as a first data model, and the first data model is used to construct a visual diagram.

[0117] In response to a publishing operation of the user, the first data model is published.

[0118] In this embodiment, after the user creates a data set by dragging and dropping, the target node can be exported as the first data model through the export operation. When the first data model is called, the visualization chart can be quickly constructed. After the user exports the target node, the first data model can be published through the publish operation, so that other users can quickly use the first data model to build a visualization chart without having to create the data set contained in the first data model again. Since the first data model can be exported and published, it is convenient to call the data set in the first data model, thereby reducing the complexity of the visualization system operation.

[0119] In one embodiment, if Figure 6 As shown, the data visualization method also includes:

[0120] S500: In response to a first generation operation of a user on a third node on a canvas, a connection node associated with the third node is formed, and the node type of the third node is a model node.

[0121] S510: In response to a first configuration operation of a user on a connection node, configure the connection node.

[0122] S520: When the connection node configuration is completed, generate the connection node on the canvas.

[0123] In this embodiment, when the user needs to connect two data sets, a first generation operation is performed on the canvas on the third node containing one of the data sets to form a connection node associated with the third node. In response to the user's first configuration operation on the connection node, the connection node is configured to connect the two data sets. When the connection node configuration is completed, a connection node is generated on the canvas to form a connection relationship between the two data sets. By operating the third node to generate the connection node, the two data sets can be quickly connected, thereby reducing the complexity of the visualization system operation.

[0124] Exemplarily, the connection node may be a join node.

[0125] In one embodiment, the first configuration operation includes a first configuration sub-operation and a second configuration sub-operation. In response to the user's first configuration operation on the connection node in step S510, the configuration connection node is determined in the following manner:

[0126] In response to a first configuration sub-operation of a connection node by a user, a first data set of a fourth node corresponding to the first configuration sub-operation is determined, and the type of the fourth node is a model node.

[0127] In response to a second configuration sub-operation of the user on the connection node, the first data set is connected to the second data set of the third node with a connection relationship corresponding to the second configuration sub-operation.

[0128] In this embodiment, in the process of configuring the connection node, it is necessary to select the fourth node corresponding to the first data set to be connected. In response to the user's first configuration sub-operation on the connection node, the first data set of the fourth node corresponding to the first configuration sub-operation is determined to select the first data set to be connected. Since there are multiple connection relationships between the first data set and the second data set, in response to the user's second configuration sub-operation on the connection node, the first data set is connected to the second data set of the third node with the connection relationship corresponding to the second configuration sub-operation. By connecting the first data set and the second data set with the expected connection relationship through the first configuration operation, there is no need to perform complex configuration operations on the third node and the fourth node, thereby reducing the complexity of the visualization system operation.

[0129] For example, after the first data set is connected to the second data set of the third node by the connection relationship corresponding to the second configuration sub-operation in the above step, the fourth node can be moved below the third node on the canvas to prompt the user that the first data set and the second data set have been connected. The connection relationship may include left connection, right connection, inner connection, full connection, etc.

[0130] Exemplarily, the first configuration operation further includes a third configuration sub-operation. After determining the first data set of the fourth node corresponding to the first configuration sub-operation, the data visualization method further includes:

[0131] In response to the user's third configuration sub-operation on the connection node, an output field is determined, and the output field is used to filter the data to be connected in the first data set and the second data set. For example, the output field of the first data set is A, and the output field of the second data set is B, and the data set contained in A in the first data set is connected with the data set contained in B in the second data set.

[0132] In one embodiment, after the connection nodes are generated on the canvas in step S520, the data visualization method further includes:

[0133] In response to the user's export operation, the connection nodes are exported as a second data model, and the second data model is used to construct a visual diagram.

[0134] In response to a publishing operation by the user, the second data model is published.

[0135] In this embodiment, after the user generates the connection node on the canvas, the user can export the connection node as the second data model through the export operation. When the second data model is called, the visualization chart can be quickly constructed. After the user exports the connection node, the second data model can be published through the publish operation, so that other users can quickly use the second data model to build a visualization chart without having to reconnect the data set contained in the second data model. Since the second data model can be exported and published, it is convenient to call the data set in the second data model, thereby reducing the complexity of the visualization system operation.

[0136] In one embodiment, if Figure 7 As shown, the data visualization method also includes:

[0137] S600: In response to the user's second generation operation on the fifth node on the canvas, a structured query language node associated with the fifth node is formed, and the node type of the fifth node is a model node.

[0138] S610: In response to a second configuration operation of the user on the structured query language node, configure the structured query language node.

[0139] S620 : In response to the user's third generation operation on the structured query language node, generate a structured query language node on the canvas.

[0140] In this embodiment, when the user needs to manage the data set, a second generation operation is performed on the fifth node containing the data set in the canvas to form a structured query language node associated with the fifth node. In response to the user's second configuration operation on the structured query language node, the structured query language node is configured to manage the data set. In response to the user's third generation operation on the structured query language node, the user's management method for the data set is designed, and a structured query language node is generated in the canvas. By operating the fifth node to generate a structured query language node, the data set can be managed quickly, thereby reducing the complexity of the visualization system operation.

[0141] Exemplarily, the structured query language node may be a SQL (Structured Query Language) node. The management of the data set may be querying, updating, creating and deleting the data in the data set.

[0142] Exemplarily, configuring the structured query language node in step S610 may be writing a variable in the structured query language node. After identifying the variable, the user may configure the variable. For example, the name, data type, data format, and default value of the variable may be configured.

[0143] In one embodiment, after configuring the structured query language node in step S610, the data visualization method further includes:

[0144] In response to a user's running operation on a structured query language node, a third data set corresponding to the structured query language node is generated.

[0145] In response to a third configuration operation of the user on the structured query language node, a third data set is configured.

[0146] In this embodiment, after configuring the structured query language node, the structured query language node may have an error, and the structured query language node needs to be run to determine whether the structured query language node is configured correctly. In response to the user's running operation on the structured query language node, a third data set corresponding to the structured query language node is generated, so that the user can determine whether the structured query language node is configured correctly and can configure the third data set according to the running result. In response to the user's third configuration operation on the structured query language node, the third data set is configured to adjust the data in the third data set. By running the configured structured query language node, errors in the configuration of the structured query language node are avoided, thereby improving the reliability of the visualization system operation.

[0147] Exemplarily, configuring the third data set in the above steps may include configuring the name, field type, display format, etc. of the third data set.

[0148] In one embodiment, after generating the structured query language node on the canvas in step S620, the data visualization method further includes:

[0149] In response to the user's export operation, the structured query language nodes are exported as a third data model, and the third data model is used to construct a visual diagram.

[0150] In response to a publishing operation by the user, the third data model is published.

[0151] In this embodiment, after the user generates a structured query language node on the canvas, the user can export the structured query language node through an export operation as a third data model. When the third data model is called, a visualization chart can be quickly constructed. After the user exports the structured query language node, the user can publish the third data model through a publish operation, so that other users can quickly use the third data model to build a visualization chart without having to configure the structured query language node again. Since the third data model can be exported and published, it is convenient to call the data set in the third data model, thereby reducing the complexity of the visualization system operation.

[0152] In one embodiment, if Figure 8As shown, in response to the user dragging the data table to the canvas in step S100, before determining whether a first node formed by the data table on the canvas collides with a second node in the canvas, the data visualization method further includes:

[0153] S700 . In response to a definition operation by a user, define nodes of different node types.

[0154] S710. In response to a registration operation by a user, register nodes of each node type.

[0155] S720: In response to a fourth configuration operation by the user, configure the canvas.

[0156] S730. In response to the user's binding operation, event binding is performed on nodes of each node type.

[0157] In this embodiment, in response to the user's definition operation, nodes of different node types are defined to implement different functions through nodes of different node types. In response to the user's registration operation, nodes of various node types are registered to use nodes of various node types in the canvas. In response to the user's fourth configuration operation, the canvas is configured so that the display of the canvas meets the user's expectations. In response to the user's binding operation, events are bound to nodes of various node types so that the corresponding content is displayed after the user operates the node. By setting different types of nodes and configuring the canvas, the user can quickly implement the corresponding functions with different types of nodes on the expected canvas, thereby reducing the complexity of the visualization system operation.

[0158] Exemplarily, the node types may include table nodes, model nodes, operator nodes, etc. Among them, the node type of the connection node and the structured query language node is an operator node.

[0159] Exemplarily, the registration of nodes of each node type in step S710 may be to store the first basic information of nodes of each node type in a preset data set (Map), and register the nodes of each node type by traversing the preset data set. The first basic information may include the name of the node type, the length of the node in the first direction and the second direction, the level of the node, the user interface (UI) component displayed by the node, etc.

[0160] Exemplarily, the configuration of the canvas in step S720 may include configuring the second basic information of the canvas. The second basic information may include the shape of the grid lines, the size of the grid lines, the color of the grid lines, the background color of the canvas, the length of the canvas in the first direction and the second direction, whether the canvas can be scaled with the mouse wheel, whether the canvas can be dragged with the keyboard, etc. The configuration of the canvas in step S720 may also include monitoring basic events of the canvas. Basic events may include double-clicking a blank space, single-clicking a blank space, clicking a node, a mouse event, edge dragging, node movement, node addition, etc.

[0161] Exemplarily, the event binding for nodes of each node type in step S730 may be to generate a corresponding menu when clicking the node, and trigger an event callback when the menu is clicked. The location of the menu generation may be determined according to the location of the node in the page where the canvas is located. For example, the menu may be displayed on the right side of the node in the first direction, and one end of the menu may be displayed flush with one end of the node in the second direction.

[0162] The present disclosure provides a data visualization method. Fig. 9 As shown, the method includes:

[0163] S800: Determine a first length of a second node in a first direction and a second length in a second direction.

[0164] S810: Determine a sum and a difference between a first coordinate of a second node in the first direction and a first length as a first boundary and a second boundary in the first direction, respectively.

[0165] S820: Determine the sum and difference of the second coordinate of the second node in the second direction and the second length as the third boundary and the fourth boundary in the second direction, respectively.

[0166] S830: Determine an area formed by the first boundary, the second boundary, the third boundary, and the fourth boundary as a collision area.

[0167] S840: In response to the user dragging the data table to the canvas, determine the position information of the first node on the canvas.

[0168] S850: Determine whether the location information is located in a collision area of ​​the second node.

[0169] S860: When the location information is within the collision area, determine that the first node collides with the second node.

[0170] S870: When a collision occurs between the first node and the second node, determine the node type of the second node.

[0171] S880: When the node type of the second node is a model node, display prompt information.

[0172] S890: In response to the user's confirmation operation on the prompt information, merge the first node and the second node as a target node on the canvas, and generate the target node.

[0173] S900 . In response to a user cancelling the prompt information, the node type of the first node is set as a model node on the canvas, and the set first node is generated as a target node.

[0174] S910: When the node type of the second node is a node type other than a model node, generate a first node as a target node on the canvas.

[0175] S920. In response to the user's export operation, export the target node as the first data model.

[0176] S930: In response to a publishing operation by the user, publish the first data model.

[0177] S940: When the location information is outside the collision area, determine that the first node does not collide with the second node.

[0178] S950: When the first node does not collide with the second node, generate a first node on the canvas.

[0179] In this embodiment, the first length of the second node in the first direction and the second length in the second direction are determined to determine the area occupied by the second node. The sum and difference of the first coordinate of the second node in the first direction and the first length are determined as the first boundary and the second boundary in the first direction, respectively, and the sum and difference of the second coordinate of the second node in the second direction and the second length are determined as the third boundary and the fourth boundary in the second direction, respectively, and the area formed by the first boundary, the second boundary, the third boundary and the fourth boundary is the collision area. In response to the user's operation of dragging the data table to the canvas, the position information of the first node on the canvas is determined, and it is determined whether the position information is located in the collision area of ​​the second node. In the case where the position information is located in the collision area, the first node and the second node partially overlap, and it is determined that the first node and the second node collide. In the case where the first node collides with the second node, the user may want to merge the first node with the second node and determine the node type of the second node. In the case where the node type of the second node is a model node, a prompt message is displayed to prompt the user to avoid the mistaken merging of nodes. In response to the user's determination operation on the prompt message, the user wants to merge the first node and the second node, and the first node and the second node are merged as the target node on the canvas and generated. In response to the user's cancel operation on the prompt information, the user does not want to merge the first node and the second node, and the node type of the first node is set to a model node in the canvas and generated. In the case where the node type of the second node is a node type other than a model node, the first node and the second node cannot be merged, and the first node as the target node is generated in the canvas. After the target node is generated, in response to the user's export operation, the target node is exported as a first data model to build a visual chart. In response to the user's publishing operation, the first data model is published to build a visual chart through the first data model. In the case where the position information is outside the collision area, the user does not want to merge the first node with the second node, and it is determined that the first node does not collide with the second node. In the case where the first node does not collide with the second node, the first node is generated in the canvas without merging the nodes. By determining whether the first node and the second node collide to determine whether to merge the two nodes, the user can quickly merge the data set in the data table with the data set in the second node, thereby reducing the complexity of the visualization system operation. At the same time, since the user can drag the data table to the canvas to create a data set by dragging, the data set creation method is simple, thereby further reducing the complexity of the visualization system operation.

[0180] In an exemplary embodiment, a data visualization device is provided, and the data visualization device is used to implement the above method. Fig.10As shown, the data visualization device may include a first determination module 100, a second determination module 200 and a generation module 300, wherein, in the process of implementing the above method,

[0181] The first determination module 100 is configured to determine whether a first node formed by the data table on the canvas collides with a second node in the canvas in response to a user's operation of dragging the data table to the canvas.

[0182] The second determination module 200 is configured to determine the node type of the second node when a collision occurs between the first node and the second node.

[0183] The generating module 300 is configured to generate a target node on the canvas according to the node type of the second node.

[0184] In an exemplary embodiment, a data visualization device is provided, in which a first determination module 100 is configured to:

[0185] Determine the position information of the first node on the canvas.

[0186] It is determined whether the position information is located in a collision region of the second node.

[0187] When the position information is located within the collision area, it is determined that the first node collides with the second node.

[0188] When the position information is outside the collision area, it is determined that the first node does not collide with the second node.

[0189] In an exemplary embodiment, a data visualization device is provided, in which a first determination module 100 is configured to:

[0190] A first length of the second node in the first direction and a second length in the second direction are determined.

[0191] A sum and a difference between the first coordinate of the second node in the first direction and the first length are determined as a first boundary and a second boundary in the first direction, respectively.

[0192] The sum and difference of the second coordinate of the second node and the second length in the second direction are determined as the third boundary and the fourth boundary in the second direction, respectively.

[0193] An area formed by the first boundary, the second boundary, the third boundary and the fourth boundary is determined as a collision area.

[0194] In an exemplary embodiment, a data visualization device is provided, in which a generating module 300 is configured to:

[0195] When the node type of the second node is a model node, a prompt message is displayed.

[0196] In response to the user's confirmation operation on the prompt information, the first node and the second node are merged on the canvas as a target node, and the target node is generated.

[0197] In response to the user's cancel operation on the prompt information, the node type of the first node is set as a model node on the canvas, and the set first node is generated as a target node.

[0198] In an exemplary embodiment, a data visualization device is provided, in which a generating module 300 is configured to:

[0199] In a case where the node type of the second node is a node type other than a model node, the first node is generated as a target node on the canvas.

[0200] In an exemplary embodiment, a data visualization device is provided, the device further comprising:

[0201] The export module is configured to export the target node as a first data model in response to an export operation of the user.

[0202] The publishing module is configured to publish the first data model in response to a publishing operation of a user.

[0203] In an exemplary embodiment, a data visualization device is provided, in which a generating module 300 is configured to:

[0204] In response to a first generation operation of the user on the canvas on the third node, a connection node associated with the third node is formed.

[0205] In response to a first configuration operation of the user on the connection node, the connection node is configured.

[0206] When the connection node configuration is completed, the connection node is generated on the canvas.

[0207] In an exemplary embodiment, a data visualization device is provided, in which a generating module 300 is configured to:

[0208] In response to a first configuration sub-operation of the user on the connection node, a first data set of a fourth node corresponding to the first configuration sub-operation is determined.

[0209] In response to a second configuration sub-operation of the user on the connection node, the first data set is connected to the second data set of the third node with a connection relationship corresponding to the second configuration sub-operation.

[0210] In an exemplary embodiment, a data visualization device is provided, in which an export module is configured to:

[0211] In response to an export operation by the user, the connection nodes are exported as a second data model.

[0212] In an exemplary embodiment, a data visualization device is provided, in which a publishing module is configured to:

[0213] In response to a publishing operation by the user, the second data model is published.

[0214] In an exemplary embodiment, a data visualization device is provided, in which a generating module 300 is configured to:

[0215] In response to the user's second generation operation on the fifth node on the canvas, a structured query language node associated with the fifth node is formed.

[0216] In response to a second configuration operation of the user on the structured query language node, the structured query language node is configured.

[0217] In response to the user's third generation operation on the structured query language node, a structured query language node is generated on the canvas.

[0218] In an exemplary embodiment, a data visualization device is provided, in which a generating module 300 is configured to:

[0219] In response to a user's running operation on a structured query language node, a third data set corresponding to the structured query language node is generated.

[0220] In response to a third configuration operation of the user on the structured query language node, a third data set is configured.

[0221] In an exemplary embodiment, a data visualization device is provided, in which an export module is configured to:

[0222] In response to an export operation by the user, a structured query language node is exported as a third data model.

[0223] In an exemplary embodiment, a data visualization device is provided, in which a publishing module is configured to:

[0224] In response to a publishing operation by the user, the third data model is published.

[0225] In an exemplary embodiment, a data visualization device is provided, the device further comprising:

[0226] The definition module is configured to define nodes of different node types in response to a definition operation of a user.

[0227] The registration module is configured to register nodes of various node types in response to a registration operation of a user.

[0228] The configuration module is configured to configure the canvas in response to a fourth configuration operation of the user.

[0229] The binding module is configured to perform event binding on nodes of each node type in response to a binding operation by a user.

[0230] In an exemplary embodiment, an electronic device is provided, and the electronic device is, for example, a mobile phone, a laptop computer, a tablet computer, a wearable device, etc.

[0231] refer to Fig.11 As shown, electronic device 400 may include one or more of the following components: processing component 402 , memory 404 , power component 406 , multimedia component 408 , audio component 410 , input / output (I / O) interface 412 , sensor component 414 , and communication component 416 .

[0232] The processing component 402 generally controls the overall operation of the electronic device 400, such as operations associated with display, phone calls, data communications, camera operations, and recording operations. The processing component 402 may include one or more processors 420 to execute instructions to complete all or part of the steps of the above-mentioned method. In addition, the processing component 402 may include one or more modules to facilitate the interaction between the processing component 402 and other components. For example, the processing component 402 may include a multimedia module to facilitate the interaction between the multimedia component 408 and the processing component 402.

[0233] The memory 404 is configured to store various types of data to support operations on the electronic device 400. Examples of such data include instructions for any application or method operating on the electronic device 400, contact data, phone book data, messages, pictures, videos, etc. The memory 404 can be implemented by any type of volatile or non-volatile storage terminal or a combination thereof, such as static random access memory (SRAM), electrically erasable programmable read-only memory (EEPROM), erasable programmable read-only memory (EPROM), programmable read-only memory (PROM), read-only memory (ROM), magnetic memory, flash memory, magnetic disk or optical disk.

[0234] The power supply component 406 provides power to the various components of the electronic device 400. The power supply component 406 may include a power management system, one or more power supplies, and other components associated with generating, managing, and distributing power to the electronic device 400.

[0235] The multimedia component 408 includes a screen that provides an output interface between the electronic device 400 and the user. In some embodiments, the screen may include a liquid crystal display (LCD) and a touch panel (TP). If the screen includes a touch panel, the screen may be implemented as a touch screen to receive input signals from the user. The touch panel includes one or more touch sensors to sense touch, slide, and gestures on the touch panel. The touch sensor may not only sense the boundaries of the touch or slide action, but also detect the duration and pressure associated with the touch or slide operation. In some embodiments, the multimedia component 408 includes a front camera module and / or a rear camera module. When the electronic device 400 is in an operating mode, such as a shooting mode or a video mode, the front camera module and / or the rear camera module may receive external multimedia data. Each front camera module and the rear camera module may be a fixed optical lens system or have a focal length and optical zoom capability.

[0236] The audio component 410 is configured to output and / or input audio signals. For example, the audio component 410 includes a microphone (MIC), and when the electronic device 400 is in an operating mode, such as a call mode, a recording mode, and a voice recognition mode, the microphone is configured to receive an external audio signal. The received audio signal can be further stored in the memory 404 or sent via the communication component 416. In some embodiments, the audio component 410 also includes a speaker for outputting audio signals.

[0237] I / O interface 412 provides an interface between processing component 402 and peripheral interface modules, such as keyboards, click wheels, buttons, etc. These buttons may include but are not limited to: a home button, a volume button, a start button, and a lock button.

[0238] The sensor assembly 414 includes one or more sensors for providing various aspects of status assessment for the electronic device 400. For example, the sensor assembly 414 can detect the open / closed state of the electronic device 400, the relative positioning of components, such as the display and keypad of the electronic device 400, and the sensor assembly 414 can also detect the position change of the electronic device 400 or a component of the electronic device 400, the presence or absence of user contact with the electronic device 400, the orientation or acceleration / deceleration of the electronic device 400, and the temperature change of the electronic device 400. The sensor assembly 414 may include a proximity sensor configured to detect the presence of nearby objects without any physical contact. The sensor assembly 414 may also include an optical sensor, such as a CMOS or CCD image sensor, for use in imaging applications. In some embodiments, the sensor assembly 414 may also include an accelerometer, a gyroscope sensor, a magnetic sensor, a pressure sensor, or a temperature sensor.

[0239] The communication component 416 is configured to facilitate wired or wireless communication between the electronic device 400 and other terminals. The electronic device 400 can access a wireless network based on a communication standard, such as WiFi, 2G, 3G, 4G, 5G, or a combination thereof. In an exemplary embodiment, the communication component 416 receives a broadcast signal or broadcast-related information from an external broadcast management system via a broadcast channel. In an exemplary embodiment, the communication component 416 also includes a near field communication (NFC) module to facilitate short-range communication. For example, the NFC module can be implemented based on radio frequency identification (RFID) technology, infrared data association (IrDA) technology, ultra-wideband (UWB) technology, Bluetooth (BT) technology and other technologies.

[0240] In an exemplary embodiment, the electronic device 400 may be implemented by one or more application-specific integrated circuits (ASICs), digital signal processors (DSPs), digital signal processing terminals (DSPDs), programmable logic devices (PLDs), field programmable gate arrays (FPGAs), controllers, microcontrollers, microprocessors or other electronic components to execute the methods shown in the above embodiments or a combination thereof.

[0241] In an exemplary embodiment, a non-transitory computer-readable storage medium including instructions is also provided, such as a memory 404 including instructions, and the above instructions can be executed by a processor 420 of an electronic device 400 to complete the method shown in the above embodiment or a combination thereof. For example, the non-transitory computer-readable storage medium can be a ROM, a random access memory (RAM), a CD-ROM, a tape, a floppy disk, and an optical data storage terminal. When the instructions in the storage medium are executed by the processor of the terminal, the terminal is enabled to execute the method shown in the above embodiment or a combination thereof.

[0242] Those skilled in the art will readily appreciate other embodiments of the present disclosure after considering the specification and practicing the invention disclosed herein. The present disclosure is intended to cover any variations, uses or adaptations of the present disclosure that follow the general principles of the present disclosure and include common knowledge or customary techniques in the art that are not disclosed in the present disclosure. The description and examples are to be considered exemplary only, and the true scope and spirit of the present disclosure are indicated by the claims.

[0243] In the description of this specification, the description with reference to the terms "one embodiment", "some embodiments", "example", "specific example", or "some examples" etc. means that the specific features, structures, materials or characteristics described in conjunction with the embodiment or example are included in at least one embodiment or example of the present disclosure. In this specification, the schematic representations of the above terms do not necessarily refer to the same embodiment or example. Moreover, the specific features, structures, materials or characteristics described may be combined in any one or more embodiments or examples in a suitable manner. In addition, those skilled in the art may combine and combine the different embodiments or examples described in this specification and the features of the different embodiments or examples, without contradiction.

[0244] In addition, the terms "first" and "second" are used for descriptive purposes only and should not be understood as indicating or implying relative importance or implicitly indicating the number of the indicated technical features. Thus, a feature defined as "first" or "second" may explicitly or implicitly include at least one of the features. In the description of the present disclosure, "plurality" means at least two, such as two, three, etc., unless otherwise clearly and specifically defined.

[0245] It should be understood that the various forms of processes shown above can be used to reorder, add or delete steps. For example, the steps recorded in this disclosure can be executed in parallel, sequentially or in different orders, as long as the desired results of the technical solutions disclosed in this disclosure can be achieved, and this document does not limit this.

[0246] The above specific implementations do not constitute a limitation on the protection scope of the present disclosure. It should be understood by those skilled in the art that various modifications, combinations, sub-combinations and substitutions can be made according to design requirements and other factors. Any modification, equivalent substitution and improvement made within the spirit and principle of the present disclosure shall be included in the protection scope of the present disclosure.

Claims

1. A data visualization method, characterized in that: The data visualization method comprises: In response to a user dragging a data table to a canvas, determining whether a first node formed by the data table on the canvas collides with a second node in the canvas; In the case where the first node collides with the second node, determining a node type of the second node; A target node is generated on the canvas according to the node type of the second node.

2. The data visualization method according to claim 1, characterized in that: The determining whether a first node formed by the data table on the canvas collides with a second node in the canvas comprises: Determine the position information of the first node on the canvas; Determining whether the location information is located in a collision area of ​​the second node; When the location information is within the collision area, determining that the first node collides with the second node; When the position information is outside the collision area, it is determined that the first node does not collide with the second node.

3. The data visualization method according to claim 2, characterized in that: Before determining whether a first node formed by the data table on the canvas collides with a second node in the canvas, the data visualization method further includes: determining a first length of the second node in the first direction and a second length in the second direction; Determine a sum and a difference between the first coordinate of the second node and the first length in the first direction as a first boundary and a second boundary in the first direction, respectively; Determine a sum and a difference between the second coordinate of the second node and the second length in the second direction as a third boundary and a fourth boundary in the second direction respectively; determining an area formed by the first boundary, the second boundary, the third boundary and the fourth boundary as the collision area; The first direction is perpendicular to the second direction.

4. The data visualization method according to claim 1, characterized in that: Generating a target node on the canvas according to the node type of the second node includes: In the case where the node type of the second node is a model node, displaying prompt information, wherein the prompt information is used to prompt the user whether to merge the first node with the second node; In response to a user's confirmation operation on the prompt information, merging the first node and the second node as the target node on the canvas, and generating the target node; In response to a user cancelling an operation on the prompt information, the node type of the first node is set as the model node on the canvas, and the set first node is generated as the target node.

5. The data visualization method according to claim 1, characterized in that: Generating a target node on the canvas according to the node type of the second node includes: In a case where the node type of the second node is a node type other than a model node, the first node is generated as the target node on the canvas.

6. The data visualization method according to claim 1, characterized in that: After the canvas generates a target node according to the node type of the second node, the data visualization method further includes: In response to an export operation by a user, exporting the target node as a first data model, wherein the first data model is used to construct a visual chart; In response to a publishing operation by the user, the first data model is published.

7. The data visualization method according to any one of claims 1 to 6, characterized in that: The data visualization method further comprises: In response to a first generation operation of a third node by a user on the canvas, forming a connection node associated with the third node, wherein the node type of the third node is a model node; In response to a first configuration operation of the user on the connection node, configuring the connection node; When the connection node configuration is completed, the connection node is generated on the canvas.

8. The data visualization method according to claim 7, characterized in that: The first configuration operation includes a first configuration sub-operation and a second configuration sub-operation; and in response to the user's first configuration operation on the connection node, configuring the connection node includes: In response to a first configuration sub-operation of the user on the connection node, determining a first data set of a fourth node corresponding to the first configuration sub-operation, the type of the fourth node being the model node; In response to a second configuration sub-operation of the user on the connection node, the first data set is connected to the second data set of the third node with a connection relationship corresponding to the second configuration sub-operation.

9. The data visualization method according to claim 7, characterized in that: After generating the connection nodes on the canvas, the data visualization method further includes: In response to an export operation by a user, exporting the connection nodes as a second data model, wherein the second data model is used to construct a visual chart; In response to a publishing operation by the user, the second data model is published.

10. The data visualization method according to any one of claims 1 to 6, characterized in that: The data visualization method further comprises: In response to a second generation operation of the user on the fifth node on the canvas, a structured query language node associated with the fifth node is formed, and the node type of the fifth node is a model node; In response to a second configuration operation of the user on the structured query language node, configuring the structured query language node; In response to a third generation operation of the user on the structured query language node, the structured query language node is generated on the canvas.

11. The data visualization method according to claim 10, characterized in that: After configuring the structured query language node, the data visualization method further includes: In response to a user's operation on the structured query language node, generating a third data set corresponding to the structured query language node; In response to a third configuration operation of the user on the structured query language node, the third data set is configured.

12. The data visualization method according to claim 10, characterized in that: After generating the structured query language node on the canvas, the data visualization method further includes: In response to an export operation by a user, exporting the structured query language node as a third data model, wherein the third data model is used to construct a visual chart; In response to a publishing operation of the user, the third data model is published.

13. The data visualization method according to any one of claims 1 to 6, characterized in that: Before determining whether a first node formed by the data table on the canvas collides with a second node in the canvas in response to the user dragging the data table to the canvas, the data visualization method further includes: In response to a definition operation by a user, defining nodes of different node types; In response to a registration operation by a user, registering nodes of each of the node types; In response to a fourth configuration operation of the user, configuring the canvas; In response to the user's binding operation, event binding is performed on the nodes of each node type.

14. A data visualization device, characterized in that: The data visualization device comprises: A first determination module, wherein the first determination module is configured to determine whether a first node formed by the data table on the canvas collides with a second node in the canvas in response to a user dragging the data table to the canvas; a second determination module, the second determination module being configured to determine a node type of the second node when the first node collides with the second node; A generating module is configured to generate a target node on the canvas according to a node type of the second node.

15. An electronic device, characterized in that: The electronic device comprises: processor; a memory for storing instructions executable by the processor; The processor is configured to execute the data visualization method according to any one of claims 1 to 13.

16. A non-transitory computer-readable storage medium, characterized in that: When the instructions in the storage medium are executed by a processor of a terminal, the terminal is enabled to execute the data visualization method according to any one of claims 1 to 13.

Images