Visual project display method, visual project production method, visual project display device, visual project production equipment and medium

Abstract

The invention discloses a display and production method and device of a visual project, equipment and a medium, belongs to the technical field of computers, and can be applied to various scenes such as cloud technology, artificial intelligence, intelligent traffic, auxiliary driving and digital twinning. The method comprises the following steps: operating a visual project editing tool; in the process of displaying the project through the visual project editing tool, the current component obtains a target field name and field content corresponding to the target field name; and the current component replaces a target field name with the corresponding field content at the target reference position according to the target field name added at the target reference position according to an agreed rule, or directly reads the corresponding field content at the target reference position. According to the method, a new field name input mode and field content acquisition logic are provided, the corresponding field content can be obtained through reference according to the target field name added according to the agreed rule, the target field name does not need to be mounted, and rapid value transmission is achieved.

Description

Technical Field

[0001] The present application relates to the field of computer technology, and in particular to a method, device, equipment and medium for displaying and making a visualization project. Background Art

[0002] The Visual Project Editing Tool is designed to create, edit, display and share visual projects (hereinafter referred to as projects). A project is a visual panel used for content expression and data display in the Visual Project Editing Tool. A project can have multiple pages, each page contains different content, and each page can contain a variety of 2D components and 3D components. Components are the smallest unit elements in a project and cannot be further split. 2D components include chart components, shape components, text components, decoration components, button components, multimedia components, etc. 3D components include scene components, model components, marker components, flying line components, etc.

[0003] In the related art, variables in the visual project editing tool include custom variables and equalizer variables. Both custom variables and equalizer variables need to be mounted in the component before the component can use the variable content. In the related art, the operation of the component obtaining the variable content is cumbersome. Summary of the invention

[0004] The present application provides a method, device, equipment and medium for displaying and making a visualization project, and provides a new field name input method and field content acquisition logic. According to the target field name added according to the agreed rules, the corresponding field content can be directly referenced, and the target field name does not need to be mounted, thereby realizing fast value transmission. The technical solution includes the following contents.

[0005] According to one aspect of the present application, a method for displaying a visualization project is provided, the method comprising:

[0006] Run the visual project editing tool;

[0007] In the process of displaying the project through the visual project editing tool, the current component obtains the target field name and the field content corresponding to the target field name;

[0008] The current component replaces the target field name with the corresponding field content at the target reference position according to the target field name added at the target reference position according to the agreed rules, or directly reads the corresponding field content at the target reference position.

[0009] According to one aspect of the present application, a method for producing a visualization project is provided, the method comprising:

[0010] Run the visual project editing tool;

[0011] In the process of creating a project through the visual project editing tool, the target field name is added to the target reference position of the current component according to the agreed rules. The target field name is used to be replaced with the corresponding field content when displaying the project, or the target field name is used to directly read the corresponding field content when displaying the project.

[0012] According to another aspect of the present application, a display device for a visualization project is provided, the device comprising:

[0013] Run module, used to run the visual project editing tool;

[0014] A processing module, used for obtaining a target field name and field content corresponding to the target field name by the current component during the process of displaying the project through the visual project editing tool;

[0015] The processing module is also used for the current component to replace the target field name with the corresponding field content at the target reference position according to the target field name added at the target reference position according to the agreed rules, or to directly read the corresponding field content at the target reference position.

[0016] According to another aspect of the present application, a device for producing a visualization project is provided, the device comprising:

[0017] Run module, used to run the visual project editing tool;

[0018] An adding module is used to add a target field name in the target reference position of the current component according to the agreed rules during the process of making a project through the visual project editing tool. The target field name is used to be replaced with the corresponding field content when displaying the project, or the target field name is used to directly read the corresponding field content when displaying the project.

[0019] According to one aspect of the present application, a computer device is provided, which includes: a processor and a memory, the memory stores a computer program, and the computer program is loaded and executed by the processor to implement the above-mentioned display and production method of the visualization project.

[0020] According to another aspect of the present application, a computer-readable storage medium is provided, wherein the storage medium stores a computer program, and the computer program is loaded and executed by a processor to implement the above-mentioned method for displaying and making a visualization project.

[0021] According to another aspect of the present application, a computer program product or computer program is provided, the computer program product or computer program includes computer instructions, the computer instructions are stored in a computer-readable storage medium. A processor of a computer device reads the computer instructions from the computer-readable storage medium, and the processor executes the computer instructions, so that the computer device performs the above method.

[0022] The beneficial effects brought by the technical solution provided by the embodiment of the present application include at least:

[0023] When making a project, you can add the target field name directly in the target reference position according to the agreed rules, and obtain the corresponding field content according to the target field name reference when displaying it, including: replacing the target field name with the corresponding field content when displaying the project, or directly reading the corresponding field content when displaying the project. The above provides a new field name input method and field content acquisition logic. The target field name does not need to be mounted and can be quickly transferred.

[0024] Furthermore, the above-mentioned operation of adding the target field name is simple, which reduces the user's requirement for computer knowledge, does not require the participation of technical developers, and eliminates the dependence on technical developers during the project production process. BRIEF DESCRIPTION OF THE DRAWINGS

[0025] In order to more clearly illustrate the technical solutions in the embodiments of the present application, the drawings required for use in the description of the embodiments will be briefly introduced below. Obviously, the drawings described below are only some embodiments of the present application. For ordinary technicians in this field, other drawings can be obtained based on these drawings without creative work.

[0026] Figure 1 It is a schematic diagram of the principle of the target field name input method and field content acquisition logic provided by an embodiment of the present application;

[0027] Figure 2 is a flow chart of a method for making a visualization project provided by an embodiment of the present application;

[0028] Figure 3 It is a schematic diagram of a process of adding a target field name to a relevant reference position of a data source provided by an embodiment of the present application;

[0029] Figure 4 is a schematic diagram of a process of adding a target field name to a related reference position of a data source provided by another exemplary embodiment of the present application;

[0030] Figure 5 It is a schematic diagram of various components that can obtain component data through component addresses provided by an embodiment of the present application;

[0031] Figure 6 is a schematic diagram of various components that can obtain component data through component addresses provided by another embodiment of the present application;

[0032] Figure 7 It is a schematic diagram of a process of adding a target field name to a component address provided by an embodiment of the present application;

[0033] Figure 8 is a schematic diagram of a process of adding a target field name to a relevant reference position of a data filter provided by an exemplary embodiment of the present application;

[0034] Fig. 9 It is a schematic diagram of a process of adding a target field name to a redirected external link address provided by an exemplary embodiment of the present application;

[0035] Fig.10 is a flow chart of a method for displaying a visualization project provided by an exemplary embodiment of the present application;

[0036] Fig.11 It is a schematic diagram of using local storage / application state management to store system-level constants provided by an exemplary embodiment of the present application;

[0037] Fig.12 is a schematic diagram of using a server to store system-level constants provided by an exemplary embodiment of the present application;

[0038] Fig.13 is a schematic diagram of adding system-level variables provided by an exemplary embodiment of the present application;

[0039] Fig.14 It is a structural block diagram of a display device for a visualization project provided by an embodiment of the present application;

[0040] Fig.15 It is a structural block diagram of a device for making a visualization project provided by an embodiment of the present application;

[0041] Fig.16 It is a structural block diagram of a computer device provided by an embodiment of the present application. DETAILED DESCRIPTION

[0042] In order to make the objectives, technical solutions and advantages of the present application clearer, the implementation methods of the present application will be further described in detail below with reference to the accompanying drawings.

[0043] First, the nouns involved in the embodiments of the present application are briefly introduced:

[0044] Visual Project Editing Tool: A tool for making, editing, displaying and sharing visual projects (hereinafter referred to as projects). A project is a visual panel used for content expression and data display in the visual project editing tool. A project can have multiple pages, each containing different content, and each page can contain a variety of 2D components and 3D components. A component is the smallest unit element in a project and cannot be further split. 2D components include chart components, shape components, text components, decoration components, button components, multimedia components, etc. 3D components include scene components, model components, marker components, flying line components, etc.

