CN116166169A

CN116166169A - Chart block display method, computer device, and computer-readable storage medium

Info

Publication number: CN116166169A
Application number: CN202211717504.6A
Authority: CN
Inventors: 谭锦志; 尚璇; 陈心; 胡麦芳; 李泽群
Original assignee: Hangzhou Qulian Technology Co Ltd
Current assignee: Hangzhou Qulian Technology Co Ltd
Priority date: 2022-12-29
Filing date: 2022-12-29
Publication date: 2023-05-26

Abstract

The application relates to the technical field of computers, and provides a chart block display method, which comprises the following steps: acquiring first operation information; acquiring a first side length and a second side length of the target chart block based on the first operation information; if the first object to be displayed is a character, determining the smallest of the first side length and the second side length as a size basis; when the ratio of the size according to the ratio preset contrast number is smaller than or equal to a preset word size, displaying the first object to be displayed in the updated appearance according to a first word size; when the ratio of the size basis to the preset comparison number is larger than the preset word size, displaying the first object to be displayed in the updated appearance according to a second word size; and the first word size is smaller than the second word size, and the updated appearance is the appearance of the target chart block after the appearance of the target chart block is changed. Therefore, the display mode of the elements in the chart block can be customized.

Description

Chart block display method, computer device, and computer-readable storage medium

Technical Field

The application belongs to the technical field of computers, and particularly relates to a chart block display method, computer equipment and a computer readable storage medium.

Background

With the development of computer technology, the fixed index and style of the monitoring dial can not meet the demands of people, and people hope to define the monitoring dial according to the use situation.

In the prior art, a front-end developer uses a component of act-gard-layout to realize the functions of dragging and stretching each chart block in a chart block display page.

However, when the conventional chart block is dragged and stretched by a user, the appearance of the chart block is changed along with the position of the mouse, and the sizes of elements such as characters in the chart block are not changed, so that the sizes of the elements in the chart block and the appearance of the chart block are not matched, and the user is inconvenient to watch and has poor experience.

Disclosure of Invention

The embodiment of the application provides a chart block display method, a chart block display device, computer equipment, a computer readable storage medium and a computer program product, which can solve the problem that elements in a dragging frame in the prior art cannot be correspondingly interactively configured according to the size, the position and the like of the dragging frame.

In a first aspect, an embodiment of the present application provides a method for displaying a chart block, including:

acquiring first operation information, wherein the first operation information is information of a first operation of changing the outline dimension of a target chart block, which is input by a user;

Acquiring a first side length and a second side length of the target chart block based on the first operation information, wherein the first side length and the second side length are respectively the sizes of two adjacent sides after the appearance of the target chart block is changed, and the target chart block comprises at least one object to be displayed;

if the first object to be displayed is a character, determining the smallest of the first side length and the second side length as a size basis, wherein the first object to be displayed is any one of the at least one object to be displayed;

when the ratio of the size according to the ratio preset contrast number is smaller than or equal to a preset word size, displaying the first object to be displayed in the updated appearance according to a first word size;

when the ratio of the size basis to the preset comparison number is larger than the preset word size, displaying the first object to be displayed in the updated appearance according to a second word size;

and the first word size is smaller than the second word size, and the updated appearance is the appearance of the target chart block after the appearance of the target chart block is changed.

According to the method and the device, the sizes of two adjacent sides of the appearance of the target chart block after stretching operation can be obtained, the minimum side length size is used as a size basis, then the ratio of the size basis to the preset comparison number can be calculated, if the ratio is smaller than or equal to the preset word size, characters in the target chart block after stretching operation can be displayed in the first word size, and if the ratio is larger than the preset word size, the characters in the target chart block after stretching operation can be displayed in the second word size. According to the method and the device, the character size in the target chart block after the stretching operation can be automatically calculated according to the obtained outline size of the target chart block after the stretching operation, so that the character size in the target chart block is matched with the outline size of the target chart block, a user does not need to independently configure the character size, the user only needs to carry out simple stretching operation on the target chart block, the character in the target chart block can change along with the outline size of the change of the target chart block, the character size matched with the outline of the change of the target chart block is intelligently displayed, the display mode is reasonable, and the operation is portable.

In a possible implementation manner of the first aspect, the number of the at least one object to be displayed is greater than 1, and the method further includes:

if the ratio of the first side length to the total width is greater than or equal to a first ratio, displaying the at least one object to be displayed in a full quantity;

if the ratio of the first edge length to the total width is smaller than a first ratio, displaying part of the objects in the at least one object to be displayed;

the first side length is the width of the target chart block after the appearance of the target chart block is changed, the total width is the width of the page where the target chart block is located, and the first proportion is smaller than or equal to one third.

In the application, when the number of legends to be displayed is greater than 1, after a user performs stretching operation on the target chart block, the method and the device can automatically acquire and calculate the ratio of the width dimension of the target chart block after the stretching operation to the width dimension of the chart block display page where the target chart block is located, and can determine whether the legends are completely displayed or not by comparing the calculated ratio with the first ratio, so that the legends can display the width dimension change of the adaptive target chart block, and when the width dimension of the target chart block is enlarged, legends are displayed more abundantly, and when the width dimension of the target chart block is reduced, the legends are displayed more simply and reasonably.

In a possible implementation manner of the first aspect, the number of the at least one object to be displayed is greater than or equal to two, and if a ratio of the first edge length to the total width is smaller than a second ratio, the number of the partial objects is one less than the number of the at least one object to be displayed, and the second ratio is a positive number smaller than the first ratio.

In the application, when the ratio of the width dimension of the target chart block after the stretching operation to the width dimension of the chart block display page where the target chart block is located is smaller than the second ratio, the number of legends displayed in the target chart block after the stretching operation can be one less, so that the legend display can be adapted to the dimension of the target chart block.

In a possible implementation manner of the first aspect, the number of the at least one object to be displayed is greater than or equal to three;

if the ratio of the first edge length to the total width is smaller than a third ratio, the number of the partial objects is smaller than the number of the at least one object to be displayed by two, and the third ratio is a positive number smaller than the second ratio;

if the ratio of the first edge length to the total width is smaller than a fourth ratio, the number of the partial objects is smaller than the number of the at least one object to be displayed by two, and the fourth ratio is a positive number smaller than the third ratio, the method further includes:

And displaying the partial object in the updated appearance along the direction of the second side length.

In the application, when the ratio of the width dimension of the target chart block after the stretching operation to the width dimension of the chart block display page where the target chart block is located is smaller than the third ratio, the number of legends displayed in the target chart block after the stretching operation can be reduced by two, so that the legends can be displayed to adapt to the dimension of the target chart block, the situation that the legends are displayed outside the target chart block after the width dimension of the target chart block is reduced is avoided, and the display mode of the target chart block is unreasonable. When the ratio of the width dimension of the target chart block after the stretching operation to the width dimension of the chart block display page where the target chart block is located is smaller than the fourth ratio, the number of legends displayed in the target chart block after the stretching operation can be reduced by two, or all or part of the legends can be displayed in a direction changing manner, so that the legend display can be adapted to the dimension of the target chart block, and the content display of the target chart block is more reasonable.

In a possible implementation manner of the first aspect, the method further includes:

if the first object to be displayed is a chart, acquiring an original distance between an original chart in the target chart block and an original outline of the original chart, wherein the original chart is a chart in the target chart block before the outline of the target chart block is changed, and the original outline is an outline of the target chart block before the outline of the target chart block is changed;

Determining the updated size of the first object to be displayed according to the original distance, the first side length and the second side length;

displaying the first object to be displayed in the updated appearance according to the updated size, wherein the distance between the first object to be displayed and the updated appearance is the same as the original distance;

and the updated appearance is the appearance of the target chart block after the appearance of the target chart block is changed.

