CN117331551A - Large-screen data visualization system and method - Google Patents

Abstract

The invention provides a large-screen data visualization system, which converts data indexes into data services by combing data indexes related to enterprise management and management activities and utilizing a data index interface, displays the data services in a graphical and diagrammatical mode, establishes a visualized page by creating a page frame template, defines the layout of the page in the template, selects a diagrammatical resource block to fill the page frame template layout, and completes the configuration of the visualized page. The system can realize data integration and sharing and provide an efficient data query method; and the large screen page is opened in second level, so that the working efficiency is greatly improved. The manager can intuitively analyze the data through the system, reduce the management cost, exert the data value and support auxiliary decisions. Business personnel can drill data layer by layer without support of system developers, multidimensional analysis and comprehensive display are realized, and effective basis is provided for leading decisions.

Description

Large-screen data visualization system and method

Technical Field

The invention belongs to the field of enterprise informatization, and particularly relates to a large-screen data visualization system and method.

Background

The core of enterprise informatization is effective processing of data or flow, and in the development of a computer software application system, when facing to data analysis, report form auxiliary decision production or huge data volume of a business intelligent system, leaders or business personnel at different levels have different focuses on system data. In the development of the traditional computer software system, when the real-time data or multidimensional data is required to be displayed through the portal front page, the code is required to be modified by a professional computer software developer in the background, a front-end engineer of the foreground cooperates with the modification pattern, and the display requirement is met after compiling and publishing, so that the workload is large and the cost is high.

In the prior art, large-screen visual design can be performed by utilizing the existing report forms and BI tools in the market, and the design method has the following defects:

1. the existing report and BI tools are not light enough and are too heavy;

2. the large-screen visual page manufactured by the report and the BI tool has poor performance, and can not achieve the response of all pages within 1 second. Because the visual pages made by the report and the BI tool are directly connected with the database, some complex logic calculation is performed, and the front end completely displays the large screen content slowly.

3. And a large-screen visual page is manufactured by using a report form and a BI tool, so that the granularity is relatively large and the large-screen visual page cannot be recycled. The large-screen visualization tool is automatically developed, granularity is small, the minimum basic unit is a chart resource block, and the chart resource block can be repeatedly utilized to assemble any visualization page.

Disclosure of Invention

The invention aims to overcome the defects of low display speed and inflexible configuration of the existing large-screen data visualization system.

In order to achieve the above object, the present invention provides a large screen data visualization system, which converts data indexes into data services by combing data indexes related to enterprise management and management activities and using a data index interface; defining the layout of the page in the template by creating a page frame template, and building a visual page; selecting a chart resource block to be filled into the page framework template layout, and completing visual page configuration; the system comprises:

page frame template: the visual design is used for realizing the visual design of the contents of each part of the page;

chart resource templates: the data resource conversion module is used for carrying out graphical and tabular display on the data returned by the data index interface and converting the data resource into a diagrammatized resource;

and a visual page module: the method is used for creating and maintaining a large-screen visual page;

data index interface: for indexing, serving, and serving various types of data.

As an improvement of the system, the page frame template module functions comprise page frame template inquiry, addition and deletion, template attribute editing and template layout editing.

As an improvement of the system, the chart resource template module functions comprise chart resource inquiry, addition, editing and deletion, chart layout configuration, preview and deletion.

As an improvement of the system, the visual page module functions comprise visual page inquiry, addition, deletion and preview, editing page attributes and assembling configuration pages.

As an improvement of the system, the functions of the data index interface module comprise inquiry, addition, editing, parameter configuration and deletion of interfaces;

as an improvement of the system, the data index interface supports a plurality of data source interfaces, including Oracle, sql Server, mySqL and SQLlite.

As an improvement of the above system, the database table of the system comprises: data index interface table, industry type table, chart resource template table, page frame template table, theme table, chart resource table and visual page table.

The invention also provides a large screen data visualization method based on the large screen data visualization system, which comprises the following steps:

step 1: adding a layout through a page frame template;

step 1.1: adding a page frame model;

step 1.2: cutting in a mouse dragging mode to generate a layout;

step 2: laying out a chart resource template by using the visualization tool;

step 2.1: adding a chart resource template;

step 2.2: configuring parameters of a chart resource template;

step 3: operating the visual page by utilizing the visual tool, embedding a page frame template, and selecting a chart resource block to be filled into the layout of the page frame template;