[0045] In the following text, the visual project editing tool is often referred to as a product.

[0046] In the related technology, after the components of the visual project editing tool are connected to the data source, two types of variables can be added. One is a custom variable, which is a variable added directly in the component, and the variable content comes from the component in the product. The other is a balancer variable, which needs to be added in the balancer, and the variable content comes from the target domain name in the iframe component. After the variable is added, it can be mounted by all components that are connected to online data. After mounting, the variable can be referenced in the URL address of the API (a type of data source), the SQL statement of the database (a type of data source) through "${variable name}", and in the data filter as "args.variable name", and the variable content change is triggered by the linkage event or iframe.

[0047] About custom variables: The addition, deletion and modification operations of custom variables in the project will be stored in the custom variable storage data. The components in the project can associate custom variable identifiers and mount variables on components. The components can then read the variable values ​​of the associated custom variables in the properties. At the same time, when the variable value changes, the component can also detect the property changes in real time and re-render the component. This allows linkage events between components.

[0048] About the balancer variables: The data balancer is mainly used to realize the data linkage function between the parent page and the child page (i.e., embedded web pages). Among them, the balancer variables are mainly divided into two types: receiving variables and distributing variables. The receiving variable refers to the specified variable sent by the parent page to the child page, and the distributing variable refers to the variable sent by the parent page to the child page. The target domain name is the domain name of the child page, which is mainly used by the parent page to determine the receiving source and the sending target. The parent page and the child page communicate across sources through the window.postMessage() method to transmit the variable values ​​detected by both parties in real time. The components of the parent page can mount these variables. When the variable of the child page changes, it can affect the rendering status of the component. The parent page can also add custom variables to the distribution variables. When the custom variables change, it affects the rendering effect of the child page, completing the linkage function.

[0049] According to the above introduction, we can find that in the related technology, whether it is a custom variable or a balancer variable, it must be mounted in the component first. The mounted variable can be referenced at the target reference location in the component. However, before using the variable in the component, it must be mounted first, so that the variable name and the corresponding variable content can be used, and the operation is slightly cumbersome.

[0050] Figure 1 A schematic diagram showing the principle of a target field name input method and field content acquisition logic provided by an exemplary embodiment of the present application is shown. Figure 1 A computer device 10 is shown, on which a visual project editing tool is running. Optionally, the visual project editing tool can be run in the form of a web page, a client, a mini-program, etc., and this application does not impose any restrictions on this.

[0051] Visual project editing tools are available for making projects. Figure 1 It is shown that in the process of making a project 110, the computer device 10 executes step 111: adding the target field name in the target reference position of the current component according to the agreed rules. The target field name can be a constant name or a variable name. Optionally, the target reference position 112 includes at least one of the relevant reference position of the data source of the current component, the component address, the relevant reference position of the data filter, and the jump external link address of the current component. Among them, the data source refers to the data source on which the current component relies for display, the component address refers to the acquisition address of the current component, the data filter is used to filter the data accessed through the data source, and the jump external link address refers to the link address of other pages for jump display.

[0052] Convention rule 113 is used to reference the field content corresponding to the target field name according to the target field name when it is identified. At this time, the target field name does not need to be mounted. Optionally, convention rule 113 is used to reference the target field name in a conventional form. Optionally, convention rule 113 is used to replace the target field name with the corresponding field content when it is identified. Optionally, convention rule 113 is used to directly read the corresponding field content according to the target field name when it is identified.

[0053] Optionally, the agreed rule 113 includes a rule for a single target field name and a rule for multiple target field names. Optionally, the agreed rule 113 includes rule 1 and rule 2.

[0054] Rule 1: When the target field name is added to the target reference position, the first character of the target field name is added, and the first character is the agreed character. Figure 1 ^{target field name} shown in , where “^” and “{}” are the first characters. Figure 1 The cargos. target field name shown in , where "cargs." is the first character.

[0055] Rule 2: When multiple target field names are added to the target reference position, the multiple target field names are connected by the second character, which is a predetermined character. Figure 1 In the ^{target field name 1}&^{target field name 2} shown in the figure, “&” is the second character.

[0056] In one embodiment, different conventions are used for different target reference positions. For example, when the target reference position is the relevant reference position of the data source of the current component, the component address, and the jump external link address, the first character in Rule 1 is "^" and "{}", and the target field name is referenced in the format of "^{target field name}". When the target reference position is the relevant reference position of the data filter of the current component, the first character in Rule 1 is "cargs.", and the target field name is referenced in the format of "cargs.target field name".

[0057] Visual project editing tools are available for presenting projects. Figure 1 It is shown that in the process of displaying the project 120, the computer device 10 executes step 121: the current component obtains the target field name and the field content corresponding to the target field name. The computer device 10 also executes step 122: the current component references the corresponding field content according to the target field name added according to the agreed rule at the target reference position.

[0058] In one embodiment, different methods of obtaining field contents are used for different agreed rules. For example, for a target field name referenced by the method of "^{target field name}", a replacement method is used to obtain the target field content. For a target field name referenced by the method of "cargs.target field name", a direct read method is used to obtain the target field content.

[0059] Illustratively, the current component 124 obtains "target field name: Company name; field content: Company A" 123, and the current component 124 replaces "^{Company name}" in the target reference position with "Company A", or the current component 124 directly reads "Company A" according to cargos.Companyname in the target reference position, thereby obtaining the target field content and passing the value.

[0060] It can be understood that the above provides a new field name input method and field content acquisition logic. When making a project, the target field name is added at the target reference position according to the agreed rules. When displaying, the corresponding field content will be obtained according to the target field name reference, providing a solution for fast value transmission without mounting. It is easy to operate, reduces the user's cognitive requirements for computer knowledge, does not require the participation of technical developers, and gets rid of the dependence on technical developers during the project production process.

[0061] In one embodiment, the target field name and the corresponding field content are stored through local storage and / or application state management, so that the target field name and the corresponding field content can be referenced by multiple projects to achieve data flow between different projects.

[0062] In one embodiment, the target field name is added to the global data management and stored in the server. The field content corresponding to the target field name is obtained by the server based on the target field name query. The global data in the global data management supports multiple project references, so that the target field name and the corresponding field content can be referenced by multiple projects, thereby realizing data flow between different projects.

[0063] In one embodiment, the field content corresponding to the target field name is the attribute data of the user account (such as name, company name, group name, etc.). The attribute data of the user account is used to display the corresponding component data content of the current component, so that the same component can achieve different display effects for different users, that is, to achieve the effect of thousands of faces for thousands of users.

[0064] The computer device 10 may be a terminal. The terminal may be a mobile phone, a computer, an intelligent voice interaction device, a smart home appliance, a vehicle terminal, an aircraft, etc., but is not limited thereto. The embodiments of the present application may be applied to various scenarios, including but not limited to cloud technology, artificial intelligence, smart transportation, assisted driving, digital twins, etc.

[0065] It should be noted that the information (including but not limited to user device information, user personal information, etc.), data (including but not limited to data used for analysis, stored data, displayed data, etc.) and signals involved in this application are all authorized by the user or fully authorized by all parties, and the collection, use and processing of relevant data must comply with the relevant laws, regulations and standards of the relevant countries and regions. For example, the target field name, the field content corresponding to the target field name, and the attribute information of the user account involved in this application are all obtained with full authorization.

[0066] Moreover, when it comes to relevant information, the relevant information processors will follow the principles of legality, legitimacy and necessity, clarify the purpose, method and scope of relevant information processing, obtain the consent of the relevant information subjects, and take necessary technical and organizational measures to ensure the security of relevant information.

[0067] Figure 2 A method for making a visualization project provided by an exemplary embodiment of the present application is shown. Figure 1 The computer device 10 shown is used to perform an example, and the method includes:

[0068] Step 220, running a visual project editing tool;

[0069] Visual project editing tool, used to create, edit, display and share visualization projects (hereinafter referred to as projects). Project is a visualization panel used for content expression and data display in the visualization project editing tool. A project can have multiple pages, each page contains different content, and each page can contain a variety of 2D components and 3D components. Components are the smallest unit elements in a project and cannot be further split. 2D components include chart components, shape components, text components, decoration components, button components, multimedia components, etc. 3D components include scene components, model components, marker components, flying line components, etc.