In the method, the distance between the updated chart and the updated outline of the target chart block can be set to be the same as the original distance, then the updated outline size of the target chart block after stretching operation can be obtained, the updated chart size can be calculated based on the updated outline size and the original distance, so that the chart size in the target chart block is matched with the outline size of the target chart block, a user does not need to independently configure the chart size, the user only needs to carry out simple stretching operation on the target chart block, the chart in the target chart block can be intelligently displayed, the chart in the target chart block can be displayed more harmoniously, and the user can conveniently watch the chart.

Acquiring second operation information, wherein the second operation information is information of a second operation input by a user and used for changing the position of the target chart block;

based on the second operation information, recording an updated position of the target chart block, wherein the updated position is a position after the position of the target chart block is changed;

and displaying the target chart block at the updated position.

According to the method and the device for displaying the target diagram blocks, the drawing function of the diagram blocks in the diagram block display page is provided, so that a user can draw the target diagram blocks to the proper positions according to the requirements of the user, the typesetting requirements of the user on the target diagram blocks can be met, and the diagram block display page is more flexible to display.

acquiring third operation information, wherein the third operation information is information of a selection operation executed by a user on a target control in a catalog interface, and the catalog interface at least comprises the target control corresponding to the target chart block;

and based on the third operation information, jumping the display page to the page where the target chart block is located according to the updating position so as to display the target chart block.

According to the method and the device, the position information can be directly jumped to the position of the target chart block in the chart block display page, the user does not need to search one by turning the scroll bar, time can be saved, and the searching efficiency of the target chart block is improved.

In a second aspect, an embodiment of the present application provides a chart block display apparatus, including a front end module and a chart block configuration component:

the front-end module is used for receiving a first operation and analyzing the first operation to obtain first operation information, wherein the first operation is an operation of changing the outline dimension of a target chart block input by a user;

the chart block configuration component is configured to obtain a first side length and a second side length of the target chart block based on the first operation information, where the first side length and the second side length are respectively the sizes of two adjacent sides after the appearance of the target chart block changes, and the target chart block includes at least one object to be displayed;

the chart block configuration component is further configured to determine a minimum of the first side length and the second side length as a size basis when a first object to be displayed is a character, where the first object to be displayed is any one of the at least one object to be displayed;

The diagram block configuration component is further used for displaying the first object to be displayed in the updated appearance according to a first word size when the ratio of the size according to the comparison preset comparison number is smaller than or equal to a preset word size;

the diagram block configuration component is further used for displaying the first object to be displayed in the updated appearance according to a second word size when the ratio of the size according to the comparison preset comparison number is larger than the preset word size;

In a possible implementation manner of the second aspect, the number of the at least one object to be displayed is greater than 1, and the chart block configuration component is further configured to display the at least one object to be displayed in full when a ratio of the first side length to the total width is greater than or equal to a first ratio; the method comprises the steps of,

when the ratio of the first side length to the total width is smaller than a first ratio, displaying part of the objects in the at least one object to be displayed;

In a possible implementation manner of the second aspect, the chart block configuration component is further configured to, when the first object to be displayed is a chart, obtain an original distance between an original chart in the target chart block and an original outline, determine an updated size of the first object to be displayed according to the original distance, the first side length, and the second side length, and display the first object to be displayed in the updated outline according to the updated size;

the original diagram is a diagram in the target diagram block before the appearance of the target diagram block changes, the original appearance is the appearance of the target diagram block before the appearance of the target diagram block changes, the distance between the first object to be displayed and the updated appearance is the same as the original distance, and the updated appearance is the appearance of the target diagram block after the appearance of the target diagram block changes.

In a possible implementation manner of the second aspect, the chart block configuration component is further configured to receive second operation information, record an update location of the target chart block based on the second operation information, and display the target chart block at the update location;

The second operation information is information of a second operation of changing the position of the target chart block, which is input by a user, and the updated position is a position after the position of the target chart block is changed.

According to the method, after the user drags and stretches the target chart block, the sizes of the elements in the target chart block can be automatically calculated, the sizes of the elements in the target chart block can be matched with the outline size of the target chart block, the display of the target chart block is more matched and harmonious, the user can watch the target chart block conveniently, and the user experience is improved.

In a third aspect, an embodiment of the present application provides a chart block display device, including a unit made up of software and/or hardware, where the unit is configured to perform any one of the methods in the first aspect.

In a fourth aspect, an embodiment of the present application provides a computer device, where the terminal device includes a memory, a processor, and a computer program stored in the memory and capable of running on the processor, where the computer program is executed by the processor to implement a method in any one of the foregoing solutions of the first aspect.

In a fifth aspect, embodiments of the present application provide a computer readable storage medium storing a computer program, where the computer program is executed by a processor to implement a method in any one of the foregoing first aspects.

In a sixth aspect, embodiments of the present application provide a computer program product, which when run on a terminal device, causes the terminal device to perform the method according to any one of the above-mentioned aspects.

It will be appreciated that the advantages of the second to sixth aspects may be found in the relevant description of the first aspect, and are not described here again.

Drawings

In order to more clearly illustrate the technical solutions of the embodiments of the present application, the following description will briefly introduce the drawings that are needed in the embodiments or the description of the prior art, it is obvious that the drawings in the following description are only some embodiments of the present application, and that other drawings may be obtained according to these drawings without inventive effort for a person skilled in the art.

FIG. 1 is a schematic diagram of a schematic block configuration provided in an embodiment of the present application;

FIG. 2 is a schematic diagram of a chart block generating method according to an embodiment of the present application;

FIG. 3 is a schematic flow chart of a drag and pull operation responding to a user according to an embodiment of the present application;

FIG. 4 is a flowchart of a method for displaying a chart block according to an embodiment of the present disclosure;

FIG. 5 is a schematic diagram of a legend overall presentation provided in an embodiment of the present application;

FIG. 6 is a first schematic illustration of a legend section presentation provided in an embodiment of the present application;

FIG. 7 is a second schematic illustration of a legend section presentation provided in an embodiment of the present application;

FIG. 8 is a third schematic illustration of a legend section presentation provided in an embodiment of the present application;

FIG. 9 is a schematic diagram of a schematic illustration provided by an embodiment of the present application;

FIG. 10 is a schematic diagram of a diagram block display page provided in an embodiment of the present application;

FIG. 11 is a schematic flow chart diagram of rendering chart blocks according to an existing configuration provided in an embodiment of the present application;

FIG. 12 is a schematic diagram of a schematic diagram block display device according to an embodiment of the present application;

fig. 13 is a schematic structural diagram of a schematic block display device according to an embodiment of the present application;

fig. 14 is a schematic structural diagram of a computer device according to an embodiment of the present application.

Detailed Description

In the following description, for purposes of explanation and not limitation, specific details are set forth, such as particular system configurations, techniques, etc. in order to provide a thorough understanding of the embodiments of the present application. It will be apparent, however, to one skilled in the art that the present application may be practiced in other embodiments that depart from these specific details. In other instances, detailed descriptions of well-known systems, devices, circuits, and methods are omitted so as not to obscure the description of the present application with unnecessary detail.

It should be understood that the terms "comprises" and/or "comprising," when used in this specification and the appended claims, specify the presence of stated features, integers, steps, operations, elements, and/or components, but do not preclude the presence or addition of one or more other features, integers, steps, operations, elements, components, and/or groups thereof.

It should also be understood that the term "and/or" as used in this specification and the appended claims refers to any and all possible combinations of one or more of the associated listed items, and includes such combinations.

As used in this specification and the appended claims, the term "if" may be interpreted as "when..once" or "in response to a determination" or "in response to detection" depending on the context. Similarly, the phrase "if a determination" or "if a [ described condition or event ] is detected" may be interpreted in the context of meaning "upon determination" or "in response to determination" or "upon detection of a [ described condition or event ]" or "in response to detection of a [ described condition or event ]".