step 3.1: adding chart resources and editing resource attributes;

step 3.2: performing layout work, and performing parameter configuration, chart configuration and data processing to form a visible and instant interface;

step 4: converting the data into data services through a data index interface;

step 4.1: adding an interface request type through a data index interface list;

step 4.2: updating a page frame and editing a resource address;

step 4.3: and configuring data index interface parameters.

The invention also provides a computer device comprising a memory, a processor and a computer program stored on the memory and executable on the processor, the processor implementing a method as claimed in any one of the preceding claims when executing the computer program.

The invention also provides a computer readable storage medium storing a computer program which, when executed by a processor, causes the processor to perform a method as claimed in any one of the preceding claims.

Compared with the prior art, the invention has the advantages that:

1. the large-screen data visualization system can realize page second-level opening, greatly improve the working efficiency and provide an efficient query method through data integration and sharing.

2. The manager can intuitively analyze the data through the system, so that the management cost is reduced, the data value is exerted, and the auxiliary decision is supported.

3. Business personnel can drill data layer by layer without support of system developers, multidimensional analysis and comprehensive display are realized, and effective basis is provided for leading decisions.

Drawings

FIG. 1 is a diagram of a large screen data visualization system;

FIG. 2 is a schematic diagram of a large screen data visualization system main interface;

FIG. 3 is a schematic diagram of a page frame template including functional points;

FIG. 4 is a schematic diagram of a page frame template list page;

FIG. 5 is a schematic diagram of a newly added page frame template page;

FIG. 6 is a schematic diagram of an edit page framework template property page;

FIG. 7 is a schematic diagram of an edit template layout page;

FIG. 8 is a diagram of a resource template page of a chart;

FIG. 9 is a diagram illustrating a chart resource query page;

FIG. 10 is a diagram of a newly added diagram resource page;

FIG. 11 is a schematic diagram of an edit chart resource page;

FIG. 12 is a schematic diagram of an HTML document structure page defining a chart resource block page;

FIG. 13 is a diagram illustrating a style page defining a chart resource block page;

FIG. 14 is a diagram of a chart resource block page Javascript code presentation page;

FIG. 15 is a diagram illustrating a configuration diagram resource block parameter page;

FIG. 16 is a diagram of a configuration diagram resource block newly added parameter page;

FIG. 17 is a schematic diagram of a preprocessing page for data index interface return data requested by a chart resource block through a Javascript code;

FIG. 18 is a diagram showing a functional page in which a chart resource block is visualized by a Javascript code setup chart;

FIG. 19 is a diagram illustrating a diagram of a diagram layout configuration generation code segment presentation page;

FIG. 20 is a diagram illustrating a preview schema resource presentation effect page;

FIG. 21 is a schematic diagram of a visualization page module page;

FIG. 22 is a diagram illustrating a visual page query;

FIG. 23 is a diagram of a newly added screen visualization page;

FIG. 24 is a diagram illustrating editing visual page properties;

FIG. 25 is a schematic diagram of an assembly configuration page;

FIG. 26 is a diagram illustrative of a process for visualizing a page selection page framework template;

FIG. 27 is a diagram illustrating the results of a visual page selection page framework template;

FIG. 28 is a diagram showing a layout adding chart resource process;

FIG. 29 is a diagram showing the results of adding chart resources to a layout;

FIG. 30 is a schematic diagram of a preview organization assembly page;

FIG. 31 is a diagram illustrating a page of a data pointer interface module;

FIG. 32 is a diagram illustrating a data index interface query page;

FIG. 33 is a diagram of a new page of the data pointer interface;

FIG. 34 is a diagram illustrating a theme drop-down box to which a data pointer interface editing page pertains;

FIG. 35 is a diagram illustrating a data index interface edit page industry type drop-down box;

FIG. 36 is a diagram illustrating a data pointer interface parameter configuration page;

FIG. 37 is a diagram illustrating a data pointer interface parameter configuration add input box type parameter page;

FIG. 38 is a diagram illustrating a data pointer interface parameter configuration add-on selection type parameter page;

FIG. 39 is a diagram illustrating a data pointer interface parameter configuration increment year type parameter page;

FIG. 40 is a diagram illustrating a data pointer interface parameter configuration add month type parameter page;

