CN109284461A - A kind of webpage autoplacement method and device based on WEB - Google Patents
A kind of webpage autoplacement method and device based on WEB Download PDFInfo
- Publication number
- CN109284461A CN109284461A CN201811298057.9A CN201811298057A CN109284461A CN 109284461 A CN109284461 A CN 109284461A CN 201811298057 A CN201811298057 A CN 201811298057A CN 109284461 A CN109284461 A CN 109284461A
- Authority
- CN
- China
- Prior art keywords
- chart
- priority
- webpage
- subregion
- layout
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Pending
Links
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F9/00—Arrangements for program control, e.g. control units
- G06F9/06—Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
- G06F9/44—Arrangements for executing specific programs
- G06F9/451—Execution arrangements for user interfaces
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F40/00—Handling natural language data
- G06F40/10—Text processing
- G06F40/189—Automatic justification
-
- Y—GENERAL TAGGING OF NEW TECHNOLOGICAL DEVELOPMENTS; GENERAL TAGGING OF CROSS-SECTIONAL TECHNOLOGIES SPANNING OVER SEVERAL SECTIONS OF THE IPC; TECHNICAL SUBJECTS COVERED BY FORMER USPC CROSS-REFERENCE ART COLLECTIONS [XRACs] AND DIGESTS
- Y02—TECHNOLOGIES OR APPLICATIONS FOR MITIGATION OR ADAPTATION AGAINST CLIMATE CHANGE
- Y02D—CLIMATE CHANGE MITIGATION TECHNOLOGIES IN INFORMATION AND COMMUNICATION TECHNOLOGIES [ICT], I.E. INFORMATION AND COMMUNICATION TECHNOLOGIES AIMING AT THE REDUCTION OF THEIR OWN ENERGY USE
- Y02D10/00—Energy efficient computing, e.g. low power processors, power management or thermal management
Landscapes
- Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- Software Systems (AREA)
- Physics & Mathematics (AREA)
- General Engineering & Computer Science (AREA)
- General Physics & Mathematics (AREA)
- Computational Linguistics (AREA)
- General Health & Medical Sciences (AREA)
- Health & Medical Sciences (AREA)
- Audiology, Speech & Language Pathology (AREA)
- Human Computer Interaction (AREA)
- Artificial Intelligence (AREA)
- Information Transfer Between Computers (AREA)
Abstract
The present embodiments relate to webpage front-end design fields, specifically, it is related to a kind of webpage autoplacement method and device based on WEB, this method is applied to the client connecting with server communication, this method comprises: obtaining multiple charts from the server and counting the quantity of the multiple chart, detect whether the instruction input for realizing autoplacement, when detecting the instruction input success for realizing autoplacement, the multiple chart is laid out on a webpage according to the quantity, obtains the webpage of a completion chart layout.It so, it is possible to realize automatic, intelligent distribution of the chart in webpage, operation is simple, saves time and efforts.
Description
Technical field
The present embodiments relate to webpage front-end design fields, certainly in particular to a kind of page based on WEB
Dynamic layout method and device.
Background technique
In the Front-end Design of WEB webpage, the layout of chart can be related to.Succinctly, page layout neatly can be certain
Attract potential customers in degree, therefore, being laid out to WEB webpage is particularly important.The content that can show in WEB webpage
It is various, wherein as most intuitively information display format, chart sizable specific gravity can be occupied in WEB webpage, therefore, such as
The layout layout that chart is where carried out in WEB webpage becomes the emphasis of webpage front-end design.It is existing in WEB webpage to chart
The method for carrying out layout layout is mostly cumbersome, takes a substantial amount of time and energy.
Summary of the invention
In view of this, the present invention provides a kind of webpage autoplacement method and device based on WEB, can be realized chart
Automatic, intelligent distribution in webpage, operation is simple, saves time and efforts.
The embodiment of the invention provides a kind of webpage autoplacement method based on WEB, is applied to and server communication connects
The client connect, which comprises
Multiple charts are obtained from the server and count the quantity of the multiple chart；
The instruction input for realizing autoplacement is detected whether, when detecting the instruction for realizing autoplacement
When inputting successfully, the multiple chart is laid out according to the quantity on a webpage, obtains a completion chart layout
Webpage.
Optionally, the quantity is n, is laid out the multiple chart on a webpage according to the quantity, is obtained
The step of webpage of one completion chart layout, comprising:
If n is odd number, statistics priority is the quantity summation m of the chart of the first priority or the second priority；Wherein, it rolls over
The priority of line chart is defined as the first priority, and abscissa quantity is more than that the priority of the chart of setting value is defined as second preferentially
Grade；
If m=0, divide the webpage into n+1 sub-regions, according to the size of the subregion to each chart into
The chart is placed in a subregion, obtains a completion chart by row size adjusting for each chart for completing size adjusting
The webpage of layout；
If m=1, n+1 sub-regions are divided the webpage into, are that the first priority or second are preferential by the priority
Any one subregion for being placed in n+1 sub-regions of chart of grade is simultaneously paved with the subregion and is expert at；According to the sub-district
The size in domain carries out size adjusting to other n-1 chart, the chart correspondence that other n-m is completed size adjusting is placed in surplus
Remaining n-1 sub-regions obtain the webpage of a completion chart layout；
If m > 1, n+1+m sub-regions are divided the webpage into, are respectively that the first priority or second are excellent by priority
Any one subregion that the chart of first grade is placed in n+1+m sub-regions is simultaneously paved with the subregion and is expert at, wherein each
Priority is not gone together for the chart of the first priority or the second priority；Other n-m is schemed according to the size of the subregion
Table carries out size adjusting, and the chart correspondence that other n-m is completed size adjusting is placed in remaining n+1 sub-regions, is obtained
The webpage of one completion chart layout.
Optionally, the quantity is n, is laid out the multiple chart on a webpage according to the quantity, is obtained
The step of webpage of one completion chart layout, comprising:
If n is even number, n sub-regions are divided the webpage into；
Size adjusting is carried out to each chart according to the size of the subregion；
For each chart for completing size adjusting, which is placed in a subregion, obtains a completion chart cloth
The webpage of office.
Optionally, the method also includes:
Obtain the dragging instruction for the chart in the webpage for completing chart layout；Wherein, dragged chart definition
For object diagram；
It is instructed according to the dragging and the object diagram is drawn to specified subregion；
Whether the priority for judging the object diagram is the first priority or the second priority, if the priority is institute
The first priority or second priority are stated, the object diagram is paved with being expert at for the specified subregion, if described
Priority is neither first priority nor is second priority, and the object diagram is placed in the specified son
Region；Wherein, the priority of line chart is defined as the first priority, and abscissa quantity is more than that the priority of the chart of setting value is fixed
Justice is the second priority.
Optionally, the method also includes:
It obtains the modification for modifying the setting value to instruct, the setting value is repaired according to modification instruction
Change.
The embodiment of the invention also provides a kind of webpage autoplacement device based on WEB, is applied to and server communication
The client of connection, described device include:
Chart obtains module, for obtaining multiple charts from the server and counting the quantity of the multiple chart；
Page layout module is used for for detecting whether there is the instruction input for realizing autoplacement when having detected
When realizing the instruction input success of autoplacement, the multiple chart is laid out on a webpage according to the quantity, is obtained
Obtain the webpage of a completion chart layout.
Optionally, the quantity is n, and the page layout module is according to the quantity by the multiple chart in a webpage
On be laid out, obtain one completion chart layout webpage, specifically include:
If n is odd number, statistics priority is the quantity summation m of the chart of the first priority or the second priority；Wherein, it rolls over
The priority of line chart is defined as the first priority, and abscissa quantity is more than that the priority of the chart of setting value is defined as second preferentially
Grade；
If m=0, divide the webpage into n+1 sub-regions, according to the size of the subregion to each chart into
The chart is placed in a subregion, obtains a completion chart by row size adjusting for each chart for completing size adjusting
The webpage of layout；
If m=1, n+1 sub-regions are divided the webpage into, are that the first priority or second are preferential by the priority
Any one subregion for being placed in n+1 sub-regions of chart of grade is simultaneously paved with the subregion and is expert at；According to the sub-district
The size in domain carries out size adjusting to other n-1 chart, the chart correspondence that other n-m is completed size adjusting is placed in surplus
Remaining n-1 sub-regions obtain the webpage of a completion chart layout；
If m > 1, n+1+m sub-regions are divided the webpage into, are respectively that the first priority or second are excellent by priority
Any one subregion that the chart of first grade is placed in n+1+m sub-regions is simultaneously paved with the subregion and is expert at, wherein each
Priority is not gone together for the chart of the first priority or the second priority；Other n-m is schemed according to the size of the subregion
Table carries out size adjusting, and the chart correspondence that other n-m is completed size adjusting is placed in remaining n+1 sub-regions, is obtained
The webpage of one completion chart layout.
Optionally, the quantity is n, and the page layout module is according to the quantity by the multiple chart in a webpage
On be laid out, obtain one completion chart layout webpage
If n is even number, n sub-regions are divided the webpage into；
Size adjusting is carried out to each chart according to the size of the subregion；
For each chart for completing size adjusting, which is placed in a subregion, obtains a completion chart cloth
The webpage of office.
Optionally, the page layout module is also used to:
Obtain the dragging instruction for the chart in the webpage for completing chart layout；Wherein, dragged chart definition
For object diagram；
It is instructed according to the dragging and the object diagram is drawn to specified subregion；
Whether the priority for judging the object diagram is the first priority or the second priority, if the priority is institute
The first priority or second priority are stated, the object diagram is paved with being expert at for the specified subregion, if described
Priority is neither first priority nor is second priority, and the object diagram is placed in the specified son
Region；Wherein, the priority of line chart is defined as the first priority, and abscissa quantity is more than that the priority of the chart of setting value is fixed
Justice is the second priority.
Optionally, the page layout module is also used to:
It obtains the modification for modifying the setting value to instruct, the setting value is repaired according to modification instruction
Change.The embodiment of the invention also provides a kind of electronic equipment, including memory, processor and storage are on a memory and can be
The computer program run on processor, the processor realize above-mentioned webpage autoplacement when executing the computer program
Method.
The embodiment of the invention also provides a kind of computer readable storage medium, the readable storage medium storing program for executing includes computer
Program, the electronic equipment computer program controls the readable storage medium storing program for executing when running where execute the automatic cloth of above-mentioned webpage
Office's method.
Beneficial effect
Webpage autoplacement method and device provided in an embodiment of the present invention, can be according to the quantity of chart by multiple charts
Autoplacement is carried out on webpage, operation is simple, without manually being pulled and being amplified manually, saves plenty of time and essence
Power.
Further, it is analyzed by the parity to chart quantity, and combines the priority of chart to each chart
Position and scaling be adjusted, can guarantee the best image form of the chart of different priorities, entire analytic process is by visitor
Family end executes, and without human intervention, saves time and efforts, also achieves the intelligent layout of chart.
Further, the chart in the webpage being laid out can also be adjusted and is simply pulled, adjusted and dragging
When dragging, client also can select suitable display format to be shown according to the priority of dragged chart, improve webpage certainly
The flexibility of dynamic layout.
Detailed description of the invention
In order to illustrate the technical solution of the embodiments of the present invention more clearly, below will be to needed in the embodiment attached
Figure is briefly described, it should be understood that the following drawings illustrates only certain embodiments of the present invention, therefore is not construed as pair
The restriction of range for those of ordinary skill in the art without creative efforts, can also be according to this
A little attached drawings obtain other relevant attached drawings.
Fig. 1 is the block diagram of a kind of electronic equipment 10 provided by the embodiment of the present invention.
Fig. 2 is a kind of flow chart of webpage autoplacement method provided by the embodiment of the present invention.
Fig. 3 is the schematic diagram for the sub-step that step S23 shown in Fig. 2 includes in an embodiment.
Fig. 4 is a kind of first schematic diagram of webpage autoplacement provided by the embodiment of the present invention.
Fig. 5 is a kind of second schematic diagram of webpage autoplacement provided by the embodiment of the present invention.
Fig. 6 is a kind of third schematic diagram of webpage autoplacement provided by the embodiment of the present invention.
Fig. 7 is the schematic diagram for another sub-step that step S23 shown in Fig. 2 includes in an embodiment.
Fig. 8 is a kind of 4th schematic diagram of webpage autoplacement provided by the embodiment of the present invention.
Fig. 9 is a kind of 5th schematic diagram of webpage autoplacement provided by the embodiment of the present invention.
Figure 10 is a kind of 6th schematic diagram of webpage autoplacement provided by the embodiment of the present invention.
Figure 11 is a kind of module frame chart of webpage autoplacement device 20 provided by the embodiment of the present invention.
Icon:
10- electronic equipment；11- memory；12- processor；13- network module；
20- webpage autoplacement device；21- chart obtains module；22- page layout module.
Specific embodiment
In order to make the object, technical scheme and advantages of the embodiment of the invention clearer, below in conjunction with the embodiment of the present invention
In attached drawing, technical scheme in the embodiment of the invention is clearly and completely described, it is clear that described embodiment only
It is a part of the embodiments of the present invention, instead of all the embodiments.The present invention being usually described and illustrated herein in the accompanying drawings
The component of embodiment can be arranged and be designed with a variety of different configurations.
Therefore, the detailed description of the embodiment of the present invention provided in the accompanying drawings is not intended to limit below claimed
The scope of the present invention, but be merely representative of selected embodiment of the invention.Based on the embodiments of the present invention, this field is common
Technical staff's every other embodiment obtained without creative efforts belongs to the model that the present invention protects
It encloses.
It should also be noted that similar label and letter indicate similar terms in following attached drawing, therefore, once a certain Xiang Yi
It is defined in a attached drawing, does not then need that it is further defined and explained in subsequent attached drawing.
Inventor further investigation reveals that, it is existing in webpage to chart carry out layout layout method mostly it is cumbersome,
It takes a substantial amount of time and energy.For example, the prior art mostly uses greatly manual operation, technical staff will scheme according to the size of webpage
Table zooms in and out, and is then drawn on webpage and is laid out layout, and this mode efficiency is lower, and it is a large amount of to occupy staff
Time and efforts.
Defect present in the above scheme in the prior art, is that inventor is obtaining after practicing and carefully studying
As a result, therefore, the solution that the discovery procedure of the above problem and the hereinafter embodiment of the present invention are proposed regarding to the issue above
Scheme all should be the contribution that inventor makes the present invention in process of the present invention.
Based on the studies above, the embodiment of the invention provides a kind of webpage autoplacement method and devices, can be realized figure
Automatic, intelligent distribution of the table in webpage, operation is simple, saves time and efforts.
Fig. 1 shows the block diagram of a kind of electronic equipment 10 provided by the embodiment of the present invention.The embodiment of the present invention
In electronic equipment 10 can for data storage, transmission, processing function server-side, as shown in Figure 1, electronic equipment 10 wrap
It includes: memory 11, processor 12, network module 13 and webpage autoplacement device 20.
It is directly or indirectly electrically connected between memory 11, processor 12 and network module 13, to realize the biography of data
Defeated or interaction.It is electrically connected for example, these elements can be realized from each other by one or more communication bus or signal wire.
Webpage autoplacement device 20 is stored in memory 11, the webpage autoplacement device 20 includes at least one can be with software
Or the form of firmware (firmware) is stored in the software function module in the memory 11, the processor 12 passes through operation
The webpage autoplacement device 20 being stored in the software program and module, such as the embodiment of the present invention in memory 11, from
And perform various functions application and data processing, that is, realize the webpage autoplacement method in the embodiment of the present invention.
Wherein, the memory 11 may be, but not limited to, random access memory (Random Access Memory,
RAM), read-only memory (Read Only Memory, ROM), programmable read only memory (Programmable Read-Only
Memory, PROM), erasable read-only memory (Erasable Programmable Read-Only Memory, EPROM),
Electricallyerasable ROM (EEROM) (Electric Erasable Programmable Read-Only Memory, EEPROM) etc..
Wherein, memory 11 is for storing program, and the processor 12 executes described program after receiving and executing instruction.
The processor 12 may be a kind of IC chip, the processing capacity with data.Above-mentioned processor 12
It can be general processor, including central processing unit (Central Processing Unit, CPU), network processing unit
(Network Processor, NP) etc..It may be implemented or execute each method, step disclosed in the embodiment of the present invention and patrol
Collect block diagram.General processor can be microprocessor or the processor is also possible to any conventional processor etc..
Network module 13 is used to establish the communication connection between electronic equipment 10 and other communication terminal devices by network,
Realize the transmitting-receiving operation of network signal and data.Above-mentioned network signal may include wireless signal or wire signal.
It is appreciated that structure shown in FIG. 1 is only to illustrate, electronic equipment 10 may also include it is more than shown in Fig. 1 or
Less component, or with the configuration different from shown in Fig. 1.Each component shown in Fig. 1 can using hardware, software or its
Combination is realized.
The embodiment of the present invention also provides a kind of computer readable storage medium, and the readable storage medium storing program for executing includes computer journey
Sequence.Electronic equipment 10 computer program controls the readable storage medium storing program for executing when running where executes the automatic cloth of following webpage
Office's method.
Fig. 2 shows a kind of flow charts of webpage autoplacement method provided by the embodiment of the present invention.The method has
Method and step defined in the process of pass is applied to electronic equipment 10, can be realized by the processor 12.Wherein, which sets
Standby 10 can be understood as client, which connect with a server communication, below will be to detailed process shown in Fig. 2
It is described in detail:
Step S21 obtains multiple charts from server and counts the quantity n of multiple charts.
It is communicated to connect between client and server, is able to carry out data interaction, for example, client can be from server tune
With multiple charts, the quantity of multiple charts is then counted.In the present embodiment, the quantity of multiple charts is defined as n.
Step S22 detects whether the instruction input for realizing autoplacement.
In the present embodiment, the instruction of autoplacement can be triggered by mouse or other equipment.For example, the client
Display screen can be provided with external access of mouse, client, the button realization that technical staff can be clicked by mouse in display screen refers to
The input of order can also realize the input of instruction by the button in the display screen of contact.
If the instruction input success that client detects for realizing autoplacement, turns to step S23.
If the instruction input success that client does not detect for realizing autoplacement, does not execute any operation.
Multiple charts are laid out by step S23 according to quantity n on a webpage, obtain a completion chart layout
Webpage.
It is appreciated that the instruction input for realizing autoplacement is " one-touch ", that is to say, that when client detects
When instruction input success, it will be able to start autoplacement process of the chart on webpage.
Fig. 3 is please referred to, is enumerated in the present embodiment by step S231, step S232, step S233 and step S234
One of implementation of step S23.
Step S231, if n is odd number, statistics priority is the quantity summation of the chart of the first priority and the second priority
m。
It is appreciated that sub-step shown in Fig. 3 is accounted for by the case where odd number of n.
The emphasis of the wide variety of chart, the expressed information out of the chart of each type is not also identical, therefore, no
All charts can mechanically be carried out being laid out in webpage, it should the type for fully considering each chart, then according to figure
The type selection of table is best able to the display mode of reflection chart-information.
In the present embodiment, can different priority be set, according to the type of chart to provide reference for page layout.
It is more than the chart of setting value by abscissa for example, the priority for the chart that type is line chart is defined as the first priority
Priority is defined as the second priority.It is appreciated that the chart of the first priority and the second priority needs the lateral face occupied
Product is larger, therefore, needs to fully consider the horizontal area accounting of these charts in page layout.Optionally, client can be with
It modifies to setting value, for example, the modification obtained for modifying setting value instructs, setting value is repaired according to modification instruction
Change.
Webpage is divided into n+1 sub-regions if m=0 by step S232, is carried out according to the size of subregion to each chart
The chart is placed in a subregion, obtains a completion chart cloth by size adjusting for each chart for completing size adjusting
The webpage of office.
Specifically, if at this time can divide webpage there is no the chart of the first priority or the second priority in n chart
For n+1 sub-regions.It should be appreciated that as shown in figure 4, the development length in webpage X-direction is limited, but in the Y direction can be with
Unlimited to extend, X-direction and Y-direction are orthogonal, when dividing subregion, should be divided according to ratio appropriate, for example,
The dimension scale of each subregion can be (16:10).According to the dimension scale of (16:10) to each chart in n chart
Size adjusting is carried out, is then placed in each subregion again, as shown in figure 4, being placed with a chart in each subregion.
In another example taking n is 5, then subregion has 6, and subregion A1 places chart F1, subregion A2 and places chart F2, son
Region A3 places chart F3, subregion A4 placement chart F4, subregion A5 places chart F5, subregion A6 and leaves unused.
It is appreciated that since the priority of n chart is not the first priority or the second priority, (16:
10) content in chart can be shown well, do not need to make any adjustments.
Webpage is divided into n+1 sub-regions if m=1 by step S233, is that the first priority or second are excellent by priority
Any one subregion that the chart of first grade is placed in n+1 sub-regions is simultaneously paved with the subregion and is expert at, according to the son
The size in region carries out size adjusting to other n-1 chart, and the chart correspondence that other n-m is completed size adjusting is placed in
Remaining n-1 sub-regions obtain the webpage of a completion chart layout.
Taking n is 5, then webpage is divided into 6 sub-regions A1, A2, A3, A4, A5 and A6.Chart F1, F2, F3, F4 and F5
In, F3 is line chart.
By any one subregion that F3 is placed in A1, A2, A3, A4, A5 and A6 subregion and it is paved with the subregion institute
It is expert at, for example, F3 is placed in A1, and is paved with A1 and is expert at and (is paved with A1 and A2), it will be understood that the size of F3 is at this time
(32:10) so, it is possible the trend trend for being well reflected line chart.
Further, F1, F2, F4 and F5 are adjusted according to the size of (16:10), are then placed in A3, A4, A5 again
In A6, wherein F1, F2, F4 and F5 randomly place the signal for completing page layout in this case in A3, A4, A5 and A6
Figure is as shown in Figure 5.
Webpage is divided into n+1+m sub-regions if m > 1 by step S234, is respectively the first priority or the by priority
Any one subregion that the chart of two priority is placed in n+1+m sub-regions is simultaneously paved with the subregion and is expert at, according to
The size of subregion carries out size adjusting to other n-m chart, other n-m is completed the corresponding placement of chart of size adjusting
In remaining n+1 sub-regions, the webpage of a completion chart layout is obtained.
It is appreciated that each priority is not gone together for the chart of the first priority or the second priority.
N=7, m=2 are taken, then webpage is divided into 10 sub-regions A1~A10.In chart F1~F7, F3 is line chart,
F6 is the histogram that abscissa is more than setting value.
It is expert at and (is paved with A5 and A6) in another example F3 is placed in A5 and is paved with A5, F6 is placed in A8 and is paved with A8
It is expert at and (is paved with A7 and A8), it will be understood that the size of F3 and F6 is (32:10) at this time, so, it is possible to be well reflected
The information for including in chart.
Further, F1, F2, F4, F5 and F7 are adjusted according to the size of (16:10), be then placed in again A1,
In A2, A3, A4, A9 and A10, wherein F1, F2, F4, F5 and F7 are randomly placed in A1, A2, A3, A4, A9 and A10, complete this
The schematic diagram of page layout in the case of kind is as shown in Figure 6.
It is appreciated that the layout of the chart of the first priority and the second priority can be paid the utmost attention to when n is odd number, this
Sample can guarantee the tidiness of entire webpage, can also guarantee that the chart of the first priority and the second priority can sufficiently reflect
The information profile for being included out can preferably analytic trend move towards for example, line chart is paved with a line, and abscissa is more
Histogram be paved with a line, can be avoided between multiple abscissas that space is too small to cause display difficult, so, it is possible to realize in net
The intelligence of layout layout chart in page.
Fig. 7 is please referred to, is enumerated in the present embodiment by step S235, step S236, step S237 and step S238
Another implementation of step S23.
It is appreciated that sub-step shown in Fig. 7 is accounted for by the case where even number of n.
Webpage is divided into n sub-regions by step S235.
Step S236 carries out size adjusting to each chart according to the size of subregion.
In the present embodiment, the size of subregion can be (16:10)
The chart is placed in a subregion, acquisition one is complete for each chart for completing size adjusting by step S237
At the webpage of chart layout.
For example, n=4 is taken, as shown in figure 8, subregion is A1, A2, A3 and A4.By complete size adjusting chart F1, F2,
F3 and F4 are randomly placed in A1, A2, A3 and A4.
Step S238 obtains the dragging instruction for the chart in the webpage for completing chart layout, instructs according to pulling
Object diagram is drawn to specified subregion and is shown.
It is appreciated that, for the cleaning of the page, simplifying the treatment process of client when n is even number, scheming
Table not will do it the judgement of priority before being placed in subregion, that is to say, that the either column of line chart or more abscissas
Shape figure all carries out size adjusting together with (16:10), is then placed in subregion.
But the histogram of line chart and more abscissas may be shown due to size it is unclear, it is therefore desirable to broken line
Figure or histogram carry out secondary adjustment.
Please continue to refer to Fig. 8, it is placed in subregion A1 in chart F1, subregion A2 and is placed with chart F2, subregion A3
In be placed in chart F3, subregion A4 and be placed with chart F4.It obtains the dragging to F2 to instruct, F2 is dragged to A3, correspondingly,
F3 and F4 towards Y-direction along move a line, at this time subregion increase be 6, further, client judge F2 priority whether
F2 is paved with where A3 if the priority of F2 is the first priority or the second priority for the first priority or the second priority
Row (being paved with A3 and A4), as shown in figure 9, if the priority of F2 is neither the first priority nor is the second priority, directly
F2 is placed in A3, as shown in Figure 10.It so, it is possible flexible, the intelligent distribution of realization webpage.
It is appreciated that the webpage autoplacement method does not need manually to carry out above the average age for marriage manual dragging and scaling, Neng Gougen
Autoplacement is carried out according to the number amount and type of chart, and then realizes the intelligence of page layout, improves the flexibility of page layout.
On the basis of the above, as shown in figure 11, described the embodiment of the invention provides a kind of webpage autoplacement device 20
Webpage autoplacement device 20 includes: that chart obtains module 21 and page layout module 22.
Chart obtains module 21, for obtaining multiple charts from the server and counting the quantity of the multiple chart；
Since chart acquisition module 21 is similar with the realization principle of step S21 in Fig. 2, do not illustrate more herein.
Page layout module 22, for detecting whether have the instruction input for realizing autoplacement, it is useful when detecting
When realizing the instruction input success of autoplacement, the multiple chart is laid out on a webpage according to the quantity,
Obtain the webpage of a completion chart layout.
Since page layout module 22 is similar with the realization principle of step S22 in Fig. 2, do not illustrate more herein.
To sum up, a kind of webpage autoplacement method and device based on WEB provided by the embodiment of the present invention, can be realized
Automatic, intelligent distribution of the chart in webpage, operation is simple, saves time and efforts.
In several embodiments provided by the embodiment of the present invention, it should be understood that disclosed device and method, it can also
To realize by another way.Device and method embodiment described above is only schematical, for example, in attached drawing
Flow chart and block diagram show that the devices of multiple embodiments according to the present invention, method and computer program product are able to achieve
Architecture, function and operation.In this regard, each box in flowchart or block diagram can represent module, a program
A part of section or code, a part of the module, section or code include that one or more is patrolled for realizing defined
Collect the executable instruction of function.It should also be noted that in some implementations as replacement, function marked in the box
It can occur in a different order than that indicated in the drawings.For example, two continuous boxes can actually be held substantially in parallel
Row, they can also be executed in the opposite order sometimes, and this depends on the function involved.It is also noted that block diagram and/or
The combination of each box in flow chart and the box in block diagram and or flow chart, can the function as defined in executing or dynamic
The dedicated hardware based system made is realized, or can be realized using a combination of dedicated hardware and computer instructions.
In addition, each functional module in each embodiment of the present invention can integrate one independent portion of formation together
Point, it is also possible to modules individualism, an independent part can also be integrated to form with two or more modules.
It, can be with if the function is realized and when sold or used as an independent product in the form of software function module
It is stored in a computer readable storage medium.Based on this understanding, technical solution of the present invention is substantially in other words
The part of the part that contributes to existing technology or the technical solution can be embodied in the form of software products, the meter
Calculation machine software product is stored in a storage medium, including some instructions are used so that a computer equipment (can be a
People's computer, electronic equipment 10 or the network equipment etc.) execute all or part of step of each embodiment the method for the present invention
Suddenly.And storage medium above-mentioned includes: USB flash disk, mobile hard disk, read-only memory (ROM, Read-Only Memory), deposits at random
The various media that can store program code such as access to memory (RAM, Random Access Memory), magnetic or disk.
It should be noted that, in this document, the terms "include", "comprise" or its any other variant are intended to the packet of nonexcludability
Contain, so that the process, method, article or equipment for including a series of elements not only includes those elements, but also including
Other elements that are not explicitly listed, or further include for elements inherent to such a process, method, article, or device.
In the absence of more restrictions, the element limited by sentence "including a ...", it is not excluded that including the element
Process, method, article or equipment in there is also other identical elements.
The foregoing is only a preferred embodiment of the present invention, is not intended to restrict the invention, for the skill of this field
For art personnel, the invention may be variously modified and varied.All within the spirits and principles of the present invention, made any to repair
Change, equivalent replacement, improvement etc., should all be included in the protection scope of the present invention.
Claims (10)
1. a kind of webpage autoplacement method based on WEB, which is characterized in that applied to the client being connect with server communication
End, which comprises
Multiple charts are obtained from the server and count the quantity of the multiple chart；
The instruction input for realizing autoplacement is detected whether, when detecting the instruction input for realizing autoplacement
When success, the multiple chart is laid out according to the quantity on a webpage, obtains the net of a completion chart layout
Page.
2. webpage autoplacement method according to claim 1, which is characterized in that the quantity is n, according to the quantity
The step of the multiple chart is laid out on a webpage, obtains the webpage of a completion chart layout, comprising:
If n is odd number, statistics priority is the quantity summation m of the chart of the first priority or the second priority；Wherein, line chart
Priority be defined as the first priority, abscissa quantity is more than that the priority of the chart of setting value is defined as the second priority；
If m=0, n+1 sub-regions are divided the webpage into, ruler is carried out to each chart according to the size of the subregion
The chart is placed in a subregion, obtains a completion chart layout by very little adjustment for each chart for completing size adjusting
Webpage；
If m=1, n+1 sub-regions are divided the webpage into, are the first priority or the second priority by the priority
Any one subregion that chart is placed in n+1 sub-regions is simultaneously paved with the subregion and is expert at；According to the subregion
Size carries out size adjusting to other n-1 chart, the chart correspondence that other n-m is completed size adjusting is placed in remaining
N-1 sub-regions obtain the webpage of a completion chart layout；
If m > 1, n+1+m sub-regions are divided the webpage into, are respectively the first priority or the second priority by priority
Any one subregion for being placed in n+1+m sub-regions of chart and be paved with the subregion and be expert at, wherein it is each preferential
Grade is not gone together for the chart of the first priority or the second priority；According to the size of the subregion to other n-m chart into
The chart that other n-m is completed size adjusting is corresponded to and is placed in remaining n+1 sub-regions, obtains one by row size adjusting
Complete the webpage of chart layout.
3. webpage autoplacement method according to claim 1, which is characterized in that the quantity is n, according to the quantity
The step of the multiple chart is laid out on a webpage, obtains the webpage of a completion chart layout, comprising:
If n is even number, n sub-regions are divided the webpage into；
Size adjusting is carried out to each chart according to the size of the subregion；
For each chart for completing size adjusting, which is placed in a subregion, obtains a completion chart layout
Webpage.
4. webpage autoplacement method according to claim 3, which is characterized in that the method also includes:
Obtain the dragging instruction for the chart in the webpage for completing chart layout；Wherein, dragged chart definition is mesh
It marks on a map table；
It is instructed according to the dragging and the object diagram is drawn to specified subregion；
Whether the priority for judging the object diagram is the first priority or the second priority, if the priority is described the
One priority or second priority, are paved with being expert at for the specified subregion for the object diagram, if described preferential
Grade for first priority nor is neither second priority, and the object diagram is placed in the specified sub-district
Domain；Wherein, the priority of line chart is defined as the first priority, and abscissa quantity is more than the priority definition of the chart of setting value
For the second priority.
5. webpage autoplacement method according to claim 4, which is characterized in that the method also includes:
It obtains the modification for modifying the setting value to instruct, be modified according to modification instruction to the setting value.
6. a kind of webpage autoplacement device based on WEB, which is characterized in that applied to the client being connect with server communication
End, described device include:
Chart obtains module, for obtaining multiple charts from the server and counting the quantity of the multiple chart；
Page layout module, for detecting whether there is the instruction input for realizing autoplacement, when detected for realizing
When the instruction input success of autoplacement, the multiple chart is laid out on a webpage according to the quantity, obtains one
Open the webpage for completing chart layout.
7. webpage autoplacement device according to claim 6, which is characterized in that the quantity is n, the page layout
The multiple chart is laid out by module according to the quantity on a webpage, obtains the webpage of a completion chart layout,
It specifically includes:
If n is odd number, statistics priority is the quantity summation m of the chart of the first priority or the second priority；Wherein, line chart
Priority be defined as the first priority, abscissa quantity is more than that the priority of the chart of setting value is defined as the second priority；
If m=0, n+1 sub-regions are divided the webpage into, ruler is carried out to each chart according to the size of the subregion
The chart is placed in a subregion, obtains a completion chart layout by very little adjustment for each chart for completing size adjusting
Webpage；
If m=1, n+1 sub-regions are divided the webpage into, are the first priority or the second priority by the priority
Any one subregion that chart is placed in n+1 sub-regions is simultaneously paved with the subregion and is expert at；According to the subregion
Size carries out size adjusting to other n-1 chart, the chart correspondence that other n-m is completed size adjusting is placed in remaining
N-1 sub-regions obtain the webpage of a completion chart layout；
If m > 1, n+1+m sub-regions are divided the webpage into, are respectively the first priority or the second priority by priority
Any one subregion for being placed in n+1+m sub-regions of chart and be paved with the subregion and be expert at, wherein it is each preferential
Grade is not gone together for the chart of the first priority or the second priority；According to the size of the subregion to other n-m chart into
The chart that other n-m is completed size adjusting is corresponded to and is placed in remaining n+1 sub-regions, obtains one by row size adjusting
Complete the webpage of chart layout.
8. webpage autoplacement device according to claim 6, which is characterized in that the quantity is n, the page layout
The multiple chart is laid out by module according to the quantity on a webpage, obtains the webpage of a completion chart layout
If n is even number, n sub-regions are divided the webpage into；
Size adjusting is carried out to each chart according to the size of the subregion；
For each chart for completing size adjusting, which is placed in a subregion, obtains a completion chart layout
Webpage.
9. webpage autoplacement device according to claim 8, which is characterized in that the page layout module is also used to:
Obtain the dragging instruction for the chart in the webpage for completing chart layout；Wherein, dragged chart definition is mesh
It marks on a map table；
It is instructed according to the dragging and the object diagram is drawn to specified subregion；
Whether the priority for judging the object diagram is the first priority or the second priority, if the priority is described the
One priority or second priority, are paved with being expert at for the specified subregion for the object diagram, if described preferential
Grade for first priority nor is neither second priority, and the object diagram is placed in the specified sub-district
Domain；Wherein, the priority of line chart is defined as the first priority, and abscissa quantity is more than the priority definition of the chart of setting value
For the second priority.
10. webpage autoplacement device according to claim 9, which is characterized in that the page layout module is also used to:
It obtains the modification for modifying the setting value to instruct, be modified according to modification instruction to the setting value.
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201811298057.9A CN109284461A (en) | 2018-11-01 | 2018-11-01 | A kind of webpage autoplacement method and device based on WEB |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201811298057.9A CN109284461A (en) | 2018-11-01 | 2018-11-01 | A kind of webpage autoplacement method and device based on WEB |
Publications (1)
| Publication Number | Publication Date |
|---|---|
| CN109284461A true CN109284461A (en) | 2019-01-29 |
Family
ID=65174382
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN201811298057.9A Pending CN109284461A (en) | 2018-11-01 | 2018-11-01 | A kind of webpage autoplacement method and device based on WEB |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN109284461A (en) |
Citations (4)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN102479033A (en) * | 2010-11-26 | 2012-05-30 | 金蝶软件（中国）有限公司 | Chart browsing method, device and system |
| US20130219263A1 (en) * | 2012-02-20 | 2013-08-22 | Wixpress Ltd. | Web site design system integrating dynamic layout and dynamic content |
| CN103631958A (en) * | 2013-12-17 | 2014-03-12 | 江苏省公用信息有限公司 | Method for multi-screen content display in automatic page matching mode |
| CN105204733A (en) * | 2015-09-02 | 2015-12-30 | 小米科技有限责任公司 | Video chat window display method and device |
-
2018
- 2018-11-01 CN CN201811298057.9A patent/CN109284461A/en active Pending
Patent Citations (4)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN102479033A (en) * | 2010-11-26 | 2012-05-30 | 金蝶软件（中国）有限公司 | Chart browsing method, device and system |
| US20130219263A1 (en) * | 2012-02-20 | 2013-08-22 | Wixpress Ltd. | Web site design system integrating dynamic layout and dynamic content |
| CN103631958A (en) * | 2013-12-17 | 2014-03-12 | 江苏省公用信息有限公司 | Method for multi-screen content display in automatic page matching mode |
| CN105204733A (en) * | 2015-09-02 | 2015-12-30 | 小米科技有限责任公司 | Video chat window display method and device |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN109783181A (en) | Screen is adapted to display methods, electronic equipment and computer storage medium | |
| CN107908677B (en) | Cell source of houses methods of exhibiting and device based on intelligent terminal | |
| CN110032701B (en) | Image display control method and device, storage medium and electronic equipment | |
| CN107273000B (en) | Screen multi-resolution adaptation method of intelligent oscilloscope | |
| CN107944481A (en) | Method and apparatus for generating information | |
| DE112011105390T5 (en) | Smart window and display case | |
| CN107958338A (en) | Electricity consumption policy recommendation method and device, storage medium | |
| DE112016000962T5 (en) | SYSTEM AND METHOD FOR STRUCTURING EVALUATIONS WITH AUTOMATICALLY GENERATED TAGS | |
| DE102020130972A1 (en) | METHOD AND SYSTEM FOR COMMUNICATING LOSS OF BATTERY | |
| CN109657017A (en) | It polymerize the methods of exhibiting and device of point set in map | |
| CN109284461A (en) | A kind of webpage autoplacement method and device based on WEB | |
| CN103995654B (en) | The method and apparatus for adjusting chart granularity | |
| CN105159465B (en) | User reads level of understanding monitoring method and system | |
| CN105278821A (en) | Method and device for automatically regulating electronic document page | |
| CN109408566A (en) | A kind of intelligence chart recommended method and device | |
| CN105718524A (en) | Method and device for determining video originals | |
| JP2018503317A (en) | Screen, mobile terminal, and union type terminal device | |
| CN105912207A (en) | Image display method and apparatus, and user terminal | |
| CN109286791A (en) | A kind of multipath image transmission method, device and its storage medium | |
| CN104461267A (en) | Interface interactive object display method and device | |
| CN105447352A (en) | Computer information management control system and control method | |
| CN107483634A (en) | A kind of load-balancing method and system | |
| CN103018944B (en) | 3D (three dimensional) raster box, display device and touch positioning method of 3D raster box | |
| US8907953B2 (en) | Unfolding dataset with on-demand resolution on a non-linear fixed length graph axis | |
| CN203117601U (en) | 3D (three-dimensional) grating box and display device |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| PB01 | Publication | ||
| PB01 | Publication | ||
| SE01 | Entry into force of request for substantive examination | ||
| SE01 | Entry into force of request for substantive examination | ||
| RJ01 | Rejection of invention patent application after publication |
Application publication date: 20190129 |
|
| RJ01 | Rejection of invention patent application after publication |