In addition, in the description of the present application and the appended claims, the terms "first," "second," "third," and the like are used merely to distinguish between descriptions and are not to be construed as indicating or implying relative importance.

Reference in the specification to "one embodiment" or "some embodiments" or the like means that a particular feature, structure, or characteristic described in connection with the embodiment is included in one or more embodiments of the application. Thus, appearances of the phrases "in one embodiment," "in some embodiments," "in other embodiments," and the like in the specification are not necessarily all referring to the same embodiment, but mean "one or more but not all embodiments" unless expressly specified otherwise. The terms "comprising," "including," "having," and variations thereof mean "including but not limited to," unless expressly specified otherwise.

In the prior art, a front-end developer often uses a component of reaction-gard-layout to realize the functions of dragging and stretching a plurality of chart blocks in a chart block display page, but the component can only drag and stretch the appearance of the chart block, and the sizes of elements such as characters and the like in the chart block cannot be changed, so that the situation that the sizes of the elements in the chart block are not matched with the appearance size of the chart block possibly occurs, and the user is inconvenient to watch. Meanwhile, the component is only a component for realizing the dragging function, and has no other functions such as data query, so that front-end developers are required to configure related functions one by one, and finally, the monitoring dial can be generated.

The application provides a chart block display method, which comprises the steps of firstly obtaining a new outline dimension of a target chart block after being dragged and stretched by a user, then calculating a new dimension of an internal element of the target chart block based on the obtained new outline dimension, and displaying the target chart block and the internal element of the target chart block according to the new outline dimension of the target chart block and the new dimension of the internal element of the target chart block. According to the method, after the user drags and stretches the target chart block, the sizes of the elements in the target chart block can be automatically calculated, the sizes of the elements in the target chart block can be matched with the outline size of the target chart block, the display of the target chart block is more matched and harmonious, the user can watch the target chart block conveniently, and the user experience is improved. For clarity of description of the objects, the chart block in the embodiment of the present application is an integral unit including an outline and an internal element, and the chart is a graphic element inside the chart block.

The application may be implemented using compact as a front end bottom scaffold, or may be implemented based on other bottom frameworks, which is not limited in this embodiment of the application.

The blank chart block display page template is provided firstly, a user can enter the editing page of each independent chart block by clicking the option of the newly-built chart block, and can enter the blank area in the blank chart block display page template by clicking the option of the newly-built chart block, so that the user can conveniently select and edit.

Alternatively, the configuration of the chart block may be divided into a chart configuration and a block configuration. The diagram is configured for the configuration of the graphical elements inside the diagram blocks, and the block is configured for the overall configuration of the diagram blocks. Referring to fig. 1, fig. 1 is a schematic diagram of a chart block configuration provided in an embodiment of the present application. As shown in fig. 1, a block configuration may include a configuration of a title, description, location, size, etc., and a chart configuration may include a configuration of a chart type, data query, chart display, etc.

Optionally, the editing page of the chart block provided in the present application may include three main areas: a block configuration area, a chart configuration area, and a chart preview area. The diagram configuration area may include a diagram regular configuration area and a data query area, among others.

The block configuration area may include, but is not limited to, a title, a chart description, a position, a size, etc., and the chart conventional configuration area in the chart configuration area may include, but is not limited to, a chart type, a chart color, a number of data configuration bits, a configuration range, a configuration unit, etc. After entering the editing page of the chart block, the user can edit and/or select configuration attributes of configuration items provided by a block configuration area in the editing page and a chart conventional configuration area in the chart configuration area on the editing page according to requirements, so that block configuration information and chart configuration information are generated, wherein each configuration item comprises at least one configuration attribute.

For example, three configuration attribute options of a line graph, a pie graph and a bar graph can be included in the graph type configuration items of the graph conventional configuration area in the graph configuration area, if the user needs to look at the line graph, the line graph can be correspondingly selected as an option of the configuration attribute of the line graph, the line graph belongs to graph configuration information, the "processor speed" is input in an input box provided in the title configuration item of the block configuration area, and the "processor speed" belongs to block configuration information. The block configuration information and the chart configuration information obtained by selecting and/or editing the configuration attributes in the plurality of configuration items can be closer to the requirements of users or the finally displayed chart blocks are richer and meet the requirements of the users, and the block configuration information and the chart configuration information can be obtained by simply selecting and/or editing the plurality of configuration items in the conventional configuration areas of the charts in the block configuration area and the chart configuration area, so that the users do not need to configure the chart configuration information from the bottom layer one by one, and convenience is provided for the users.

Optionally, the chart configuration information may be configured by default, for example, entering the chart block editing page, the chart type is selected by default, the chart color is blue, the data configuration bit number is set to 2 by default, and the configuration range defaults to 0-100.

Referring to fig. 2, fig. 2 is a schematic diagram of a chart block generating method according to an embodiment of the present application.

Specifically, the chart blocks may be rendered from block configuration information and charts, which may be rendered from chart configuration information and data by a chart generation component. Firstly, a user can edit and/or select configuration items of a block configuration area and a conventional configuration area of a chart in the chart block editing page, the editing and/or selecting contents can respectively generate block configuration information and chart configuration information, a chart generation component can automatically acquire the chart configuration information, meanwhile, the user can input data query sentences in a command input box provided by a data query area in the chart configuration area, the application can acquire all data query sentences input by the user and query corresponding data to a server in batches based on the acquired data query sentences, then the application can send the acquired data to a chart generation component through inter-component communication, the chart generation component can automatically generate a chart according to the received data and the acquired chart configuration information, the application can acquire the chart generated by the chart generation component through inter-component communication, and finally the chart block is rendered and displayed according to the acquired chart and the block configuration information.

Alternatively, a code editor may be used in the data query field to receive user entered commands. A monaco editor may be used to obtain user entered query commands. Monaco is an open source component and is also a common editor, which is convenient for users to operate and edit. Other editors may also be employed to receive user-entered query commands, such as a CodeMirror editor, an Ace editor. The embodiments of the present application are not limited in this regard. An exemplary description is made below with the editor being a monaco editor.

Specifically, the user inputs a command query sentence in the command input box through the keyboard, and the monaco editor can recognize the command input by the user in real time and display the command on the interface of the editor according to default display parameters of the monaco editor, such as parameters of highlighting characters, colors and the like.

Optionally, the data query statement may be an SQL (Structured Query Language ) statement, and the user may input a corresponding SQL data query statement in the command input box, where all the SQL data query statements input by the user may be obtained in the present application, where all the SQL data query statements of one chart block may be all the SQL data query statements of all the chart blocks or all the SQL data query statements of all the chart blocks, and after all the SQL data query statements are obtained, the corresponding data may be queried from the server based on the data query statements.

In the present application, the chart generation component may be an echorts component, or may be another chart generation component such as a d3.Js (Data-Driven Documents) component, an ichorts component, or the like. Moreover, the present application may use one chart generation component to generate all charts, or may use a different chart generation component to generate different charts, for example, may use echarts to complete the rendering of all charts required, may use echarts to render charts in chart block 1, use icharts to render charts in chart block 2, use echarts and/or icharts or other chart generation components to render charts in other chart blocks. The embodiments of the present application are not limited in this regard.

According to the method and the device, after the chart block is rendered, the content of the chart block is displayed in the chart preview area, and if the related display content is changed, the chart block content displayed in the chart preview area can also respond in real time and change the display mode in real time, so that a user can see the display of the chart block content in real time through the chart preview area, and the dissatisfied places can be changed in time, and the working efficiency can be improved.