[0070] Step 240, in the process of making a project through a visual project editing tool, add a target field name in the target reference position of the current component according to the agreed rules. The target field name is used to be replaced with the corresponding field content when displaying the project, or the target field name is used to directly read the corresponding field content when displaying the project.

[0071] Convention rules are used to reference the field content corresponding to the target field name according to the target field name when it is identified. At this time, the target field name does not need to be mounted. Optionally, convention rules are used to reference the target field name in a conventional form.

[0072] Optionally, the agreed rules include rules for a single target field name and rules for multiple target field names. Illustratively, the agreed rules include at least one of the following: when a target field name is added to a target reference position, a first character is added to the target field name, and the first character is an agreed character; when multiple target field names are added to the target reference position, the multiple target field names are connected by a second character, and the second character is an agreed character.

[0073] In one embodiment, the target reference position includes at least one of a relevant reference position of a data source of the current component, a component address, a relevant reference position of a data filter, and a jump external link address.

[0074] In the process of making a project, you need to add various components. The data of the component can be obtained through the data source, which refers to the source of data that the current component relies on for display. In the visual project editing tool, the types of data sources include API, database, and offline files.

[0075] Optionally, in the visual project editing tool, data sources include data sources added directly in the management center, data sources filled in the data router, and data sources filled in the component. The data router is used to uniformly manage the data of the data source, such as uniformly pushing data to components to avoid each component receiving data once, and problems such as excessive page request data volume.

[0076] For some components, the data of the component can also be obtained by entering the component address. The component address refers to the acquisition address of the current component. In the visual project editing tool, these components include the picture, video, video stream and iframe components in the UI layer, and the picture tag, video tag and video stream tag in the scene layer. The UI layer is used to place 2D components, and the scene layer is used to place 3D components.

[0077] The iframe component is a component based on iframe encapsulation. The iframe component allows users to enter the embedded web page address on the page of the visual project editing tool to achieve the function of data interaction between the main page and the embedded page.

[0078] In the process of making a project, you can also configure linkage events for the current component. Linkage events usually consist of a trigger condition and an implementation action. After capturing the trigger condition, there will be a corresponding implementation action. Trigger conditions include mouse single click, double click, move in, move out operations, and implementation actions include jump external links, jump pages, variable assignment and other actions. The iframe component supports the configuration of linkage events for the component. If the linkage event is not configured, it will not be triggered. If it is configured, it will be triggered. Users can configure the jump external link address in the linkage event. The jump external link address refers to the link address of other pages to jump to.

[0079] After acquiring the data, the acquired data is also processed through a data filter, and the data filter is used to filter the data accessed through the data source.

[0080] In summary, when making a project, you can add the target field name directly in the target reference position according to the agreed rules, and obtain the corresponding field content according to the target field name reference when displaying, including: replacing the target field name with the corresponding field content when displaying the project, or directly reading the corresponding field content when displaying the project. The above provides a new field name input method and field content acquisition logic, which can quickly transfer values ​​without mounting.

[0081] Furthermore, the above-mentioned operation of adding the target field name is simple, which reduces the user's requirement for computer knowledge, does not require the participation of technical developers, and eliminates the dependence on technical developers during the project production process.

[0082] In an embodiment of the present application, the target reference position includes at least one of the relevant reference position of the data source of the current component, the component address, and the jump external link address. At this time, the agreed rule is used to replace the target field name with the corresponding field content when it is identified. Accordingly, the target field name is used to be replaced with the corresponding field content when displaying the project.

[0083] In an embodiment of the present application, the target reference position includes the relevant reference position of the data filter. At this time, the agreed rule is used to directly read the corresponding field content according to the target field name when it is identified. Accordingly, the target field name is used to directly read the corresponding field content when displaying the project.

[0084] Figure 3 A schematic diagram showing the process of adding the target field name to the relevant reference position of the data source.

[0085] Figure 3 Part (A) shows an interface diagram before a user logs into the visual project editing tool. Figure 3 Part (B) shows a schematic diagram of the interface of the data management section of the management center. Figure 3 Part (B) of FIG. 3 shows an add data source control 301. In response to the add data source control 301 receiving a trigger operation, the following is displayed: Figure 3 Part (C1) shows the interface. Figure 3 The data sources shown in part (C1) include WebAPI, MySQL, offline files, Oracle, SQL Server, PostgreSQL, and DAYU data services.

[0086] When the data source of the current component is an API, the target field name is added to the URL (Uniform Resource Locator) address of the API (Application Program Interface) of the current component according to the agreed rules; wherein the URL address is used to indicate the address of the API.

[0087] Optionally, in addition to adding the target field name in the URL address, the target field name may also be added in at least one of the request header and body parameters (Body parameters) of the current component's API according to agreed rules; wherein the request header is metadata (such as authentication information, public parameters, etc.) in the request sent by the terminal to the server, and the body parameters are the main content of the request sent by the terminal to the server.

[0088] Figure 3 The (C1) portion of FIG. 3 shows the API request header 302 and the relevant content 303 of the body parameters. Figure 3 The target field name is referenced in the URL address, request header, and body parameter of the WebAPI and DAYU data service shown in part (C1) by the format of "^{target field name}". When there are multiple target field names, they are connected by &. Optionally, there is also a conversion control at the target reference position that supports referencing the target field name according to the agreed rules. When the conversion control is clicked, the target field name will be displayed as the corresponding field content. Figure 3 The (C1) part also shows a test control. When the test control is clicked, a request is initiated to the server according to the content, and the server returns different data according to the request parameters.

[0089] Figure 4 A schematic diagram showing the process of adding the target field name to the relevant reference position of the data source.

[0090] Figure 4 Part (A) shows an interface diagram before a user logs into the visual project editing tool. Figure 4 Part (B) shows a schematic diagram of the interface of the data management section of the management center. Figure 4 Part (B) of FIG. 3 shows an add data source control 301. In response to the add data source control 301 receiving a trigger operation, the following is displayed: Figure 4 Part (C2) shows the interface. Figure 4 The data sources shown in part (C2) include WebAPI, MySQL, offline files, Oracle, SQL Server, PostgreSQL, and DAYU data services.

[0091] When the data source of the current component is a database, add the target field name in the database query statement of the current component according to the agreed rules.

[0092] Figure 4 Part (C2) shows the relevant content 304 of the database query statement. Illustratively, in the relevant content 304 of the database query statement, the target field name is referenced in the format of "^{target field name}", and when there are multiple target field names, & is used to connect them. Optionally, a conversion control is also present at the target reference position that supports referencing the target field name according to the agreed rules, and when the conversion control is clicked, the target field name will be displayed as the corresponding field content. Figure 4 The (C2) part also shows a test control. When the test control is clicked, a request is initiated to the server according to the content, and the server returns different data according to the request parameters.

[0093] Figure 5 It shows that each component can obtain component data through the component address. Figure 5 Part (A) shows a picture component 501, a video component 502, and a video stream component 503 in the UI layer. Figure 5 Part (B) shows an animation panel component 504, an Iframe component 505, and a timeline component 506 in the UI layer.

[0094] Figure 6 It also shows that each component can obtain component data through the component address. Figure 6 Part (A) of FIG. 5 shows a plurality of picture tags 601 in a scene layer. Figure 6 Part (B) shows a plurality of video tags 602 in a scene layer. Figure 6 Part (C) shows multiple video stream tags 603 in the scene layer.

[0095] Figure 7 The diagram shows the process of adding the target field name to the component address. In the visual project editing tool, the image, video, video stream and iframe components in the UI layer and the image tag, video tag, and video stream tag in the scene layer can directly enter the address without obtaining it through the data source.