FIG. 41 is a diagram illustrating a data pointer interface parameter configuration add date type parameter page;

FIG. 42 is a diagram illustrating a delete data indicator interface page;

FIG. 43 is a diagram of a large screen data visualization system database table relationship.

Detailed Description

The technical scheme of the invention is described in detail below with reference to the accompanying drawings.

Microservices are a software architecture, a system organization that contains various organizations, including Web servers, application servers, databases, storage and communication layers, that interact with each other and the environment. The basic idea of microservices is to consider creating applications around business domain components that can be developed, managed and deployed independently. The use of micro-service cloud architecture and platform in decentralized components makes deployment, management, and service function delivery simpler.

The basic idea of the data visualization technology is that each data item in a database is represented as a single primitive element, a large number of data sets form a data image, and each attribute value of the data is represented in the form of multi-dimensional data, so that the data can be observed from different dimensions, and further observation and analysis can be carried out on the data.

The Restfule style is a software architecture style, not a standard, only provides a design principle and constraint conditions, is mainly applicable to software of client side and server side interaction, and is realized based on an http protocol. The method aims at improving the scalability of the system, reducing the coupling degree between applications and facilitating the framework distributed processing procedure. Software based on the style can be simpler and more hierarchical, and a caching mechanism is easier to realize.

In the Restfule style, the user angle requests use the same URL, and the request processing method is distinguished by a request mode (get/post/delete/put). Therefore, front-end developers can not confuse the requested resource addresses in the development of foreground and background separation, and a unified interface is formed.

(1) Each URL represents a resource.

(2) Some layer of representation of this resource is passed between the client and the server.

(3) The client operates the server resource through four http verbs. The conversion of the presentation layer state is realized.

As shown in FIG. 1, the invention adopts the RestFul interface style to convert the data index into the data service by the coding mode through combing the data index related to the enterprise management and management activities, and the data service is displayed in a graphical and diagrammatical mode. The layout of the page is defined in the template by creating a page frame template, a visual page is built, the page frame template is embedded, and chart resource blocks are selected to be filled in the layout of the page frame template, so that the visual page configuration is completed. The visual configuration designer is shown in fig. 2.

The system mainly comprises four functional modules, namely a page framework template, a chart resource template, a visual interface and a data index interface.

1. Page frame template: the visual designer for the page layout is provided, and visual design of contents of all parts of the page can be realized. The system authorization service personnel can self-define adding layout, saving layout and carrying out emptying operation, can select a menu to carry out horizontal and vertical equal division, supports manual adjustment of the size of a single layout block, supports the position and the size of a dragging and moving layout block, and can independently delete unnecessary layout blocks.

The main operation functions of the page frame template comprise page frame template inquiry, new addition, template attribute editing, template layout editing, template deletion and the like.

The function of the page frame template is mainly to provide page layout for future visual pages, the page frame template can be applied to the visual pages, and each layout block can be added with a chart resource block, so that a visual page with rich contents is formed.

The page frame template can be applied to a plurality of visual pages and can be reused. Page frame template operation the page is shown in figure 3.

(1) Page frame template query: the fuzzy query method is used for carrying out fuzzy query according to the page framework template name. As shown in fig. 4, a keyword including a page frame template name is input in a search box, and a query is executed by clicking a "query" button.

(2) Newly added page frame templates: for adding a page frame template. Wherein the page frame template name is any meaningful chinese name; the page frame template describes optional filling, and can fill out layout types, application ranges and the like of the page frame template, as shown in fig. 5.

(3) Editing/updating template properties: for editing/updating the page frame template name and page frame template description, as shown in fig. 6.

(4) Editing/updating template layout: by adopting the visual page layout designer, the layout can be added, the layout is horizontally and vertically divided, the layout blocks are dragged by a mouse and placed at different positions, and the size of the layout blocks is adjusted by the mouse dragging. Deletion may be performed for unnecessary layout blocks.

As shown in fig. 7, the editing/updating template layout main operation functions include: adding layout, saving layout and emptying layout.

Adding a layout: a new layout block is added.

Preserving the layout: the edited/updated layout is saved.

Emptying layout: the modifications to the layout are cleared and the state of the layout block with only one full screen presentation is restored.

2. Chart resource templates: the method is used for carrying out graphical and tabular display on json data returned by calling the data index interface, and converting boring data resources into attractive, vivid and dynamic diagramming resources. The system authorizes business personnel to edit the layout and customize variable parameters through the visualization tool, and generates a preview page.