Optionally, after the first chart block is manufactured, the editing page is exited, so that the rendered chart block can be seen to be displayed on the chart block display page, the chart block displayed in the chart block display page is consistent with the chart block displayed in the chart preview area of the editing page, and the effect of being seen can be achieved. The user may continue to repeat the above operations, enter the editing page of the second chart block by clicking the option of the newly created chart block, or enter the blank area in the page template by clicking the chart block display page, and similarly, the fabrication of the third chart block and the fourth chart block … … is the same step, which is not described herein again.

Alternatively, the chart blocks may be displayed on the chart block display page in accordance with the positions and sizes in the block configuration information. The position and size in the block configuration information may be configured by default, for example, the outline size of all chart blocks may be 300px (pixel) ×200px, and finally all chart blocks may be displayed on the chart block display page by default outline size, or the position information of the first chart block may be default that the distance between the upper edge and the left edge of the chart block display page is 20px, and then the first chart block may be displayed on the chart block display page by default according to the position and the default size, or the side edges of two chart blocks adjacent in the same row may be separated by 20px, and the bottom edges of two chart blocks adjacent in the same row may be separated by 20px, and then finally other chart blocks may be displayed on the chart block display page by default according to the position information and the default size.

Optionally, in the process of making the chart block, automatic storage at fixed intervals, for example, time periods of 5 seconds, 6 seconds, 7 seconds and the like can be set, and when a user clicks a real-time storage button on a page, real-time storage can be performed in response to the stored operation, so that configuration data loss during emergency such as power failure and the like can be avoided.

Optionally, after the chart block is manufactured and displayed on the chart block display page, if the content to be changed exists, the user can directly click the chart block to enter the chart block editing page to change the content, and the chart preview area can display the changed chart block content in real time corresponding to the change of the chart block content, so that the user can conveniently check the change result, and meanwhile, the display content of the chart block in the chart block display page is changed. Alternatively, the deletion operation may be performed for unnecessary chart blocks displayed on the chart block display page.

Optionally, in the present application, a user may perform a stretching and dragging operation on a chart block displayed in a chart block display page, and in response to the stretching and dragging operation of the user, the display of the chart block may change adaptively. Referring to fig. 3, fig. 3 is a flow chart of responding to a drag and pull operation of a user according to an embodiment of the present application.

After a first operation, namely stretching operation, is performed on the chart block displayed in the chart block display page by a user, the size and/or the display mode of the elements in the chart block can be automatically calculated according to the outline size of the stretched chart block, so that the elements in the chart block can be adaptively displayed according to the outline size of the chart block, and additional configuration of the user is not needed. Meanwhile, corresponding to the change of the outline dimension of the chart block and the display of the elements in the chart block, the chart block configuration component can modify the configuration information of the relevant block, the modified configuration information of the relevant block can be sent to the chart component through inter-component communication, the chart component can perform operations such as word size change of specific words according to the received configuration information of the relevant block, and the application and the like of the chart component after receiving the configuration information of the relevant block are not limited. Wherein the chart component may include a chart generation component and a code editor, and the internal elements of the chart block may include, but are not limited to, characters, legends, charts. Referring to fig. 4, fig. 4 is a flowchart of a chart block display method according to an embodiment of the present application.

S401: acquiring first operation information, wherein the first operation information is information of a first operation of changing the outline dimension of a target chart block, which is input by a user; and acquiring a first side length and a second side length of the target chart block based on the first operation information, wherein the first side length and the second side length are respectively the sizes of two adjacent sides after the appearance of the target chart block is changed, and the target chart block comprises at least one object to be displayed.

Specifically, when the rendering of the target chart block is completed and displayed on the chart block display page, the user may perform a first operation on the target chart block, where the stretching operation may be an operation of changing the external dimension of the target chart block, may be an operation of making the external dimension of the target chart block larger, or may be an operation of making the external dimension of the target chart block smaller. After the user stretches the target chart block to change the outline dimension of the target chart block, the outline dimension of the target chart block after the stretching operation can be automatically obtained. Taking the outline of the target chart block as a rectangle as an example, the dimensions of two adjacent sides after the appearance of the target chart block is obtained may be recorded as a first side length and a second side length, the first side length may be the width dimension of the chart block after the stretching operation, the second side length may be the height dimension of the chart block after the stretching operation, and the target chart block may be any chart block displayed in a chart block display page.

For example, after the target chart block is rendered, the target chart block can be displayed on a chart block display page with a default outline size of 300px×200px, and at this time, a user can perform a stretching operation on the target chart block, and the dimensions of two adjacent sides of the target chart block after the stretching operation can be obtained as 500px and 300px, so that 500px and 300px can be the first side length and the second side length respectively.

S402: and if the first object to be displayed is a character, determining the smallest of the first side length and the second side length as a size basis, wherein the first object to be displayed is any one of the at least one object to be displayed.

Specifically, when rendering of the target chart block is completed, the method and the device can perform uniform configuration on the character sizes in the target chart block. For example, all characters in the target chart block may be configured as number 14. In the application, after the user performs the stretching operation on the target chart block, the character size in the target chart block can be automatically calculated according to the changed outline size of the target chart block. Wherein, the minimum size of the first side length and the second side length can be taken as the size basis.

For example, after the user performs the stretching operation on the target chart block, the dimensions of two adjacent sides of the target chart block after the stretching operation are 500px and 300px can be obtained, and then the smallest second side length 300px can be used as the dimension basis.

S403A: and when the ratio of the size according to the ratio preset contrast number is smaller than or equal to the preset word size, displaying the first object to be displayed in the updated appearance according to the first word size.

Specifically, when the determined size is smaller than or equal to the preset word size according to the ratio of the determined size to the preset reference number, the characters in the target chart block after the stretching operation can be displayed in the target chart block after the stretching operation with the first word size. The preset reference number may be 13, 14, 15 or other values, the preset reference number is illustrated as 15 in this application, the preset word number may be 11, 12, 13 or other values, the preset word number is illustrated as 12 in this application, the first word number may be a fixed value, for example, 10, 11, 12 or other values, or may be a variable value, and the first word number is illustrated as a fixed value 12 in this application.

For example, after the rendering of the target chart block is completed, the target chart block can be displayed on the chart block display page with the default external dimension of 300px×200px, at this time, the user can perform the stretching operation on the target chart block, the dimensions of two adjacent sides of the target chart block after the stretching operation can be obtained as 200px and 150px, the minimum dimension of 150px can be used as the dimension basis, at this time, the 150 can be divided by the preset comparison number of 15, the result can be obtained as 10, and since 10 is smaller than the preset word size of 12, the internal characters of the target chart block after the stretching operation can be changed from the default number of 14 to the number of 12.

S403B: when the ratio of the size basis to the preset comparison number is larger than the preset word size, displaying the first object to be displayed in the updated appearance according to a second word size; and the first word size is smaller than the second word size, and the updated appearance is the appearance of the target chart block after the appearance of the target chart block is changed.

Specifically, when the ratio of the determined size to the preset reference number is greater than the preset word size, the characters in the target chart block after the stretching operation can be displayed in the target chart block after the stretching operation with the second word size. The second word size may be a fixed number, such as 14, 15, 16 or other values, or may be a variable number, and the specific size is described as the second word size according to the ratio of the specific size to the preset reference number.

For example, after the rendering of the target chart block is completed, the target chart block can be displayed on the chart block display page with the default external dimension of 300px×200px, at this time, the user can perform the stretching operation on the target chart block, the sizes of two adjacent sides of the target chart block after the stretching operation can be obtained as 400px and 225px, the minimum size 225px can be used as the size basis, at this time, 225 can be divided by the preset comparison number 15, and the result can be obtained as 15, because 15 is larger than the preset word size 12, the internal characters of the target chart block after the stretching operation can be changed from the default number 14 to the number 15.