[0096] Figure 7 Part (A) shows the project creation interface displayed when a user logs into the visual project editing tool and enters the management center. Figure 7 Part (A) shows a new project control 701 . Figure 7 Part (B) shows a schematic diagram of the interface for adding an image component in a project. The user can reference the target field name in the image address bar 702 in the format of "^{target field name}". When there are multiple target field names, & is used to connect them. Optionally, the interface also shows that there is a conversion control. When the conversion control is clicked, the target field name will be displayed as the specific content of the corresponding field. Figure 7 Part (C) shows a schematic diagram of the interface after clicking the conversion control, and the image address bar 702 displays the specific content of the converted field.

[0097] Figure 8 A schematic diagram showing the process of adding a target field name in a relevant reference position of a data filter. In the visual project editing tool, data filters can be added to some data source types, for example, data filters can be added to data source types such as API, offline files, and databases.

[0098] Figure 8 Part (A) shows the relevant setting interface for the data source type being MySQL data source. Figure 8Part (A) shows a data filter 801 that supports addition.

[0099] Figure 8 Part (B) shows the relevant setting interface of the data filter. The user can set filtering rules 802 for the data filter in this interface. The user can reference the target field name through the "cargs.target field name" format, and the data filter directly reads the field content corresponding to the target field name. Optionally, the target field name is a user name identifier and the corresponding field content is the specific content of the user name. When adding a data filter, the user can select a table that stores user avatars, add a user name identifier through the "cargs.target field name" format, and the data filter directly reads the user name content corresponding to the user name identifier. For example, through "cargs.userName", the data filter directly reads the name of the currently logged in user account, thereby displaying the avatar corresponding to the name of the user account.

[0100] Figure 8 The (C) part shows the avatar of the user account currently logged in to the system.

[0101] Fig. 9 The diagram shows how to add the target field name in the jump external link address. In the visual project editing tool, components can be added with linkage events. The linkage event usually consists of a trigger condition and an implementation action. After the trigger condition is captured, there will be a corresponding implementation action. Users can configure the jump external link address in the linkage event. The jump external link address refers to the link address of other pages that are displayed.

[0102] Fig. 9 Part (A) shows a schematic diagram of configuring linkage events for an image component. Fig. 9 Part (A) shows an input field 901 for the jump external link address of the linkage event. Schematically, the target field name is referenced in the input field 901 of the jump external link address in the format of "^{target field name}", and when there are multiple target field names, they are connected by & in the middle.

[0103] Fig. 9 Part (A) of FIG. 1 also shows a preview control 902. In response to the preview control 902 receiving a click operation, the preview control 902 is displayed as Fig. 9 The interface 903 shown in part (B) of FIG. Fig. 9 The image component in part (B) receives the trigger operation, obtains the target field content corresponding to the target field name, and fills it into the jump external link address by replacing the target field name. Fig. 9 Part (C) shows the web page interface 904 corresponding to the jump external link address.

[0104] In the related art, the custom variables and equalizer variables of the visual project editing tool are bound to the project and cannot be used across projects. The same variable needs to be added repeatedly when used in multiple projects, and must be mounted first when used in a component, which makes the operation a bit cumbersome.

[0105] In one embodiment, the target field name and the field content corresponding to the target field name are stored via local storage and / or application state data.

[0106] In another embodiment, the target field name is added to the global data management and stored in the server, and the field content corresponding to the target field name is obtained by querying the server according to the target field name.

[0107] Through local storage and / or application status data storage, the target field name and the corresponding field content support cross-project reference. The production staff only needs to add the target field name in the target reference position according to the agreed rules, and the corresponding field content can be carried from the product to multiple projects, realizing data flow between multiple projects. Similarly, global data management also plays a role in supporting cross-project references.

[0108] Furthermore, by storing local storage and / or application status data, the speed at which the visual project editing tool calls data is improved, thereby improving the website access speed of the visual project editing tool.

[0109] In the related art, the content of variables in the visual project editing tool is for all users, and when any user browses the project, the components will produce the same display results.

[0110] In one embodiment, the field content corresponding to the target field name is the attribute data of the user account. The attribute data of the user account is used for the current component to display the corresponding component data content.

[0111] Illustratively, the attribute data of the user account referenced at the target reference position is directly displayed on the visual interface (for example, the user avatar and user ID are directly displayed on the interface).

[0112] Schematically, the target reference location is the jump external link address. By carrying the user's attribute data in the address parameter, the jumped web page will determine the current visitor, thereby displaying different page effects.

[0113] Schematically, the target reference position is a related reference position of the data filter, and the requested component data will be filtered through the data filter. When user A views it, part of the requested component data is filtered out. When user B views it, another part of the requested component data is filtered out.

[0114] For example, when user A accesses the site, the requested monthly report is returned. When user B accesses the site, the requested annual report is returned.

[0115] The attribute data of a user account refers to the identity-related data of the user account, for example, the company the user works for, the nickname of the user within the company, the role of the user within the company, the name of the group the user belongs to, the ID of the user account, the user name, the name of the email account, etc.

[0116] Illustratively, the target field name is "companyName", and the corresponding field content is the name of the company where the currently logged-in user account is located. The target field name is "nickName", and the corresponding field content is the nickname of the currently logged-in user account within the company. The target field name is "roleName", and the corresponding field content is the role of the currently logged-in user account within the company. The target field name is "userGroupName", and the corresponding field content is the name of the user group where the currently logged-in user account is located. The target field name is "userID", and the corresponding field content is the ID of the currently logged-in user account. The target field name is "u serName", and the corresponding field content is the user name of the currently logged-in user account. The target field name is "email", and the corresponding field content is the account name of the mailbox bound to the currently logged-in user account.

[0117] Indicatively, after the user logs in, the work avatar of the currently logged in user account is displayed, and the target avatar is matched from multiple avatars according to the nickName of the user account for filling and display.

[0118] Indicatively, after a user logs in to view the business data of his / her department, the userGroupName of the user account is set to the department name, and the data of his / her department is displayed accordingly.

[0119] To summarize, the field content corresponding to the target field name is the attribute data of the user account (such as name, company name, group name, etc.). The component data content corresponding to the attribute data of the user account is displayed in the current component, so that the same component can achieve different display effects for different users, that is, achieving the effect of thousands of faces for thousands of users.

[0120] Fig.10 A flowchart of a method for displaying a visualization project provided by an exemplary embodiment of the present application is shown. Figure 1 The computer device 10 shown is used to perform an example, and the method includes:

[0121] Step 1020, running a visual project editing tool;

[0122] Visual project editing tool, used to create, edit, display and share visualization projects (hereinafter referred to as projects). Project is a visualization panel used for content expression and data display in the visualization project editing tool. A project can have multiple pages, each page contains different content, and each page can contain a variety of 2D components and 3D components. Components are the smallest unit elements in a project and cannot be further split. 2D components include chart components, shape components, text components, decoration components, button components, multimedia components, etc. 3D components include scene components, model components, marker components, flying line components, etc.

[0123] After the user opens the visual project editing tool, log in to the account. Optionally, the user can log in by scanning a code, entering an account and password, or using a third-party account.

[0124] Step 1040, in the process of displaying the project through the visual project editing tool, the current component obtains the target field name and the field content corresponding to the target field name;

[0125] Optionally, the relevant reference location of the data source of the current component, the component address, and the jump external link address are obtained according to the added target field name to obtain the corresponding field content.

[0126] Optionally, the target field name and the corresponding field content are passed as parameters to the data filter, and the data filter executes subsequent steps based on the obtained target field name and the corresponding field content.

[0127] In one embodiment, the target field name is a constant name, that is, the corresponding field content is a constant. The target field name and the corresponding field content are not allowed to be modified by the component.

[0128] In one embodiment, the target field name is a variable name, that is, the corresponding field content is a variable. In the case where the target field name is a variable name, the target field name is also associated with multiple components, including the current component. By adding local storage real-time detection (window.addEventListener), it is detected whether the field content has changed. When the field content corresponding to the target field name is changed by the current component, the display effects of multiple components associated with the target field name in the same browser are changed.

[0129] Indicatively, the field content corresponding to the target field name "companyName" is "Company A". When the current component changes "Company A" to "Company B", multiple components associated with the target field name are changed to display the corresponding display effect of "Company B".