Each chart resource block consists of HTML, javaScript, CSS three code segments. With HTML structure editors, CSS style editors, data processing, and chart configuration editors, a user can write a variety of visual chart resource table blocks using standard HTML, javaScript, CSS statements, such as: graph, line graph, pie chart, map, etc.

As shown in FIG. 8, the primary operational functions of the chart resource template include query, add-on, edit-modify, chart layout configuration, preview, delete, etc.

The compiled chart resource templates may be saved for later reuse.

(1) And querying the chart resource, wherein the chart resource is used for carrying out fuzzy query according to the name of the chart resource block. As shown in fig. 9, a keyword including the chart resource block name is input in the search box, and a query is executed by clicking a "query" button.

(2) And adding a chart resource for adding a chart resource template. As shown in fig. 10, wherein:

chart name: may be any meaningful chinese name.

Visual page coding: optionally, the request address of the chart resource is visualized, defaulting to null, and if null, the system automatically generates the request address of the chart resource block.

Data index request type: POST, GET.

The subject matter of which is: the subject matter of the chart resource block is selected. The method is divided according to industry types and mainly comprises a group front page, a secondary unit, enterprise core indexes, basic information, enterprise experience, production operation, environment-friendly information, network safety, enterprise development, technological innovation, national operation and the like.

Industry type: the industry type of the chart resource block is selected. Mainly comprises power supply varieties such as hydroelectric power, thermal power, wind power, photovoltaic power, nuclear power and the like.

(3) Editing/updating the chart resource for editing the chart resource. As shown in fig. 11, the editing contents mainly include a chart resource name, an affiliated theme, and an industry type.

(4) The chart layout configuration is used for configuring parameters of chart resources, processing requested data, configuring a visualized graph table, configuring CSS styles, defining page HTML structures and the like. And generating the visualized chart resource blocks in real time through HTML, javaScript, CSS code fragments input by a user and parameter configuration.

The main operation functions of the chart layout configuration include: save, refresh view, parameter configuration, data processing, chart configuration, parameter code, CSS style, HTML structure, javascript code, etc.

And (3) preserving: and saving the operation operated by the chart resource.

Refresh view: after refreshing the visual chart and modifying the chart resource parameter configuration and HTML, javascript, CSS style code fragments, the real-time modification result can be checked by clicking a 'refreshing view' button.

HTML structure: the HTML document structure defining the chart resource block page, as shown in fig. 12, mainly defines the positions of elements DIV such as chart blocks, characters, buttons, icons, and the like.

CSS style: style of the chart resource block page is defined, and chart size, width, font and word and size, margin, interval, etc. As shown in fig. 13.

Javascript code: the chart resource block page implements JS codes except HTML and CSS parts, including codes such as parameter configuration, data processing, chart configuration and the like. As shown in fig. 14. The Javascript code is automatically integrated and generated according to parameter configuration, data processing and chart configuration code fragments without manual modification.

Parameter configuration: the configuration of various parameters of the chart resource block, as shown in fig. 15, mainly includes: the chart resource block requests URL address, unit, chart resource template selection, chart title, deadline for chart data of the data index interface, and other auxiliary parameters such as: chart color, title background, back diagram, font size, etc. Other parameters can be added by self according to the visual display requirement of the chart.

As shown in fig. 16, the newly added parameter entries include: parameter title, parameter name, and parameter type. Wherein the parameter type may select the request address and the picture.

And (3) data processing: and preprocessing the data returned by the data index interface of the chart resource block request through the Javascript code so as to adapt to the visual chart display. As shown in fig. 17.

Graph configuration: the chart resource blocks are set by the Javascript code to display a visual chart. As shown in fig. 18. To achieve different visualization effects, different JavaScript visualization class libraries may be introduced, such as: echarts, three.js, D3.Js, etc.

Parameter codes: the generated code segments mainly comprise the name and address of the requested data index interface, the title, the color, the unit, the background, the icon and the like of the chart resource, wherein the key is that the uploaded icon and picture files are stored in a base64 coding mode. As shown in fig. 19. This part does not need to be written manually, and is code automatically generated according to the content of the parameter configuration part.