According to the method and the device, the dimensions of two adjacent edges of the appearance of the target chart block after the stretching operation can be obtained, the minimum edge length dimension is used as a dimension basis, then the ratio of the dimension basis to the preset comparison number is calculated, if the ratio is smaller than or equal to the preset word size, characters in the target chart block after the stretching operation can be displayed in the first word size, and if the ratio is larger than the preset word size, characters in the target chart block after the stretching operation can be displayed in the second word size. According to the method and the device, the character size in the target chart block after the stretching operation can be automatically calculated according to the obtained outline size of the target chart block after the stretching operation, so that the character size in the target chart block is matched with the outline size of the target chart block, a user does not need to independently configure the character size, the user only needs to carry out simple stretching operation on the target chart block, the character in the target chart block can change along with the outline size of the change of the target chart block, the character size matched with the outline of the change of the target chart block is intelligently displayed, the display mode is reasonable, and the operation is portable.

Optionally, after the user performs the stretching operation on the target chart block displayed on the chart block display page where the target chart block is located, the legend display in the target chart block may also perform a corresponding change according to the external dimension of the target chart block after the stretching operation, where the legend may be a symbol or a text interpretation made on the chart. Specifically, the width dimension of the chart block display page where the target chart block is located can be automatically obtained, after a user performs stretching operation on the target chart block displayed on the chart block display page, the width dimension of the target chart block after the stretching operation can be automatically obtained, and then the legend display in the target chart block can be determined according to the width dimension of the chart block display page where the target chart block is located and the width dimension of the target chart block after the stretching operation.

Specifically, when the number of legends to be displayed is greater than 1, if the ratio of the first side length to the total width is greater than or equal to the first ratio, the target chart block may display the legends to be displayed in full; if the ratio of the first side length to the total width is smaller than the first ratio, the target chart block can display part of objects in the legend to be displayed; the first side length may be a width dimension of the target chart block after the stretching operation, the total width may be a width dimension of a chart block display page where the target chart block is located, and the first proportion may be less than or equal to one third.

For example, the legend display may include three items, i.e., a maximum value, a minimum value and an average value, the width dimension of the chart block display page where the target chart block is located may be 1200px by default, the width dimension of the target chart block after the stretching operation may be 500px, and since the ratio of the width dimension of the target chart block after the stretching operation to the width dimension of the chart block display page where the target chart block is located is greater than one third, the three legends, i.e., the maximum value, the minimum value and the average value, may be all displayed on the right side of the chart. Referring to fig. 5, fig. 5 is a schematic diagram fully shown in an illustration provided in an embodiment of the present application, before a user performs a stretching operation on a target chart block, the illustration in the target chart block only shows a maximum value and a minimum value, when the external dimension of the target chart block becomes larger after the user performs the stretching operation on the target chart block, the width dimension after the change is greater than one third of the width dimension of a displayed page of the chart block where the target chart block is located, and at this time, the three illustrations of the maximum value, the minimum value and the average value can be fully shown on the right side of the chart.

Alternatively, when the number of legends to be displayed is greater than or equal to 2, if the ratio of the first side length to the total width is less than the second ratio, the number of legends to be displayed in the target chart block may be one less than the number of legends to be displayed, where the second ratio is a positive number less than the first ratio.

Alternatively, the second proportion may be one fourth, or may be another numerical value, for example, one fifth, which is not limited in this application, and the second proportion is exemplified as one fourth.

For example, the legend display may include three items of maximum value, minimum value and average value, the width dimension of the chart block display page where the target chart block is located may be 1200px by default, the width dimension of the target chart block after the stretching operation may be 280px, and since the ratio of the width dimension of the target chart block after the stretching operation to the width dimension of the chart block display page where the target chart block is located is less than one fourth, the legend of the average value may be removed, and the two items of maximum value and minimum value may be displayed on the right side of the chart. Referring to fig. 6, fig. 6 is a first schematic diagram shown in a legend portion provided in the embodiment of the present application, before a user performs a stretching operation on a target chart block, the target chart block shows all three legends including a maximum value, a minimum value and an average value, when the user performs a stretching operation on the target chart block, the external dimension of the target chart block becomes smaller, the changed width dimension is smaller than a quarter of the width dimension of a displayed page of the chart block where the target chart block is located, and at this time, the average value can be removed, and two legends including the maximum value and the minimum value are shown on the right side of the chart.

In the application, when the ratio of the width dimension of the target chart block after the stretching operation to the width dimension of the display page where the target chart block is located is smaller than the second ratio, the number of legends displayed in the target chart block after the stretching operation can be one less, so that the legends display can be adapted to the dimension of the target chart block.

Optionally, when the number of legends to be displayed is greater than or equal to 3, if the ratio of the first side length to the total width is less than the third ratio, the number of legends to be displayed in the target chart block may be two less than the number of legends to be displayed, where the third ratio is a positive number less than the second ratio.

Alternatively, the third ratio may be one sixth, or may be another value, such as one seventh, which is not limited in this application, and the third ratio is exemplified as one sixth.

For example, the legend display may include three items of maximum value, minimum value and average value, the width dimension of the chart block display page where the target chart block is located may be 1200px by default, the width dimension of the target chart block after the stretching operation may be obtained to be 180px, and since the ratio of the width dimension of the target chart block after the stretching operation to the width dimension of the chart block display page where the target chart block is located is less than one sixth, the two legends of the average value and the minimum value may be removed, and only the maximum value is shown on the right side of the chart. Referring to fig. 7, fig. 7 is a second schematic diagram shown in a legend portion provided in the embodiment of the present application, before a user performs a stretching operation on a target chart block, the legend of the target chart block shows two maximum values and minimum values, when the user performs a stretching operation on the target chart block, the external dimension of the target chart block becomes smaller, and the changed width dimension is smaller than one sixth of the width dimension of the chart block display page where the target chart block is located, and only one legend of the maximum value can be shown on the right side of the chart.

In the application, when the ratio of the width dimension of the target chart block after the stretching operation to the width dimension of the chart block display page where the target chart block is located is smaller than the third ratio, the number of legends displayed in the target chart block after the stretching operation can be reduced by two, so that the legends can be displayed to adapt to the dimension of the target chart block, the situation that the legends are displayed outside the target chart block after the width dimension of the target chart block is reduced is avoided, and the display mode of the target chart block is unreasonable.

Optionally, when the number of legends to be displayed is greater than or equal to 3, if the ratio of the first side length to the total width is smaller than the fourth ratio, the number of legends to be displayed in the target chart block may be two less than the number of legends to be displayed, or the legends to be displayed may be displayed in a direction changing manner, where the fourth ratio is a positive number smaller than the third ratio.

Alternatively, the fourth ratio may be one eighth, or may be another numerical value, such as one ninth, which is not limited in this application, and the fourth ratio is exemplified as one eighth.

For example, the legend display may include three items of maximum value, minimum value and average value, the width dimension of the chart block display page where the target chart block is located may be 1200px by default, the width dimension of the target chart block after the stretching operation may be obtained to be 100px, and since the ratio of the width dimension of the target chart block to the width dimension of the chart block display page where the target chart block is located after the stretching operation is less than one eighth, the two legends of the average value and the minimum value may be removed, and only the legend of the maximum value may be displayed on the right side of the chart, or all or part of the three legends of the maximum value, the minimum value and the average value may be displayed below the chart. Referring to fig. 8, fig. 8 is a third schematic diagram shown in a legend portion provided in the embodiment of the present application, before a user performs a stretching operation on a target chart block, the target chart block shows two legends of a maximum value and a minimum value, when the user performs a stretching operation on the target chart block, the overall dimension of the target chart block becomes smaller, and the width dimension after the change is smaller than one eighth of the width dimension of a displayed page of the chart block where the target chart block is located, at this time, only the legend of the maximum value is shown on the right side of the chart, and all the three legends of the maximum value, the minimum value and the average value can be shown below the chart.