[0130] Step 1060, the current component replaces the target field name with the corresponding field content at the target reference location according to the target field name added according to the agreed rules at the target reference location, or directly reads the corresponding field content at the target reference location.

[0131] Target reference location, see Figures 2 to 9 Related introduction of the illustrated embodiment.

[0132] In one embodiment, when the target reference position is a related reference position of a data source, a component address, and a jump external link address, the current component replaces the target field name with the corresponding field content.

[0133] Schematically, the target reference location is "https: / / xxx.com / ^{companyName}", the current component will recognize "^{companyName}" and replace "^{companyName}" with "Company A".

[0134] In one embodiment, when the target reference position is a related reference position of a data filter, the current component directly reads the corresponding field content according to the added target field name.

[0135] In summary, when making a project, you can add the target field name directly in the target reference position according to the agreed rules, and obtain the corresponding field content according to the target field name reference when displaying, including: replacing the target field name with the corresponding field content when displaying the project, or directly reading the corresponding field content when displaying the project. The above provides a new field name input method and field content acquisition logic, which can quickly transfer values ​​without mounting.

[0136] Furthermore, the above-mentioned operation of adding the target field name is simple, which reduces the user's requirement for computer knowledge, does not require the participation of technical developers, and eliminates the dependence on technical developers during the project production process.

[0137] based on Fig.10 In the optional embodiment shown, the following step is also included before step 1040: the target field name and the field content corresponding to the target field name are saved in the browser session through the local storage interface. The visual project editing tool is run through the browser, and the local storage of the browser includes Cookies, Web Storage (including Local Storage and Session Storage), IndexedDB, etc.

[0138] In one embodiment, the target field name and the corresponding field content are obtained by sending a request to a server. After logging into the user account, the computer device requests the server to obtain relevant information of the user account and saves it as the target field name and field content.

[0139] and / or, based on Fig.10 In the optional embodiment shown, the following step is also included before step 1040: the target field name and the field content corresponding to the target field name are stored in the application state management through the application state management interface. The application state management refers to the place where the state data is stored in the visual project editing tool (web page). The state data includes data cache, server response, UI state, etc. The application state management can be Redux, Mobox, etc. Different components can obtain the same data through the application state management.

[0140] In one embodiment, the target field name and the corresponding field content are obtained by sending a request to a server. After logging into the user account, the computer device requests the server to obtain relevant information of the user account and saves it as the target field name and field content.

[0141] It should be noted that the target field name and the corresponding field content are stored through local storage and / or application state management, making them system-level data, and system-level data supports cross-project references. In the related art, the custom variables and equalizer variables of the visual project editing tool are bound to the project and cannot be used across projects. The same variable needs to be added repeatedly when used in multiple projects, and must be mounted first when used in the component, which makes the operation slightly cumbersome. In an embodiment of the present application, the target field name and the field content corresponding to the target field name are stored through local storage and / or application state data, so that the target field name and the corresponding field content support cross-project references, and the corresponding field content can jump from the product to multiple projects, realizing data flow between multiple projects.

[0142] based on Fig.10 In the optional embodiment shown, the following steps are also included before step 1040:

[0143] 1. Get the target field name in the global data management. The target field name in the global data management supports the user to perform at least one of the following operations: add, delete, and modify;

[0144] The data in the global data management supports cross-project use. Users can choose to add data to the global data management. For example, the user selects to add "companyName" to the global data management, but the user does not select to add "userGroupName" to the global data management.

[0145] 2. The target field name is stored in a server, and the server is used to query and obtain the field content corresponding to the target field name according to the target field name;

[0146] 3. Receive the target field name and corresponding field content sent by the server.

[0147] In one embodiment, the server stores the target field name in a global constant data storage (located on the server), and the server retrieves the corresponding field content from the database and puts it into the project global attribute data, which also includes the project data. The server packages the target field name, the field content corresponding to the target field name, and the project data and sends them to the visual project editing tool.

[0148] based on Fig.10 In the optional embodiment shown, the field content corresponding to the target field name is the attribute data of the user account. Step 1060 also includes: obtaining component data content corresponding to the attribute data of the user account; and displaying the component data content on the current component.

[0149] Illustratively, the attribute data of the user account referenced at the target reference position is directly displayed on the visual interface (for example, the user avatar and user ID are directly displayed on the interface).

[0150] Schematically, the target reference location is the jump external link address. By carrying the user's attribute data in the address parameter, the jumped web page will determine the current visitor, thereby displaying different page effects.

[0151] Schematically, the target reference position is a related reference position of the data filter, and the requested component data will be filtered through the data filter. When user A views it, part of the requested component data is filtered out. When user B views it, another part of the requested component data is filtered out.

[0152] For example, when user A accesses the site, the requested monthly report is returned. When user B accesses the site, the requested annual report is returned.

[0153] In summary, in the related art, the content of variables in the visual project editing tool is for all users, and when any user browses the project, the component will produce the same display result. In the embodiment of the present application, the field content corresponding to the target field name is the attribute data of the user account, and the attribute data of the user account is used to display the corresponding component data content of the current component, so that the same component can achieve different display effects for different users, that is, to achieve the effect of thousands of faces for thousands of people.

[0154] Fig.11A schematic diagram of using local storage / application state management to store system-level constants provided by an embodiment of the present application is shown. Fig.11 The constant name in is the target field name mentioned above, and the constant value is the field content corresponding to the target field name.

[0155] Fig.11 It shows that after the user logs in to the visual project editing tool, the computer device will store the user name (constant name + constant value), user company (constant name + constant value) and user role (constant name + constant value) in the local storage / application status management 1101. Both local storage and application status management are system-level, and the stored data supports cross-project use.

[0156] In Project 1, the computer device mounts system-level constants such as user name, user company and user role in the data filter 1102, and the system-level constants are input as parameters into the data filter 1102, so that the system-level constants can be directly used in the method of the data filter 1102 for judgment and processing. Before the iframe link address 1103 and the database query statement 1104 are executed, the iframe link address 1103 and the database query statement 1104 are identified by the format of "^{constant name}", and the identified "^{constant name}" is replaced with the actual constant value before the call is executed.

[0157] Indicatively, before the iframe is loaded, its address is filtered, and if a fixed value is found, the constant name of the fixed value is taken out, the corresponding constant value is obtained from the storage, and then the constant value replaces the fixed value part of the iframe link address 1103, and then passes it to the iframe for loading.

[0158] Illustratively, before the SQL statement query, it is found that the database query statement 1104 has a fixed value, the constant name of the fixed value is taken out, the corresponding constant value is obtained in the storage, and then the constant value replaces the fixed value part in the database query statement 1104, and then the database query statement 1104 is transmitted to the server for query processing.

[0159] The same goes for Project 2, so I won’t go into details.

[0160] In one embodiment, the data filter is further configured with business screening logic, and the data filter screens out component data corresponding to the constant value through the business screening logic. The computer device displays the screened component data on the interface, thereby achieving a thousand faces for a thousand people.

[0161] Fig.12 A schematic diagram of using a server to store system-level constants provided by an embodiment of the present application is shown. Fig.12The constant name in is the target field name mentioned above, and the constant value is the field content corresponding to the target field name.

[0162] Fig.12 It is shown that after the user logs in to the visual project editing tool, the global data is added to the data source global property management, and the global data includes the user name (constant name + constant value), the user company (constant name + constant value) and the user role (constant name + constant value). The computer device stores the data in the data source global property management in the global constant data storage of the server. The server queries the global constants that need to be mounted globally from the database and puts them in the project global property data 1201, which also includes the project data. The server returns the project global property data 1201 to the front end.

[0163] In Project 1, the computer device mounts system-level constants such as user name, user company and user role in the data filter 1202, and the system-level constants are input into the data filter 1202 as parameters, so that the system-level constants can be directly used in the method of the data filter 1202 for judgment and processing.

[0164] Before the iframe link address 1203 and the database query statement 1204 are executed, the iframe link address 1203 and the database query statement 1204 are identified by the format of "^{constant name}", and the identified "^{constant name}" is replaced with the actual constant value before the call is executed.