(5) And previewing the chart resource, wherein the chart resource is used for previewing the chart resource display effect. As shown in fig. 20, in the chart resource list, clicking on the "preview" icon button opens the icon resource preview in the new browser window.

3. And a visual page module: the method is used for creating and maintaining the large-screen visual page. The system authorization business personnel can carry out the operations of saving, previewing and clearing through the visualization tool, and can also carry out the operation of selecting a custom template to carry out the layout of chart resources.

When a visual page is newly built, a proper page frame template is selected, and chart resource blocks are assembled into the page frame template to generate a large-screen visual page. And the URL address of the large-screen visual page is configured to a system function menu through the resource authority management system.

As shown in fig. 21, the main operation functions of the visual page include: query, add/add, edit/update page attributes, assemble pages, delete pages, preview pages, etc.

(1) And querying the visual page, wherein the visual page is used for performing fuzzy query according to the visual page name. As shown in fig. 22, a keyword including a visual page name is input in a search box, and a query is executed by clicking a "query" button.

(2) Newly adding a visual page: the method is used for adding a large-screen visual page. As shown in fig. 23. Wherein:

visual page name: any meaningful chinese name.

Visual page description: the content, purpose, etc. of the visual page.

Visual page coding: optionally, the ID of the page is visualized and the default system is automatically generated.

(3) Editing/updating page attributes: for editing large screen visual page properties. As shown in fig. 24, the visual page name and visual page description are mainly included.

(4) Assembling a configuration page: for selecting a page frame template for the visualization page, and selecting a chart resource block for each layout in the page frame template. And after all layouts in the page frame template are filled with the chart resource blocks, completing the visual page assembly configuration.

The main operation functions of the assembly configuration page include: save, preview, empty, select templates, add chart resource blocks, etc. As shown in fig. 25.

And (3) preserving: and storing the visual page editing content.

Previewing: the visual page content is previewed in real time.

And (3) emptying: and clearing editing operation on the visual page.

Selecting a template: an appropriate page frame template is selected for the visualization page. As shown in fig. 26 and 27.

Adding chart resources: one chart resource is added for each layout. As shown in fig. 28 and 29.

(5) The preview organization assembly page is shown in fig. 30.

4. Data index interface: the method is used for indexing and serving various types of data, and providing the data to the outside in a service mode to play the data value. And (3) carding out various index data according to the dimensions of each industry plate, business state, power supply variety, organization, time and the like of the group type enterprise, programming by adopting a RestFul interface style, converting static index data into data service, and publishing the data service. The data index interface supports a variety of data source interfaces including, but not limited to, oracle, sql Server, mySqL, SQLlite, etc. And (3) forming various data index items by combing service data, converting the data into data service by means of a RestFul interface, and providing the data service for a service system in a service mode.

When the data index interface is defined, basic information and parameter information of the data index can be set. The basic information comprises a data index name, a data index URL, a data index request type, a subject and an industry type. The parameter information may be one or more parameters set according to the data index interface requirements without setting parameters. Each parameter item includes a chinese parameter title, an english alphabet parameter name, a parameter type (dimension), a parameter value, and the like.

As shown in fig. 31, the main operation functions of the data index interface include inquiry, addition, editing modification, parameter configuration, deletion, and the like.

The same data index interface is requested, and returned data is different according to different parameters. For example: some data index interface is the power generation amount, if the parameters are transmitted: the organization code is a group, the power variety dimension is a full power supply, and the time dimension is a day, so that the power generation capacity of the whole group is obtained on a certain day. If the code of the organization is a certain secondary unit, the dimension of the power supply variety is thermal power, and the dimension of the time is month, the thermal power generating capacity of a certain month of the secondary unit is obtained.

(1) And the query data index interface is used for carrying out fuzzy query according to the data index name. As shown in fig. 32, a keyword including a data index name is input in a search box, and a query is executed by clicking a "query" button.

(2) And the newly added data index interface is used for newly adding a data index interface. As shown in fig. 33.

Data index name: any meaningful chinese name.

Data index URL: a uniform resource locator consisting of letters and symbols, data indicating the request address of the resource.

Data index request type: POST, GET.

The subject matter of which is: the method is divided according to industry types, and mainly comprises topics such as group home pages, secondary units, enterprise core indexes, basic information, enterprise experience, production operation, environment-friendly information, network safety, enterprise development, technological innovation, national operation and the like, which can be added through a background management interface.