In the application, when the ratio of the width dimension of the target chart block after the stretching operation to the width dimension of the chart block display page where the target chart block is located is smaller than the fourth ratio, the number of legends displayed in the target chart block after the stretching operation may be less than two, or all or part of the legends may be displayed in a direction changing manner, so that the legends display can be adapted to the dimension of the target chart block, and the content display of the target chart block is more reasonable.

Alternatively, when the number of legends displayed in the target chart block is reduced due to the change of the outline dimension of the target chart block, the remaining displayed legends can be clicked directly, the legends are displayed completely and possibly exceed the outline of the target chart block, and the legends can be retracted after clicking again.

Optionally, after the user performs the stretching operation on the target chart block, the chart size in the target chart block may also be changed correspondingly according to the external dimension of the stretched target chart block. Specifically, if the first object to be displayed is a chart, the application can obtain the original distance between the original chart in the target chart block and the original outline of the original chart, wherein the original chart is the chart in the target chart block before the outline of the target chart block changes, and the original outline is the outline of the target chart block before the outline of the target chart block changes; determining the updated size of the first object to be displayed according to the original distance, the first side length and the second side length; displaying a first object to be displayed in the updated appearance according to the updated size, wherein the distance between the first object to be displayed and the updated appearance is the same as the original distance; wherein the updated outline is the outline of the target chart block after the outline is changed.

Alternatively, the original spacing may be default or user-set. The present application does not limit this, and the original chart with the original pitch as default is illustrated by taking the upper edge of the original outline of the target chart block as 50px and the other edge as 20 px.

For example, referring to fig. 9, fig. 9 is a schematic diagram of a graph display provided in the embodiment of the present application, after the target graph block is rendered, the graph block display page may be displayed with a default outline size of 300px×200px, 300px×200px is the size of the original outline of the target graph block, at this time, the original distance of the original graph is obtained as the upper edge of the original outline of the target graph block is 50px, the other edge is 20px, the size of the original graph is 260px×130px, after the user performs the stretching operation on the target graph block, the size of the updated outline of the target graph block may be obtained as 500px×300px, because the distance between the updated graph and the updated outline of the target graph block is the same, the updated size of 460px×230px of the updated graph may be calculated, and the updated graph may be displayed in the target graph block after the stretching operation with this size.

Alternatively, the width dimension of the chart block display page may be default, for example, 1200px, or other values, or may be set by the user, which is not limited in this application, and 1200px with default width dimension is taken as an example. The user can stretch the width of the chart block display page, at this time, the updated width size of the chart block display page can be obtained, and then the display mode of the chart block can be calculated through the updated width size of the chart block display page.

For example, the chart blocks can be all displayed on the chart block display page with default dimensions of 300px×200px, at this time, the side intervals of two adjacent chart blocks in each row are 20px, when the width dimension of the chart block display page is 1200px, 3 chart blocks can be displayed in each row of the chart block display page, after the user performs the stretching operation on the width of the chart block display page, the updated width dimension of the chart block display page is 1400px, and at this time, 4 chart blocks can be displayed in each row of the chart block display page.

According to the method and the device, after the user stretching operation is performed, the updated width size of the chart block display page is obtained, the display mode of the chart block in the chart block display page can be calculated, the chart block can be automatically and adaptively displayed according to the width size of the chart block display page, and the intellectualization of chart block display is improved.

Optionally, the application, that is, the chart block configuration component, also provides a function of dragging the chart blocks, and the user can drag any chart block to move to a desired position on the chart block display page. Specifically, second operation information is acquired, wherein the second operation information is information of a second operation of changing the position of the target chart block, which is input by a user; based on the second operation information, recording an updated position of the target chart block, wherein the updated position is a position of the target chart block after the position of the target chart block is changed; and displaying the target chart block at the updated position. .

According to the method and the device, the drawing function of the chart block page chart block is provided, so that a user can draw the chart block to a proper position according to the self requirement, the requirement of the user on typesetting of the chart block can be met, and the display of the chart block display page is more flexible.

Optionally, after the user performs a drag operation on the chart block displayed in the chart block display page, the application may modify the location information in the block configuration information by using the acquired location information of the dragged chart block. Meanwhile, the application can send the modified chart block position information to the chart component through inter-component communication, and the application of the position information received by the chart component is not limited.

After all the required chart blocks are edited, a chart block display page comprising all the required chart blocks can be obtained. Referring to fig. 10, fig. 10 is a schematic diagram of a chart block display page according to an embodiment of the present application. The chart block display page in fig. 10 shows 5 chart blocks, and the sizes and positions of the chart blocks are configured.

After editing is completed, a user can click a save button of a chart block display page, and the chart block display page can send a request for collecting all configurations to the application, namely a chart block configuration component, through inter-component communication, at this time, the application can collect all block configuration information in all chart blocks, and can send a chart configuration collection request to the chart component through inter-component communication at the same time, wherein the chart configuration collection request is used for instructing the chart component to collect chart configuration information and SQL data query sentences of all chart blocks. After receiving the chart configuration collection request, the chart generation component and the code editor in the chart component can collect all chart configuration information and SQL data query sentences respectively, after the collection is completed, the chart component can send all chart configuration information and SQL data query sentences collected to the application through inter-component communication, at this time, the application can integrate all block configuration information, chart configuration information and SQL data query sentences into a JSON (JavaScript Object Notation, JS object numbered musical notation) file and send the JSON file to a chart block display page through inter-component communication, the chart block display page can automatically send the integrated JSON file to an upper component, and the upper component can be stored in any mode. The upper layer component may be a third party platform or a system such as a blockchain platform, a cloud platform, and the like, which is not limited in this application. After the storage is successful, the user can exit the chart block display page.

Alternatively, when there are too many chart blocks displayed on the chart block display page, a sliding scroll bar is required to scroll the chart block display page to find a specific chart block. In the application, when all the configurations are uploaded to the upper layer component, if a specific chart block is to be found, the upper layer component can perform selection operation on the directory interface of the upper layer component, and the upper layer component can directly jump to the display position of the specific chart block of the chart block display page from the directory interface of the upper layer component according to the position information of the chart block contained in the acquired block configuration information.

Specifically, third operation information is obtained, the third operation information is information of selection operation executed by a user on a target control in a catalog interface, the catalog interface at least comprises the target control corresponding to the target chart block, and based on the third operation information, a display page is jumped to a page where the target chart block is located according to an updating position so as to display the target chart block.

Optionally, the target control corresponding to the target chart block included in the catalog interface may be a drop-down selection frame of a specific area, or may be a selection frame arranged side by side, or the like, and the catalog interface may be a specific selection interface of the chart block, or may be another interface including selection of the chart block.

Optionally, when the upper layer component provides the configuration file, the application may parse the configuration file provided by the upper layer component, then may render the chart block according to the parsed configuration, and may display the rendered chart block on the chart block display page. Referring to fig. 11, fig. 11 is a schematic flow chart of rendering chart blocks according to an existing configuration according to an embodiment of the present application.

Firstly, a user accesses a chart block display page, at this time, the chart block display page can automatically send a request to an upper layer component, the request can be used for acquiring the existing chart block configuration file of the upper layer component, after the existing chart block configuration file provided by the upper layer component is acquired through inter-component communication, the acquired chart block configuration file can be resolved into block configuration information, chart configuration information and SQL data query sentences by the chart block configuration component, and then all chart configuration information can be provided to a chart generation component in the chart component through inter-component communication, and all SQL data query sentences are provided to a code editor in the chart component. The method and the device can initialize the chart block according to the block configuration information, render the chart block according to the position, the size, the title and other block configuration information in the block configuration information, display the rendered chart block on the chart block display page, and initialize the chart according to the received chart configuration information by the chart generation component, so that the empty chart is rendered and displayed in the chart block. According to the method and the device, batch data query can be initiated to the server based on all the parsed SQL data query sentences, then the queried data can be sent to the chart generation component through inter-component communication, the chart generation component can fill the received data into the blank chart to finish chart rendering, and after the data are sequentially filled, all chart blocks are rendered and displayed on the chart block display page. Optionally, the code editor may display the received SQL data query statement in a command input box in the data query area of the chart block editing page corresponding to each chart block, and the user may enter the corresponding chart block editing page by clicking on the chart block, and then view the data query area in the chart block editing page.