[0165] Indicatively, before the iframe is loaded, its address is filtered, and if a fixed value is found, the constant name of the fixed value is taken out, the corresponding constant value is obtained in the storage, and then the constant value replaces the fixed value part of the iframe link address 1203, and then passes it to the iframe for loading.

[0166] Illustratively, before the SQL statement query, it is found that the database query statement 1204 has a fixed value, the constant name of the fixed value is taken out, the corresponding constant value is obtained in the storage, and then the constant value replaces the fixed value part in the database query statement 1204, and then the database query statement 1204 is transmitted to the server for query processing.

[0167] The same goes for Project 2, so I won’t go into details.

[0168] In one embodiment, the data filter is further configured with business screening logic, and the data filter screens out component data corresponding to the constant value through the business screening logic. The computer device displays the screened component data on the interface, thereby achieving a thousand faces for a thousand people.

[0169] Fig.13A schematic diagram of adding system-level variables provided by an exemplary embodiment of the present application is shown. Fig.13 The variable name in is the target field name mentioned above, and the variable value is the field content corresponding to the target field name.

[0170] Fig.13 It shows that after the user logs in to the visual project editing tool, the computer device will store the user name (variable name + variable value), user company (variable name + variable value) and user role (variable name + variable value) in the local storage / application status management 1301. The local storage and application status management are both system-level, and the stored data supports cross-project use.

[0171] In Project 1, the computer device mounts system-level variables such as user name, user company and user role in the data filter 1302, and the system-level variables are input into the data filter 1302 as parameters, so that the system-level variables can be directly used in the method of the data filter 1302 for judgment and processing.

[0172] Before the iframe link address 1303 and the database query statement 1304 are executed, the iframe link address 1303 and the database query statement 1304 are identified by the format of "^{variable name}", and the identified "^{variable name}" is replaced with the actual variable value before the call is executed.

[0173] Fig.13 It is also shown that in Project 1, the variable name is associated with the component, and the component can assign a value to the associated variable, so that the variable value in the local storage / application state management 1301 changes. The user adds a local storage real-time detection (window.addEventListener) to detect whether the variable has changed. When the associated variable changes, it can affect all components associated with this variable opened in the same browser.

[0174] The same goes for Project 2, so I won’t go into details.

[0175] Fig.14 A display device for a visualization project provided by an exemplary embodiment of the present application is shown, the device comprising:

[0176] Running module 1401, used for running the visual project editing tool;

[0177] Processing module 1402, used for obtaining, by the current component, a target field name and field content corresponding to the target field name during displaying of the project through the visual project editing tool;

[0178] The processing module 1402 is also used for the current component to replace the target field name with the corresponding field content at the target reference position according to the target field name added at the target reference position according to the agreed rules, or to directly read the corresponding field content at the target reference position.

[0179] In an optional embodiment, the processing module 1402 is further configured to save the target field name and the field content corresponding to the target field name in the browser session via a local storage interface.

[0180] In an optional embodiment, the processing module 1402 is further configured to store the target field name and the field content corresponding to the target field name in the application state management through the application state management interface.

[0181] In an optional embodiment, the processing module 1402 is further used to obtain the target field name in the global data management, and the target field name in the global data management supports the user to perform at least one of adding, deleting, and modifying operations;

[0182] The target field name is stored in a server, and the server is used to query and obtain the field content corresponding to the target field name according to the target field name;

[0183] Receive the target field name and the corresponding field content sent by the server.

[0184] In an optional embodiment, the processing module 1402 is also used to associate the target field name with multiple components when the target field name is a variable name, and the multiple components include the current component; when the field content corresponding to the target field name is changed by the current component, the display effect of multiple components associated with the target field name in the same browser is changed.

[0185] In an optional embodiment, the field content corresponding to the target field name is attribute data of the user account. The processing module 1402 is further used to obtain component data content corresponding to the attribute data of the user account. The device also includes a display module 1403. The display module 1403 is used to display the component data content on the current component.

[0186] In summary, when making a project, you can add the target field name directly in the target reference position according to the agreed rules, and obtain the corresponding field content according to the target field name reference when displaying, including: replacing the target field name with the corresponding field content when displaying the project, or directly reading the corresponding field content when displaying the project. The above provides a new field name input method and field content acquisition logic, which can quickly transfer values ​​without mounting.

[0187] Furthermore, the above-mentioned operation of adding the target field name is simple, which reduces the user's requirement for computer knowledge, does not require the participation of technical developers, and eliminates the dependence on technical developers during the project production process.

[0188] Fig.15 A structural block diagram of a visualization project production device provided by an exemplary embodiment of the present application is shown, the device comprising:

[0189] Running module 1501, used for running the visual project editing tool;

[0190] Adding module 1502 is used to add a target field name in the target reference position of the current component according to the agreed rules during the process of making a project through the visual project editing tool. The target field name is used to be replaced with the corresponding field content when displaying the project, or the target field name is used to directly read the corresponding field content when displaying the project.

[0191] In an optional embodiment, in the case where the target field name is used to be replaced by the corresponding field content when displaying the item, the target reference position includes at least one of a relevant reference position of the data source of the current component, a component address, and a jump external link address;

[0192] Among them, the data source is the data source on which the current component relies for display, the component address refers to the acquisition address of the current component, and the jump external link address refers to the link address of other pages for jump display.

[0193] In an optional embodiment, the adding module 1502 is further used to add the target field name in the uniform resource locator URL address of the API of the current component according to the agreed rule when the data source of the current component is an application program interface API;

[0194] The URL address is used to indicate the address of the API.

[0195] In an optional embodiment, the adding module 1502 is further used to add the target field name in at least one of the request header and body parameters of the API of the current component according to the agreed rule;

[0196] The request header is metadata in the request sent by the terminal to the server, and the body parameter is the body content in the request sent by the terminal to the server.

[0197] In an optional embodiment, the adding module 1502 is further used to add the target field name in the database query statement of the current component according to the agreed rule when the data source of the current component is a database.

[0198] In an optional embodiment, in the case where the target field name is used to directly read and obtain the corresponding field content when presenting the item, the target reference position includes a relevant reference position of a data filter;

[0199] The data filter is used to filter the data accessed through the data source.

[0200] In an optional embodiment, the agreed rules include at least one of the following:

[0201] When the target field name is added to the target reference position, a first character is added to the target field name, where the first character is a predetermined character;

[0202] When there are multiple target field names added to the target reference position, the multiple target field names are connected by a second character, and the second character is a predetermined character.

[0203] In an optional embodiment, the target field name and the field content corresponding to the target field name are stored by adding module 1502 through local storage and / or application state management;

[0204] In an optional embodiment, the target field name is added to the global data management and stored in the server, and the field content corresponding to the target field name is obtained by the server through query based on the target field name.

[0205] In an optional embodiment, the field content corresponding to the target field name is attribute data of the user account, and the attribute data of the user account is used for the current component to display component data content corresponding to the attribute data of the user account.

[0206] In summary, when making a project, you can add the target field name directly in the target reference position according to the agreed rules, and obtain the corresponding field content according to the target field name reference when displaying, including: replacing the target field name with the corresponding field content when displaying the project, or directly reading the corresponding field content when displaying the project. The above provides a new field name input method and field content acquisition logic, which can quickly transfer values ​​without mounting.

[0207] Furthermore, the above-mentioned operation of adding the target field name is simple, which reduces the user's requirement for computer knowledge, does not require the participation of technical developers, and eliminates the dependence on technical developers during the project production process.

[0208] Fig.16 The block diagram of the structure of a computer device 1600 provided by an exemplary embodiment of the present application is shown. The computer device 1600 may be a portable mobile terminal, such as a smart phone, a tablet computer, an MP3 player (Moving Picture Experts Group Audio Layer III), an MP4 player (Moving Picture Experts Group Audio Layer IV), a laptop computer or a desktop computer. The computer device 1600 may also be called a user device, a portable terminal, a laptop terminal, a desktop terminal or other names.