Industry type: the power supply varieties mainly comprise hydropower, thermal power, wind power, photovoltaic, nuclear power and the like, and can be added through a background management interface.

(3) And the editing/updating data index interface is used for editing/updating the basic information of the data index interface. The method mainly comprises a data index name, a data index URL, a data index request type, a subject and an industry type. As shown in fig. 34 and 35.

(4) And the parameter configuration is used for setting different numbers of dimension parameters for the interfaces according to the service requirements of each data index interface. As shown in fig. 36, the main dimensions include: organization, power source variety, time, province, area, province in/out, electricity selling side/electricity generating side, and the like.

And adding a plurality of parameters, selecting an input box by the parameter type, and automatically displaying a default value input box on the left side. As shown in fig. 37.

And a plurality of parameters are added, the parameter types are selected, the parameter input types are automatically displayed on the left side, and 1, 2, 3, 4 and 5 represent 5 power supply types of water, fire, wind, light and core. As shown in fig. 38.

The number of parameters is increased, the type of the parameters is selected as 'year', the default value is automatically displayed on the left side, and the optional parameters are the present year, the last year, the open year or any other year. As shown in fig. 39.

And adding a plurality of parameters, wherein the type of the parameters is selected as 'month', the left side automatically displays and sets default values, and the selectable parameters are the month, the upper month, the lower month or any other month. As shown in fig. 40.

Adding a plurality of parameters, selecting a 'date' by the parameter type, automatically displaying a default value on the left side, and selecting the optional parameters as today, yesterday, tomorrow or other personnel dates. As shown in fig. 41.

(5) And deleting the data index interface, wherein the data index interface is used for deleting the data index interface which is no longer needed. As shown in fig. 42, the delete button delete may be clicked in the data index list.

The database table list of the large screen data visualization system is shown in the following table:

sequence number	Data sheet	Name of the name	Remarks description
				1	spicins_sys_data_indicators	Data index interface table
2	spicins_sys_industry_info	Industry type table
				3	spicins_sys_module_template	Chart resource template table
4	spicins_sys_template	Page framework template table
				5	spicins_sys_theme_info	Theme table
6	spicins_sys_visualization_index_manager	Chart resource table	Chart resource code and icon
				7	spicins_sys_visualization_page	Visual page table

The relationship between database tables is shown in fig. 43.

The data pointer interface table (spin_sys_data_indicators) structure is shown in the following table:

the industry type table (spin_sys_index_info) structure is shown in the following table:

sequence number

Fields

Name of the name

Data type

Main key

Non-empty

Default value

Remarks description

1

id

INT(11)

√

√

2

industry_name

Industry type

VARchar(200)

3

data_date

VARchar(200)

The chart resource template table (spin_sys_module_template) structure is shown in the following table:

the page frame template table (spin_sys_template) structure is shown in the following table:

sequence number

Fields

Name of the name

Data type

Main key

Non-empty

Default value

Remarks description

1

id

Page frame id

INT(11)

√

√

2

template

Page frame json

TEXT

3

template_name

Page frame name

VARchar(255)

4

template_desc

Page frame description

TEXT

5

create_user

Creating a person name

VARchar(255)

6

create_user_id

Creater id

VARchar(255)

7

update_user

Updating person

VARchar(255)

8

update_user_id

Updating person id

VARchar(255)

9

create_time

Creation time

VARchar(255)

10

update_time

Update time

VARchar(255)

The topic table (spin_sys_theme_info) structure is shown in the following table:

sequence number

Fields

Name of the name

Data type

Main key

Non-empty

Default value

Remarks description

1

id

Id

INT(11)

√

√

2

theme_name

Subject name

VARchar(200)

3

data_date

VARchar(200)

The chart resource table (spin_sys_visualization_index_manager) structure is shown in the following table:

the visualization page table (spin_sys_visualization_page) structure is shown in the following table:

the large screen data visualization system has the following advantages from the aspect of use: based on the visual template, the personalized customization of information such as style, layout, content and the like is supported, template multiplexing is supported, and a permission engine is built in, so that the application requirements of users of all levels are met; unified information management, more convenient and quick information inquiry; unifying the interface style, and enabling the web page to be presented and the user to experience more quickly; the unified station group maintenance can efficiently manage a plurality of stations.

The specific using method is as follows:

step 1: the authorized personnel can self-define the added layout and the saved layout through the page framework template, and when the layout is inappropriate, the emptying operation can be carried out.

Step 1.1: adding a page frame model list;

step 1.2: the page frame template is updated. And cutting the layout in a mouse dragging mode to generate a layout, and storing the layout after the layout is completed.

Step 2: and the authorized service personnel utilizes the visual tool layout chart resource template to realize online preview.

Step 2.1: adding a chart resource model list;

step 2.2: the newly added parameters comprise parameter names, parameter types and the like. CSS style, JS code, HTML structure are supported.

Step 3: and the authorized business personnel operate the visual page by utilizing the visual tool to perform the operations of saving, previewing and clearing, and can also perform the operation of selecting the template.

Step 3.1: adding a chart resource list, and editing data such as resource names, types, topics and the like;

step 3.2: and carrying out layout work, carrying out parameter configuration, chart configuration and data processing, forming a visible and obtained interface, and storing after finishing.

Step 4: and supporting various data sources through the data index interface, forming various data index items through combing service data, converting the data into data service through a RESTFUL interface mode, and providing the data service for different service systems in a service mode.

Step 4.1: adding an interface request type through an index interface list;

step 4.2: updating the page frame after the addition is completed, editing the resource address, and performing a storage operation after the addition is completed;

step 4.3: and after the newly added parameters are used for carrying out parameter configuration, the configuration is saved and completed.

The online use of the method can enable a leader or service personnel to focus on a required page according to a management service range through a system administrator, and generate a diagram resource obtained by seeing through custom design of a page frame, so that the system friendliness and the operation and maintenance flexibility are greatly improved.

The present invention may also provide a computer apparatus comprising: at least one processor, memory, at least one network interface, and a user interface. The various components in the device are coupled together by a bus system. It will be appreciated that a bus system is used to enable connected communications between these components. The bus system includes a power bus, a control bus, and a status signal bus in addition to the data bus.

The user interface may include, among other things, a display, a keyboard, or a pointing device (e.g., a mouse, track ball, touch pad, or touch screen, etc.).

It is to be understood that the memory in the embodiments disclosed herein may be either volatile memory or nonvolatile memory, or may include both volatile and nonvolatile memory. The nonvolatile Memory may be a Read-Only Memory (ROM), a Programmable ROM (PROM), an Erasable PROM (EPROM), an Electrically Erasable EPROM (EEPROM), or a flash Memory. The volatile memory may be random access memory (Random Access Memory, RAM) which acts as an external cache. By way of example, and not limitation, many forms of RAM are available, such as Static RAM (SRAM), dynamic RAM (DRAM), synchronous DRAM (SDRAM), double Data Rate SDRAM (Double Data Rate SDRAM), enhanced SDRAM (ESDRAM), synchronous DRAM (SLDRAM), and Direct RAM (DRRAM). The memory described herein is intended to comprise, without being limited to, these and any other suitable types of memory.

In some implementations, the memory stores the following elements, executable modules or data structures, or a subset thereof, or an extended set thereof: an operating system and application programs.

The operating system includes various system programs, such as a framework layer, a core library layer, a driving layer, and the like, and is used for realizing various basic services and processing hardware-based tasks. Applications, including various applications such as Media Player (Media Player), browser (Browser), etc., are used to implement various application services. The program implementing the method of the embodiment of the present disclosure may be contained in an application program.

In the above embodiment, the processor may be further configured to call a program or an instruction stored in the memory, specifically, may be a program or an instruction stored in an application program:

the steps of the above method are performed.

The method described above may be applied in a processor or implemented by a processor. The processor may be an integrated circuit chip having signal processing capabilities. In implementation, the steps of the above method may be performed by integrated logic circuits of hardware in a processor or by instructions in the form of software. The processor may be a general purpose processor, a digital signal processor (Digital Signal Processor, DSP), an application specific integrated circuit (Application Specific Integrated Circuit, ASIC), a field programmable gate array (Field Programmable Gate Array, FPGA) or other programmable logic device, discrete gate or transistor logic device, discrete hardware components. The methods, steps and logic blocks disclosed above may be implemented or performed. A general purpose processor may be a microprocessor or the processor may be any conventional processor or the like. The steps of a method as disclosed above may be embodied directly in hardware for execution by a decoding processor, or in a combination of hardware and software modules in a decoding processor. The software modules may be located in a random access memory, flash memory, read only memory, programmable read only memory, or electrically erasable programmable memory, registers, etc. as well known in the art. The storage medium is located in a memory, and the processor reads the information in the memory and, in combination with its hardware, performs the steps of the above method.