Optionally, after the chart block is rendered according to the configuration file provided by the upper layer component and is displayed on the chart block display page, a user may drag, stretch, and other operations on the chart block displayed on the chart block display page, or click the chart block to enter the chart block editing page to perform configuration modification, and the specific operation and the storage method are referred to above and are not described herein.

Optionally, when the upper layer has no chart block configuration file, the user may edit and display the chart block through the chart block generating method, which is not described herein.

It should be understood that the sequence number of each step in the foregoing embodiment does not mean that the execution sequence of each process should be determined by the function and the internal logic of each process, and should not limit the implementation process of the embodiment of the present application in any way.

Fig. 12 is a schematic diagram of a schematic diagram block display device according to an embodiment of the present application. Referring to fig. 12, the apparatus includes: front end modules and diagram block configuration components. Wherein the front-end module may display pages for the chart blocks described herein.

The chart block configuration component is used for acquiring a first side length and a second side length of the target chart block based on the first operation information, wherein the first side length and the second side length are respectively the sizes of two adjacent sides after the appearance of the target chart block changes, and the target chart block comprises at least one object to be displayed;

the chart block configuration component is further used for determining the smallest of the first side length and the second side length as a size basis when the first object to be displayed is a character, wherein the first object to be displayed is any one of the at least one object to be displayed;

the chart block configuration component is further used for displaying the first object to be displayed in the updated appearance according to the first word size when the ratio of the size according to the comparison preset comparison number is smaller than or equal to the preset word size;

the chart block configuration component is further used for displaying the first object to be displayed in the updated appearance according to a second word size when the ratio of the size according to the comparison preset comparison number is larger than the preset word size;

In some embodiments, when the number of the at least one object to be displayed is greater than 1, the chart block configuration component is further configured to display the at least one object to be displayed in full when the ratio of the first side length to the total width is greater than or equal to a first ratio; the method comprises the steps of,

In some embodiments, when the number of the at least one object to be displayed is greater than or equal to two, if the ratio of the first edge length to the total width is less than a second ratio, the number of the partial objects is one less than the number of the at least one object to be displayed, and the second ratio is a positive number less than the first ratio.

In some embodiments, when the number of the at least one object to be displayed is greater than or equal to three,

And if the ratio of the first side length to the total width is smaller than a fourth ratio, the number of the partial objects is smaller than the number of the at least one object to be displayed by two, the fourth ratio is a positive number smaller than the third ratio, and the chart block configuration component is further used for displaying the partial objects in the updated appearance along the direction of the second side length.

In some embodiments, when the first object to be displayed is a chart, the chart block configuration component is further configured to obtain an original distance between an original chart in the target chart block and an original outline, determine an updated size of the first object to be displayed according to the original distance, the first side length, and the second side length, and display the first object to be displayed in the updated outline according to the updated size;

In some embodiments, the chart block configuration component is further configured to receive second operation information, record an updated location of the target chart block based on the second operation information, and display the target chart block at the updated location;

According to the method and the device, after the target chart block is dragged and stretched by a user, the sizes of the elements in the target chart block can be automatically calculated, the sizes of the elements in the target chart block can be matched with the outline size of the target chart block, the display of the target chart block is more matched and harmonious, the user can watch the target chart block conveniently, and the user experience is improved.

In some embodiments, the chart block configuration component is further configured to obtain third operation information, where the third operation information is information of a selection operation performed on a target control by a user on a directory interface, and the directory interface at least includes a target control corresponding to the target chart block; and the display page is further used for jumping to the page where the target chart block is located according to the updating position based on the third operation information so as to display the target chart block.

Corresponding to the method for displaying a chart block described in the above embodiments, fig. 13 shows a schematic structural diagram of a chart block display device provided in the embodiment of the present application, and for convenience of explanation, only the portion related to the embodiment of the present application is shown.

Referring to fig. 13, the apparatus 1300 includes: an acquisition module 1310, a determination module 1320, and a display module 1330.

Acquisition module 1310: and the first operation information is used for acquiring first operation information which is input by a user and used for changing the outline dimension of the target chart block.

Acquisition module 1310: and the first side length and the second side length are respectively the sizes of two adjacent sides after the appearance of the target chart block is changed, and the target chart block comprises at least one object to be displayed.

Determination module 1320: and if the first object to be displayed is a character, determining the smallest of the first side length and the second side length as a size basis, wherein the first object to be displayed is any one of the at least one object to be displayed.

Display module 1330: the display device is used for displaying the first object to be displayed in the updated appearance according to a first word size when the ratio of the size according to the preset comparison number is smaller than or equal to the preset word size, and displaying the first object to be displayed in the updated appearance according to a second word size when the ratio of the size according to the preset comparison number is larger than the preset word size; and the first word size is smaller than the second word size, and the updated appearance is the appearance of the target chart block after the appearance of the target chart block is changed.

In some embodiments, the number of the at least one object to be displayed is greater than 1, and the display module 1330: and the method is also used for displaying the at least one object to be displayed in full quantity if the ratio of the first side length to the total width is larger than or equal to a first ratio.

In some embodiments, display module 1330: and the display device is further used for displaying part of the objects in the at least one object to be displayed if the ratio of the first edge length to the total width is smaller than a first ratio.

In some embodiments, the number of the at least one object to be displayed is greater than or equal to two, the display module 1330: and if the ratio of the first edge length to the total width is smaller than a second ratio, the number of the partial objects is one less than the number of the at least one object to be displayed, and the second ratio is a positive number smaller than the first ratio.

In some embodiments, the number of the at least one object to be displayed is greater than or equal to three, the display module 1330: and if the ratio of the first edge length to the total width is smaller than a third ratio, the number of the partial objects is smaller than the number of the at least one object to be displayed by two, and the third ratio is a positive number smaller than the second ratio.

In some embodiments, display module 1330: and if the ratio of the first edge length to the total width is smaller than a fourth ratio, the number of the partial objects is smaller than the number of the at least one object to be displayed by two, and the fourth ratio is a positive number smaller than the third ratio.

In some embodiments, display module 1330: and further for displaying the partial object in the updated outline along the direction of the second side length.

In some embodiments, the acquisition module 1310: and if the first object to be displayed is a chart, acquiring an original distance between an original chart in the target chart block and an original outline of the target chart block, wherein the original chart is a chart in the target chart block before the outline of the target chart block is changed, and the original outline is an outline of the target chart block before the outline of the target chart block is changed.

In some embodiments, the determination module 1320: and the updating size of the first object to be displayed is determined according to the original distance, the first side length and the second side length.

In some embodiments, display module 1330: and the display device is further used for displaying the first object to be displayed in the updated appearance according to the updated size, and the distance between the first object to be displayed and the updated appearance is the same as the original distance. And the updated appearance is the appearance of the target chart block after the appearance of the target chart block is changed.

In some embodiments, the acquisition module 1310: and the second operation information is information of a second operation input by a user and used for changing the position of the target chart block.

In some embodiments, the determination module 1320: and the updating position of the target chart block is recorded based on the second operation information, and the updating position is the position of the target chart block after the position of the target chart block is changed.

In some embodiments, display module 1330: and the updating module is also used for displaying the target chart block at the updating position.

In some embodiments, the acquisition module 1310: and the third operation information is information of a selection operation executed by a user on the target control in a catalog interface, and the catalog interface at least comprises the target control corresponding to the target chart block.