[0209] Typically, the computer device 1600 includes a processor 1601 and a memory 1602 .

[0210] The processor 1601 may include one or more processing cores, such as a 4-core processor, an 8-core processor, etc. The processor 1601 may be implemented in at least one hardware form of DSP (Digital Signal Processing), FPGA (Field-Programmable Gate Array), and PLA (Programmable Logic Array). The processor 1601 may also include a main processor and a coprocessor. The main processor is a processor for processing data in the awake state, also known as a CPU (Central Processing Unit); the coprocessor is a low-power processor for processing data in the standby state. In some embodiments, the processor 1601 may be integrated with a GPU (Graphics Processing Unit), which is responsible for rendering and drawing the content to be displayed on the display screen. In some embodiments, the processor 1601 may also include an AI (Artificial Intelligence) processor, which is used to process computing operations related to machine learning.

[0211] The memory 1602 may include one or more computer-readable storage media, which may be non-transitory. The memory 1602 may also include a high-speed random access memory, and a non-volatile memory, such as one or more disk storage devices, flash memory storage devices. In some embodiments, the non-transitory computer-readable storage medium in the memory 1602 is used to store at least one instruction, which is used to be executed by the processor 1601 to implement the display and production method of the visualization project provided in the method embodiment of the present application.

[0212] In some embodiments, the computer device 1600 may further optionally include: a peripheral device interface 1603 and at least one peripheral device. The processor 1601, the memory 1602 and the peripheral device interface 1603 may be connected via a bus or a signal line. Each peripheral device may be connected to the peripheral device interface 1603 via a bus, a signal line or a circuit board. For example, the peripheral device may include: at least one of a radio frequency circuit 1604, a display screen 1605, a camera assembly 1606, an audio circuit 1607 and a power supply 1608.

[0213] The peripheral device interface 1603 may be used to connect at least one peripheral device related to I / O (Input / Output) to the processor 1601 and the memory 1602. In some embodiments, the processor 1601, the memory 1602, and the peripheral device interface 1603 are integrated on the same chip or circuit board; in some other embodiments, any one or two of the processor 1601, the memory 1602, and the peripheral device interface 1603 may be implemented on a separate chip or circuit board, which is not limited in this embodiment.

[0214] The radio frequency circuit 1604 is used to receive and transmit RF (Radio Frequency) signals, also known as electromagnetic signals. The radio frequency circuit 1604 communicates with the communication network and other communication devices through electromagnetic signals. The radio frequency circuit 1604 converts the electrical signal into an electromagnetic signal for transmission, or converts the received electromagnetic signal into an electrical signal. Optionally, the radio frequency circuit 1604 includes: an antenna system, an RF transceiver, one or more amplifiers, a tuner, an oscillator, a digital signal processor, a codec chipset, a user identity module card, and the like. The radio frequency circuit 1604 can communicate with other terminals through at least one wireless communication protocol. The wireless communication protocol includes, but is not limited to: the World Wide Web, a metropolitan area network, an intranet, various generations of mobile communication networks (2G, 3G, 4G and 5G), a wireless local area network and / or a WiFi (Wireless Fidelity) network. In some embodiments, the radio frequency circuit 1604 may also include circuits related to NFC (Near Field Communication), which is not limited in this application.

[0215] The display screen 1605 is used to display a UI (User Interface). The UI may include graphics, text, icons, videos, and any combination thereof. When the display screen 1605 is a touch display screen, the display screen 1605 also has the ability to collect touch signals on the surface or above the surface of the display screen 1605. The touch signal can be input to the processor 1601 as a control signal for processing. At this time, the display screen 1605 can also be used to provide virtual buttons and / or virtual keyboards, also known as soft buttons and / or soft keyboards. In some embodiments, the display screen 1605 can be one, arranged on the front panel of the computer device 1600; in other embodiments, the display screen 1605 can be at least two, respectively arranged on different surfaces of the computer device 1600 or in a folding design; in other embodiments, the display screen 1605 can be a flexible display screen, arranged on a curved surface or a folding surface of the computer device 1600. Even, the display screen 1605 can also be arranged as a non-rectangular irregular figure, that is, a special-shaped screen. The display screen 1605 can be made of materials such as LCD (Liquid Crystal Display) and OLED (Organic Light-Emitting Diode).

[0216] The camera assembly 1606 is used to capture images or videos. Optionally, the camera assembly 1606 includes a front camera and a rear camera. Typically, the front camera is arranged on the front panel of the terminal, and the rear camera is arranged on the back of the terminal. In some embodiments, there are at least two rear cameras, which are any one of a main camera, a depth of field camera, a wide-angle camera, and a telephoto camera, so as to realize the fusion of the main camera and the depth of field camera to realize the background blur function, the fusion of the main camera and the wide-angle camera to realize the panoramic shooting and VR (Virtual Reality) shooting function or other fusion shooting functions. In some embodiments, the camera assembly 1606 may also include a flash. The flash can be a monochrome temperature flash or a dual-color temperature flash. A dual-color temperature flash refers to a combination of a warm light flash and a cold light flash, which can be used for light compensation at different color temperatures.

[0217] The audio circuit 1607 may include a microphone and a speaker. The microphone is used to collect sound waves from the user and the environment, and convert the sound waves into electrical signals and input them into the processor 1601 for processing, or input them into the radio frequency circuit 1604 to achieve voice communication. For the purpose of stereo acquisition or noise reduction, there may be multiple microphones, which are respectively arranged at different parts of the computer device 1600. The microphone may also be an array microphone or an omnidirectional acquisition microphone. The speaker is used to convert the electrical signal from the processor 1601 or the radio frequency circuit 1604 into sound waves. The speaker may be a traditional film speaker or a piezoelectric ceramic speaker. When the speaker is a piezoelectric ceramic speaker, it can not only convert the electrical signal into sound waves audible to humans, but also convert the electrical signal into sound waves inaudible to humans for purposes such as ranging. In some embodiments, the audio circuit 1607 may also include a headphone jack.

[0218] The power supply 1608 is used to power various components in the computer device 1600. The power supply 1608 can be an alternating current, a direct current, a disposable battery, or a rechargeable battery. When the power supply 1608 includes a rechargeable battery, the rechargeable battery can be a wired rechargeable battery or a wireless rechargeable battery. A wired rechargeable battery is a battery that is charged through a wired line, and a wireless rechargeable battery is a battery that is charged through a wireless coil. The rechargeable battery can also be used to support fast charging technology.

[0219] In some embodiments, the computer device 1600 further includes one or more sensors 1609 , including but not limited to: an acceleration sensor 1610 , a gyroscope sensor 1611 , a pressure sensor 1612 , an optical sensor 1613 , and a proximity sensor 1614 .

[0220] The acceleration sensor 1610 can detect the magnitude of acceleration on the three coordinate axes of the coordinate system established by the computer device 1600. For example, the acceleration sensor 1610 can be used to detect the components of gravity acceleration on the three coordinate axes. The processor 1601 can control the display screen 1605 to display the user interface in a horizontal view or a vertical view according to the gravity acceleration signal collected by the acceleration sensor 1610. The acceleration sensor 1610 can also be used to collect motion data of games or users.

[0221] The gyro sensor 1611 can detect the body direction and rotation angle of the computer device 1600, and the gyro sensor 1611 can cooperate with the acceleration sensor 1610 to collect the user's 3D actions on the computer device 1600. The processor 1601 can implement the following functions based on the data collected by the gyro sensor 1611: motion sensing (such as changing the UI according to the user's tilt operation), image stabilization during shooting, game control, and inertial navigation.

[0222] The pressure sensor 1612 can be set on the side frame of the computer device 1600 and / or the lower layer of the display screen 1605. When the pressure sensor 1612 is set on the side frame of the computer device 1600, it can detect the user's grip signal of the computer device 1600, and the processor 1601 performs left and right hand recognition or shortcut operations according to the grip signal collected by the pressure sensor 1612. When the pressure sensor 1612 is set on the lower layer of the display screen 1605, the processor 1601 controls the operability controls on the UI interface according to the user's pressure operation on the display screen 1605. The operability controls include at least one of a button control, a scroll bar control, an icon control, and a menu control.