It is to be understood that the embodiments described herein may be implemented in hardware, software, firmware, middleware, microcode, or a combination thereof. For a hardware implementation, the processing units may be implemented within one or more application specific integrated circuits (Application Specific Integrated Circuits, ASIC), digital signal processors (Digital Signal Processing, DSP), digital signal processing devices (DSP devices, DSPD), programmable logic devices (Programmable Logic Device, PLD), field programmable gate arrays (Field-Programmable Gate Array, FPGA), general purpose processors, controllers, microcontrollers, microprocessors, other electronic units configured to perform the functions described herein, or a combination thereof.

For a software implementation, the inventive techniques may be implemented with functional modules (e.g., procedures, functions, and so on) that perform the inventive functions. The software codes may be stored in a memory and executed by a processor. The memory may be implemented within the processor or external to the processor.

The present invention may also provide a non-volatile storage medium for storing a computer program. The steps of the above-described method embodiments may be implemented when the computer program is executed by a processor.

Finally, it should be noted that the above embodiments are only for illustrating the technical solution of the present invention and are not limiting. Although the present invention has been described in detail with reference to the embodiments, it should be understood by those skilled in the art that modifications and equivalents may be made thereto without departing from the spirit and scope of the present invention, which is intended to be covered by the appended claims.

Claims (10)

1. A large screen data visualization system converts data indexes into data services by utilizing a data index interface by combing the data indexes related to enterprise management and management activities; defining the layout of the page in the template by creating a page frame template, and building a visual page; selecting a chart resource block to be filled into the page framework template layout, and completing visual page configuration; the system comprises:

page frame template: the visual design is used for realizing the visual design of the contents of each part of the page;

chart resource templates: the data resource conversion module is used for carrying out graphical and tabular display on the data returned by the data index interface and converting the data resource into a diagrammatized resource;

and a visual page module: the method is used for creating and maintaining a large-screen visual page;

data index interface: for indexing, serving, and serving various types of data.

2. The large screen data visualization system of claim 1, wherein the page frame template module functions include page frame template query, add and delete, template property editing, and template layout editing.

3. The large screen data visualization system of claim 1, wherein the chart resource template module functions include chart resource query, add, edit and delete, chart layout configuration, preview and delete.

4. The large screen data visualization system of claim 1, wherein the visualization page module functions include visualization page queries, additions, deletions, and previews, editing page attributes, and assembling configuration pages.

5. The large screen data visualization system of claim 1, wherein the data index interface module functions include query, add, edit, parameter configuration, and delete of interfaces.

6. The large screen data visualization system of claim 1 or 5, wherein the data pointer interface supports a plurality of data source interfaces including Oracle, sql Server, mySqL, and sqnlite.

7. The large screen data visualization system of claim 1, wherein the database table of the system comprises: data index interface table, industry type table, chart resource template table, page frame template table, theme table, chart resource table and visual page table.

8. A large screen data visualization method based on the large screen data visualization system of claim 1, the method comprising:

step 1: adding a layout through a page frame template;

step 1.1: adding a page frame model;

step 1.2: cutting in a mouse dragging mode to generate a layout;

step 2: laying out a chart resource template by using the visualization tool;

step 2.1: adding a chart resource template;

step 2.2: configuring parameters of a chart resource template;

step 3: operating the visual page by utilizing the visual tool, embedding a page frame template, and selecting a chart resource block to be filled into the layout of the page frame template;

step 3.1: adding chart resources and editing resource attributes;

step 3.2: performing layout work, and performing parameter configuration, chart configuration and data processing to form a visible and instant interface;

step 4: converting the data into data services through a data index interface;

step 4.1: adding an interface request type through a data index interface list;

step 4.2: updating a page frame and editing a resource address;

step 4.3: and configuring data index interface parameters.

9. A computer device comprising a memory, a processor and a computer program stored on the memory and executable on the processor, wherein the processor implements the method of claim 8 when executing the computer program.

10. A computer readable storage medium, characterized in that the computer readable storage medium stores a computer program which, when executed by a processor, implements the method of claim 8.