In some embodiments, the display module 1330 is further configured to skip a display page to a page where the target chart block is located according to the updated position based on the third operation information, so as to display the target chart block.

According to the method and the device, after the target chart block is dragged and stretched by a user, the sizes of the inner elements of the target chart block can be automatically calculated, the sizes of the inner elements of the target chart block can be matched with the external dimensions of the target chart block, the display of the target chart block is more harmonious, and the user can watch the target chart block conveniently.

The specific manner in which the apparatus 1300 performs the chart block display method and the resulting advantageous effects can be referred to in the related description of the method embodiments, and are not described herein.

The embodiment of the application also provides a computer device, which comprises: at least one processor, a memory, and a computer program stored in the memory and executable on the at least one processor, which when executed by the processor performs the steps of any of the various method embodiments described above.

Fig. 13 is a schematic structural diagram of a computer device according to an embodiment of the present application. As shown in fig. 13, the computer device 1400 includes: a processor 1410, a memory 1420, and a computer program 1430 stored in the memory 1420 and executable on the processor 1410, the processor 1410 implementing the steps in the chart block display method in the above embodiment when executing the computer program 1430.

The computer device 1400 may be a general purpose computer device or a special purpose computer device. In particular implementations, computer device 1400 may be a desktop, laptop, web server, palmtop, mobile handset, tablet, wireless terminal device, communication device, or embedded device, embodiments of the present application not being limited in type to computer device 1400. It will be appreciated by those skilled in the art that fig. 8 is merely an example of a computer device 1400 and is not intended to limit the computer device 1400, and may include more or fewer components than shown, or may combine certain components, or different components, such as may also include input-output devices, network access devices, etc.

The processor 1410 may be a central processing unit (Central Processing Unit, CPU), and the processor 1410 may also be other general purpose processors, digital signal processors (Digital Signal Processor, DSP), application specific integrated circuits (Application Specific Integrated Circuit, ASIC), off-the-shelf programmable gate arrays (Field-Programmable Gate Array, FPGA) or other programmable logic devices, discrete gate or transistor logic devices, discrete hardware components, or the like. The general purpose processor may be a microprocessor or may be any conventional processor.

Memory 1420 may be an internal storage unit of computer device 1400 in some embodiments, such as a hard disk or memory of computer device 1400. Memory 1420 may also be an external storage device of computer device 1400 in other embodiments, such as a plug-in hard disk, smart Media Card (SMC), secure Digital (SD) Card, flash Card (Flash Card), etc. provided on computer device 1400. Further, memory 1420 can include both internal and external storage units to computer device 1400. Memory 1420 is used to store an operating system, application programs, boot Loader (Boot Loader), data, and other programs, among others. Memory 1420 may also be used to temporarily store data that has been output or is to be output.

The present application also provides a computer readable storage medium storing a computer program which, when executed by a processor, implements the steps of the respective method embodiments described above.

The present application also provides a computer program product which, when run on a computer, causes the computer to perform the steps of the various method embodiments described above.

The integrated units, if implemented in the form of software functional units and sold or used as stand-alone products, may be stored in a computer readable storage medium. With such understanding, the present application implements all or part of the flow of the above-described method embodiments, and may be implemented by a computer program to instruct related hardware, where the computer program may be stored in a computer readable storage medium, and when the computer program is executed by a processor, may implement the steps of the above-described method embodiments. Wherein the computer program comprises computer program code which may be in the form of source code, object code, executable files or in some intermediate form, etc. The computer readable medium may include at least: any entity or device capable of carrying computer program code to a photographing apparatus/terminal device, recording medium, computer Memory, ROM (Read-Only Memory), RAM (Random Access Memory ), CD-ROM (Compact Disc Read-Only Memory), magnetic tape, floppy disk, optical data storage device, and so forth. The computer readable storage medium mentioned in the present application may be a non-volatile storage medium, in other words, a non-transitory storage medium.

It should be understood that all or part of the steps to implement the above-described embodiments may be implemented by software, hardware, firmware, or any combination thereof. When implemented in software, may be implemented in whole or in part in the form of a computer program product. The computer program product includes one or more computer instructions. The computer instructions may be stored in the computer-readable storage medium described above.

In the foregoing embodiments, the descriptions of the embodiments are emphasized, and in part, not described or illustrated in any particular embodiment, reference is made to the related descriptions of other embodiments.

Those of ordinary skill in the art will appreciate that the various illustrative elements and algorithm steps described in connection with the embodiments disclosed herein may be implemented as electronic hardware, or combinations of computer software and electronic hardware. Whether such functionality is implemented as hardware or software depends upon the particular application and design constraints imposed on the solution. Skilled artisans may implement the described functionality in varying ways for each particular application, but such implementation decisions should not be interpreted as causing a departure from the scope of the present application.

In the embodiments provided in this application, it should be understood that the disclosed apparatus/computer device and method may be implemented in other ways. For example, the apparatus/computer device embodiments described above are merely illustrative, e.g., the division of modules or units is merely a logical functional division, and there may be additional divisions when actually implemented, e.g., multiple units or components may be combined or integrated into another system, or some features may be omitted or not performed. Alternatively, the coupling or direct coupling or communication connection shown or discussed may be an indirect coupling or communication connection via interfaces, devices or units, which may be in electrical, mechanical or other forms.

The units described as separate units may or may not be physically separate, and units shown as units may or may not be physical units, may be located in one place, or may be distributed over a plurality of network units. Some or all of the units may be selected according to actual needs to achieve the purpose of the solution of this embodiment.

The above embodiments are only for illustrating the technical solution of the present application, and are not limiting; although the present application has been described in detail with reference to the foregoing embodiments, it should be understood by those of ordinary skill in the art that: the technical scheme described in the foregoing embodiments can be modified or some technical features thereof can be replaced by equivalents; such modifications and substitutions do not depart from the spirit and scope of the technical solutions of the embodiments of the present application, and are intended to be included in the scope of the present application.

Claims

1. A chart block display method, characterized in that the method comprises:

2. The method of claim 1, wherein the number of the at least one object to be displayed is greater than 1, the method further comprising:

3. The method of claim 2, wherein the number of the at least one object to be displayed is greater than or equal to two, and the number of the partial objects is one less than the number of the at least one object to be displayed if the ratio of the first edge length to the total width is less than a second ratio, the second ratio being a positive number less than the first ratio.

4. The method of claim 2, wherein the number of the at least one object to be displayed is greater than or equal to three;

5. The method according to claim 1, wherein the method further comprises:

6. The method according to claim 1, wherein the method further comprises:

and displaying the target chart block at the updated position.

7. The method of claim 6, wherein the method further comprises:

8. A chart block display device, comprising a front end module and a chart block configuration component:

9. The apparatus of claim 8, wherein the number of the at least one object to be displayed is greater than 1, and wherein the chart block configuration component is further configured to display the at least one object to be displayed in full when the ratio of the first side length to the total width is greater than or equal to a first ratio; the method comprises the steps of,

10. The apparatus of claim 8, wherein the chart block configuration component is further configured to, when the first object to be displayed is a chart, obtain an original distance from an original outline of an original chart in the target chart block, determine an updated size of the first object to be displayed according to the original distance, the first side length, and the second side length, and display the first object to be displayed in the updated outline according to the updated size;

11. The apparatus of claim 8, wherein the chart block configuration component is further configured to receive second operational information and record an updated location of the target chart block based on the second operational information and display the target chart block at the updated location;

12. A computer device comprising a memory, a processor and a computer program stored in the memory and executable on the processor, characterized in that the processor implements the method according to any of claims 1 to 7 when executing the computer program.

13. A computer readable storage medium storing a computer program, characterized in that the computer program when executed by a processor implements the method according to any one of claims 1 to 7.