[0223] The optical sensor 1613 is used to collect the ambient light intensity. In one embodiment, the processor 1601 can control the display brightness of the display screen 1605 according to the ambient light intensity collected by the optical sensor 1613. For example, when the ambient light intensity is high, the display brightness of the display screen 1605 is increased; when the ambient light intensity is low, the display brightness of the display screen 1605 is reduced. In another embodiment, the processor 1601 can also dynamically adjust the shooting parameters of the camera component 1606 according to the ambient light intensity collected by the optical sensor 1613.

[0224] The proximity sensor 1614, also called a distance sensor, is usually disposed on the front panel of the computer device 1600. The proximity sensor 1614 is used to collect the distance between the user and the front of the computer device 1600. In one embodiment, when the proximity sensor 1614 detects that the distance between the user and the front of the computer device 1600 is gradually decreasing, the processor 1601 controls the display screen 1605 to switch from the screen-on state to the screen-off state; when the proximity sensor 1614 detects that the distance between the user and the front of the computer device 1600 is gradually increasing, the processor 1601 controls the display screen 1605 to switch from the screen-off state to the screen-on state.

[0225] Those skilled in the art will understand that Fig.16 The structure shown in the figure does not constitute a limitation on the computer device 1600, and the computer device 1600 may include more or less components than shown in the figure, or combine some components, or adopt a different arrangement of components.

[0226] The present application also provides a computer-readable storage medium, in which at least one instruction, at least one program, a code set or an instruction set is stored. The at least one instruction, the at least one program, the code set or the instruction set is loaded and executed by a processor to implement the display and production method of the visualization project provided by the above method embodiment.

[0227] The present application provides a computer program product or a computer program, which includes computer instructions stored in a computer-readable storage medium. A processor of a computer device reads the computer instructions from the computer-readable storage medium, and the processor executes the computer instructions, so that the computer device executes the display and production method of the visualization project provided by the above method embodiment.

[0228] The serial numbers of the above-mentioned embodiments of the present application are for description only and do not represent the advantages or disadvantages of the embodiments.

[0229] A person skilled in the art will understand that all or part of the steps to implement the above embodiments may be accomplished by hardware or by instructing related hardware through a program, and the program may be stored in a computer-readable storage medium, and the above-mentioned storage medium may be a read-only memory, a disk or an optical disk, etc.

[0230] The above description is only an optional embodiment of the present application and is not intended to limit the present application. Any modifications, equivalent substitutions, improvements, etc. made within the spirit and principles of the present application shall be included in the protection scope of the present application.

Claims

1. A method for displaying a visualization project, characterized in that: The method comprises: Run the visual project editing tool; In the process of displaying the project through the visual project editing tool, the current component obtains the target field name and the field content corresponding to the target field name; The current component replaces the target field name with the corresponding field content at the target reference position according to the target field name added at the target reference position according to the agreed rules, or directly reads the corresponding field content at the target reference position.

2. The method according to claim 1, characterized in that Before the current component obtains the target field name and the corresponding field content, it also includes: The target field name and the field content corresponding to the target field name are stored in the browser session through a local storage interface; and / or, The target field name and the field content corresponding to the target field name are stored in the application state management through the application state management interface.

3. The method according to claim 1, characterized in that Before the current component obtains the target field name and the corresponding field content, it also includes: Acquire the target field name in the global data management, where the target field name in the global data management supports at least one of adding, deleting and modifying operations performed by the user; The target field name is stored in a server, and the server is used to query and obtain the field content corresponding to the target field name according to the target field name; Receive the target field name and the corresponding field content sent by the server.

4. The method according to claim 1, characterized in that: The method further comprises: In the case where the target field name is a variable name, associating the target field name with a plurality of components, the plurality of components including the current component; When the field content corresponding to the target field name is changed by the current component, the display effects of multiple components associated with the target field name in the same browser are changed.

5. The method according to claim 1, characterized in that The field content corresponding to the target field name is the attribute data of the user account; The method further comprises: Acquire component data content corresponding to attribute data of the user account; The component data content is displayed on the current component.

6. A method for producing a visualization project, characterized in that: The method comprises: Run the visual project editing tool; In the process of creating a project through the visual project editing tool, the target field name is added to the target reference position of the current component according to the agreed rules. The target field name is used to be replaced with the corresponding field content when displaying the project, or the target field name is used to directly read the corresponding field content when displaying the project.

7. The method according to claim 6, characterized in that In the case where the target field name is used to be replaced by the corresponding field content when displaying the item, the target reference position includes at least one of a relevant reference position of the data source of the current component, a component address, and a jump external link address; Among them, the data source is the data source on which the current component relies for display, the component address refers to the acquisition address of the current component, and the jump external link address refers to the link address of other pages for jump display.

8. The method according to claim 7, characterized in that The target field name is added in the target reference position of the current component according to the agreed rules, including: In the case where the data source of the current component is an application program interface API, adding the target field name in the uniform resource locator URL address of the API of the current component according to the agreed rule; The URL address is used to indicate the address of the API.

9. The method according to claim 7, characterized in that: The target field name is added in the target reference position of the current component according to the agreed rules, including: In the case where the data source of the current component is a database, the target field name is added to the database query statement of the current component according to the agreed rule.

10. The method according to claim 6, characterized in that In the case where the target field name is used to directly read and obtain the corresponding field content when presenting the item, the target reference position includes a relevant reference position of a data filter; The data filter is used to filter the data accessed through the data source.

11. The method according to any one of claims 6 to 10, characterized in that: The agreed rules include at least one of the following: When the target field name is added to the target reference position, a first character is added to the target field name, where the first character is a predetermined character; When there are multiple target field names added to the target reference position, the multiple target field names are connected by a second character, and the second character is a predetermined character.

12. The method according to any one of claims 6 to 10, characterized in that: The target field name and the field content corresponding to the target field name are stored via local storage and / or application state management; or, The target field name is added to the global data management and stored in the server, and the field content corresponding to the target field name is obtained by the server through query according to the target field name.

13. The method according to any one of claims 6 to 10, characterized in that: The field content corresponding to the target field name is the attribute data of the user account; The attribute data of the user account is used for the current component to display the corresponding component data content.

14. A display device for a visualization project, characterized in that: The device comprises: Run module, used to run the visual project editing tool; A processing module, used for obtaining a target field name and field content corresponding to the target field name by the current component during the process of displaying the project through the visual project editing tool; The processing module is also used for the current component to replace the target field name with the corresponding field content at the target reference position according to the target field name added at the target reference position according to the agreed rules, or to directly read the corresponding field content at the target reference position.

15. A device for producing a visualization project, characterized in that: The device comprises: Run module, used to run the visual project editing tool; An adding module is used to add a target field name in the target reference position of the current component according to the agreed rules during the process of making a project through the visual project editing tool. The target field name is used to be replaced with the corresponding field content when displaying the project, or the target field name is used to directly read the corresponding field content when displaying the project.

16. A visual project editing tool, characterized in that: The visualization project editing tool supports running the visualization project display method described in any one of claims 1 to 5; or, the visualization project editing tool supports running the visualization project creation method described in any one of claims 6 to 13.

17. A computer device, characterized in that: The computer device includes: a processor and a memory, the memory stores a computer program, and the computer program is loaded and executed by the processor to implement the method for displaying a visualization project as described in any one of claims 1 to 5, or the method for making a visualization project as described in any one of claims 6 to 13.

18. A computer-readable storage medium, characterized in that: The computer-readable storage medium stores a computer program, and the computer program is loaded and executed by a processor to implement the method for displaying a visualization project described in any one of claims 1 to 5, or the method for producing a visualization project described in any one of claims 6 to 13.

19. A computer program product, characterized in that The computer program product includes a computer program, which is stored in a computer-readable storage medium. The computer program is loaded and executed by a processor to implement the method for displaying a visualization project as described in any one of claims 1 to 5, or the method for producing a visualization project as described in any one of claims 6 to 13.

Images