CN113096217A - Picture generation method and device, electronic equipment and storage medium - Google Patents
Picture generation method and device, electronic equipment and storage medium Download PDFInfo
- Publication number
- CN113096217A CN113096217A CN202110322338.9A CN202110322338A CN113096217A CN 113096217 A CN113096217 A CN 113096217A CN 202110322338 A CN202110322338 A CN 202110322338A CN 113096217 A CN113096217 A CN 113096217A
- Authority
- CN
- China
- Prior art keywords
- picture
- information
- text
- size information
- target size
- 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.)
- Granted
Links
- 238000000034 method Methods 0.000 title claims abstract description 61
- 238000004590 computer program Methods 0.000 claims description 7
- 230000000694 effects Effects 0.000 abstract description 19
- 238000010586 diagram Methods 0.000 description 15
- 238000006243 chemical reaction Methods 0.000 description 5
- 238000005516 engineering process Methods 0.000 description 5
- 230000003287 optical effect Effects 0.000 description 4
- 238000009877 rendering Methods 0.000 description 4
- 230000006870 function Effects 0.000 description 3
- 230000001960 triggered effect Effects 0.000 description 3
- 238000004458 analytical method Methods 0.000 description 2
- 230000015556 catabolic process Effects 0.000 description 2
- 238000006731 degradation reaction Methods 0.000 description 2
- 230000002093 peripheral effect Effects 0.000 description 2
- 230000002159 abnormal effect Effects 0.000 description 1
- 230000006978 adaptation Effects 0.000 description 1
- 238000003491 array Methods 0.000 description 1
- 230000009286 beneficial effect Effects 0.000 description 1
- 238000004891 communication Methods 0.000 description 1
- 238000013500 data storage Methods 0.000 description 1
- 238000012986 modification Methods 0.000 description 1
- 230000004048 modification Effects 0.000 description 1
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06T—IMAGE DATA PROCESSING OR GENERATION, IN GENERAL
- G06T11/00—2D [Two Dimensional] image generation
- G06T11/60—Editing figures and text; Combining figures or text
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06T—IMAGE DATA PROCESSING OR GENERATION, IN GENERAL
- G06T3/00—Geometric image transformations in the plane of the image
- G06T3/40—Scaling of whole images or parts thereof, e.g. expanding or contracting
-
- 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
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- Processing Or Creating Images (AREA)
- Controls And Circuits For Display Device (AREA)
Abstract
The present disclosure relates to a method and an apparatus for generating a picture, an electronic device and a storage medium, and relates to the technical field of computers, wherein the method comprises the following steps: acquiring a picture generation request comprising text information, a frame picture and frame characteristic information; determining target size information of the text area according to the text information; determining target size information of the picture sides to be zoomed of each frame picture unit in the frame picture, target size information of other picture sides and canvas size of the canvas element according to the target size information and the frame characteristic information; and creating canvas elements according to the size of the canvas, and drawing each frame picture unit and the text area in the canvas elements according to the target size information of the picture edge to be zoomed, the target size information of other picture edges and the target size information of the text area so as to generate the target picture. The effect of carrying out non-equal-ratio scaling on the frame picture along with the text characters can be achieved at the browser end, and the application range of the frame picture with the non-equal-ratio scaling characteristic is expanded.
Description
Technical Field
The present disclosure relates to the field of computer technologies, and in particular, to a method and an apparatus for generating a picture, an electronic device, and a storage medium.
Background
At present, in order to beautify characters or make the characters capable of being highlighted, frame pictures are often required to be added to the characters. For example, when a video title is added to a video cover, a frame picture may be added to the video title, or in a chat software, a frame picture may be added to a text message. In general, a frame picture of characters needs to be capable of changing in size according to the number or size of characters, and when the size changes, the entire size of the frame picture and the size of a character region change, but the size of the edge portion of the frame picture remains unchanged, that is, the frame picture has a characteristic of being capable of scaling unequally with characters.
In the related art, usually, only in the native application program of the android system or the iOS system, the effect of scaling the frame picture in an unequal manner with the text is realized by relying on the unequal scaling technology provided by the android system or the iOS system, for example, in the chat software of the android system, the effect of scaling the frame picture in an unequal manner with the text in a manner that the size of the chat message box changes with the length of the message is realized by relying on the Nine-click technology provided by the android system, but the effect of scaling the frame picture in an unequal manner with the text cannot be realized at the browser end.
Disclosure of Invention
The present disclosure provides a picture generation method, an apparatus, an electronic device, and a storage medium, to at least solve a problem in the related art that an effect of scaling a border picture with a character in an unequal ratio cannot be achieved at a browser end.
The technical scheme of the disclosure is as follows:
according to a first aspect of the embodiments of the present disclosure, there is provided a picture generation method, including: acquiring a picture generation request; wherein the picture generation request comprises: text information and frame picture information, the frame picture information includes: frame pictures and corresponding frame characteristic information; determining target size information of a text area according to the text information; determining target size information of the picture sides to be zoomed of each frame picture unit in the frame picture, target size information of other picture sides and canvas size of canvas elements according to the target size information of the text area and the frame characteristic information; and creating the canvas element according to the canvas size, and drawing each frame picture unit and the text area in the canvas element according to the target size information of the picture edge to be zoomed of each frame picture unit, the target size information of other picture edges and the target size information of the text area so as to generate a target picture.
As a first possible case of the embodiment of the present disclosure, the text information includes: attribute information of the text characters, the number of characters in each line and the number of lines; wherein the attribute information includes: font and font size; the determining the target size information of the text region according to the text information includes: determining the size information of the text characters according to the fonts and the font sizes of the text characters; determining the width of the text area according to the size information of the text characters and the number of the characters in each line; and determining the height of the text area according to the size information and the line number of the text characters.
As a second possible case of the embodiment of the present disclosure, the target size information of the text region includes target size information corresponding to each text edge of the text region; determining, according to the target size information of the text region and the border feature information, target size information of a picture edge to be zoomed of each border picture unit in the border picture, target size information of other picture edges, and a canvas size of a canvas element, including: determining a picture edge overlapped with the text edge in each picture edge as a picture edge to be zoomed aiming at each text edge of the text area; determining the target size information of the text edge as the target size information of the image edge to be zoomed; and determining the target size information of other picture sides and the canvas size of the canvas element according to the target size information of the picture side to be zoomed and the frame characteristic information.
As a third possible case of the embodiment of the present disclosure, the border feature information includes: original size information corresponding to each picture side of each frame picture unit respectively; determining the target size information of other picture edges and the canvas size of the canvas element according to the target size information of the picture edge to be zoomed and the frame characteristic information, comprising: determining the original size information of the other image edges except the image edge to be zoomed in each image edge as the target size information of the other image edges; and determining the canvas size of the canvas element according to the target size information of the picture edge to be zoomed and the target size information of the other picture edges.
As a fourth possible case of the embodiment of the present disclosure, the drawing, according to the target size information of the picture edge to be zoomed of each frame picture unit, the target size information of other picture edges, and the target size information of the text region, each frame picture unit and the text region in the canvas element includes: determining the position information of each frame picture unit in the canvas element according to the target size information of the picture edge to be zoomed and the target size information of other picture edges; determining the position information of the text area in the canvas element according to the position information of each frame picture unit in the canvas element and the target size information of the text area; and drawing each frame picture unit and the text area in the canvas element according to the position information of each frame picture unit in the canvas element and the position information of the text area in the canvas element.
As a fifth possible case of the embodiment of the present disclosure, the border feature information further includes: positional offset information of the text region; the determining the location information of the text region in the canvas element comprises: and determining the position information of the text area in the canvas element according to the position information of each frame picture unit in the canvas element, the position offset information and the target size information of the text area.
As a sixth possible case of the embodiment of the present disclosure, the attribute information, according to the target size information of the picture side to be zoomed of each frame picture unit, the target size information of other picture sides, and the target size information of the text region, drawing each frame picture unit and the text region in the canvas element to generate the target picture, includes: drawing each frame picture unit and the text area in the canvas element according to the target size information of the picture to be zoomed, the target size information of other picture sides and the target size information of the text area to obtain a drawn canvas; and converting the format of the drawn canvas to generate the target picture.
According to a second aspect of the embodiments of the present disclosure, there is provided a picture generation apparatus including: an acquisition module configured to execute an acquisition picture generation request; wherein the picture generation request comprises: text information and frame picture information, the frame picture information includes: frame pictures and corresponding frame characteristic information; a first determination module configured to perform determining target size information of a text region according to the text information; a second determining module configured to perform determining, according to the target size information of the text region and the border feature information, target size information of a picture edge to be zoomed of each border picture unit in the border picture, target size information of other picture edges, and a canvas size of a canvas element; and the drawing module is configured to create the canvas elements according to the canvas size, and draw the frame picture units and the text area in the canvas elements according to the target size information of the picture sides to be zoomed of the frame picture units, the target size information of other picture sides and the target size information of the text area so as to generate a target picture.
As a first possible case of the embodiment of the present disclosure, the text information includes: attribute information of the text characters, the number of characters in each line and the number of lines; wherein the attribute information includes: font and font size; the first determining module is specifically configured to perform: determining the size information of the text characters according to the fonts and the font sizes of the text characters; determining the width of the text area according to the size information of the text characters and the number of the characters in each line; and determining the height of the text area according to the size information and the line number of the text characters.
As a second possible case of the embodiment of the present disclosure, the target size information of the text region includes target size information corresponding to each text edge of the text region; the second determining module includes: a first determining unit configured to perform, for each text edge of the text region, determining, as a picture edge to be zoomed, a picture edge that overlaps with the text edge among the picture edges; a second determining unit configured to determine target size information of the text edge as target size information of the image edge to be zoomed; and the third determining unit is configured to determine the target size information of other picture edges and the canvas size of the canvas element according to the target size information of the picture edge to be zoomed and the frame characteristic information.
As a third possible case of the embodiment of the present disclosure, the border feature information includes: original size information corresponding to each picture side of each frame picture unit respectively; the third determining unit is specifically configured to perform: determining the original size information of the other image edges except the image edge to be zoomed in each image edge as the target size information of the other image edges; and determining the canvas size of the canvas element according to the target size information of the picture edge to be zoomed and the target size information of the other picture edges.
As a fourth possible case of the embodiment of the present disclosure, the drawing module includes: a fourth determining unit, configured to perform determining position information of each border picture unit in the canvas element according to the target size information of the picture edge to be zoomed and the target size information of other picture edges; a fifth determining unit configured to perform determining position information of the text region in a canvas element according to the position information of the respective border picture units in the canvas element and the target size information of the text region; a first drawing unit configured to perform drawing of the respective border picture units and the text region in the canvas element according to position information of the respective border picture units and position information of the text region in the canvas element.
As a fifth possible case of the embodiment of the present disclosure, the border feature information further includes: positional offset information of the text region; the fifth determining unit is specifically configured to perform: and determining the position information of the text area in the canvas element according to the position information of each frame picture unit in the canvas element, the position offset information and the target size information of the text area.
As a sixth possible case of the embodiment of the present disclosure, the rendering module includes: a second drawing unit, configured to draw the frame picture units and the text region in the canvas element according to the target size information of the picture to be zoomed, the target size information of other picture sides, and the target size information of the text region, so as to obtain a drawn canvas; a conversion unit configured to perform format conversion on the canvas after drawing to generate the target picture.
According to a third aspect of the embodiments of the present disclosure, there is provided an electronic apparatus including: a processor; a memory for storing the processor-executable instructions; the processor is configured to execute the instructions to implement the picture generation method provided by the embodiment of the first aspect of the disclosure.
According to a fourth aspect of the embodiments of the present disclosure, there is provided a computer-readable storage medium, where instructions, when executed by a processor of an electronic device, enable the electronic device to perform the picture generation method proposed in the first aspect of the present disclosure.
According to a fifth aspect of the embodiments of the present disclosure, there is provided a computer program product, which when executed by a processor implements the picture generation method proposed in the embodiments of the first aspect of the present disclosure.
The technical scheme provided by the embodiment of the disclosure at least brings the following beneficial effects:
after a picture generation request is obtained, according to text information included in the picture generation request, target size information of a text area is determined, according to the target size information of the text area and border feature information included in the picture generation request, target size information of a picture side to be zoomed of each border picture unit in a border picture, target size information of other picture sides and a canvas size of a canvas element are determined, the canvas element is further created according to the canvas size, and according to the target size information of the picture side to be zoomed of each border picture unit, the target size information of other picture sides and the target size information of the text area, each border picture unit and the text area are drawn in the canvas element to generate a target picture, so that the effect of carrying out non-equal ratio zooming on the border picture along with text characters can be achieved at a browser end, the application range of the frame picture with the non-equal scaling characteristic is expanded.
It is to be understood that both the foregoing general description and the following detailed description are exemplary and explanatory only and are not restrictive of the disclosure.
Drawings
The accompanying drawings, which are incorporated in and constitute a part of this specification, illustrate embodiments consistent with the present disclosure and, together with the description, serve to explain the principles of the disclosure and are not to be construed as limiting the disclosure.
FIG. 1 is an exemplary diagram of a border picture scaled unequally with text;
FIG. 2 is a flow diagram illustrating a method of picture generation in accordance with an exemplary embodiment;
FIG. 3 is an exemplary diagram illustrating a bezel picture in accordance with one illustrative embodiment;
FIG. 4 is another exemplary diagram of a bezel picture shown in accordance with an exemplary embodiment;
FIG. 5 is a flow chart illustrating another method of picture generation in accordance with an exemplary embodiment;
FIG. 6 is a flow diagram illustrating another method of picture generation in accordance with an exemplary embodiment;
FIG. 7 is a flow chart illustrating another method of picture generation in accordance with an exemplary embodiment;
FIG. 8 is an exemplary diagram illustrating the location of bezel picture elements within a canvas element in accordance with an exemplary embodiment;
FIG. 9 is a diagram illustrating another example location of bezel picture elements in a canvas element in accordance with an exemplary embodiment;
FIG. 10 is an exemplary diagram illustrating a border picture element in accordance with one illustrative embodiment;
FIG. 11 is an exemplary diagram of a target picture shown in accordance with an exemplary embodiment;
FIG. 12 is a block diagram of a picture generation device shown in accordance with an exemplary embodiment;
FIG. 13 is a block diagram of another picture generation device shown in accordance with an exemplary embodiment;
FIG. 14 is a block diagram illustrating an electronic device for generating a target picture in accordance with an example embodiment.
Detailed Description
In order to make the technical solutions of the present disclosure better understood by those of ordinary skill in the art, the technical solutions in the embodiments of the present disclosure will be clearly and completely described below with reference to the accompanying drawings.
It should be noted that the terms "first," "second," and the like in the description and claims of the present disclosure and in the above-described drawings are used for distinguishing between similar elements and not necessarily for describing a particular sequential or chronological order. It is to be understood that the data so used is interchangeable under appropriate circumstances such that the embodiments of the disclosure described herein are capable of operation in sequences other than those illustrated or otherwise described herein. The implementations described in the exemplary embodiments below are not intended to represent all implementations consistent with the present disclosure. Rather, they are merely examples of apparatus and methods consistent with certain aspects of the present disclosure, as detailed in the appended claims.
At present, in order to beautify characters or make the characters capable of being highlighted, frame pictures are often required to be added to the characters. For example, when a video title is added to a video cover, a frame picture may be added to the video title, or in a chat software, a frame picture may be added to a text message. In general, a frame picture of characters needs to be capable of changing in size according to the number or size of characters, and when the size changes, the overall size of the frame picture changes, but the size of the edge portion of the frame picture remains unchanged, that is, the frame picture has a characteristic of being capable of scaling unequally according to the characters.
For example, as shown in fig. 1, the picture on the left side in fig. 1 is formed by adding a frame picture to the text when the number of the text is small, and the picture on the right side in fig. 1 is formed by adding a frame picture to the text when the number of the text is large. As can be seen from fig. 1, the text area of the frame picture is usually located in the middle portion of the frame picture, and when the number of the text is increased, the overall size of the frame picture and the size of the text area of the frame picture are increased, but the size of the edge portion of the frame picture is kept unchanged, such as the height of the upper edge portion, the height of the lower edge portion, the width of the left edge portion, and the width of the right edge portion of the frame picture are kept unchanged.
In the related art, usually, only in the native application program of the android system or the iOS system, the effect of scaling the frame picture in an unequal manner with the text is realized by relying on the unequal scaling technology provided by the android system or the iOS system, for example, in the chat software of the android system, the effect of scaling the frame picture in an unequal manner with the text in a manner that the size of the chat message box changes with the length of the message is realized by relying on the Nine-click technology provided by the android system, but the effect of scaling the frame picture in an unequal manner with the text cannot be realized at the browser end.
The disclosure provides a picture generation method mainly for solving the technical problem that the effect of non-equal scaling of a frame picture along with characters cannot be achieved at a browser end in the related art. According to the picture generation method, after a picture generation request is obtained, according to text information included in the picture generation request, target size information of a text region is determined, according to the target size information of the text region and border feature information included in the picture generation request, target size information of a picture side to be zoomed of each border picture unit in the border picture, target size information of other picture sides and canvas size of canvas elements are determined, the canvas elements are created according to the canvas sizes, and according to the target size information of the picture side to be zoomed of each border picture unit, the target size information of other picture sides and the target size information of the text region, each border picture unit and the text region are drawn in the canvas elements to generate a target picture. Therefore, the effect of carrying out unequal scaling on the frame pictures along with the text characters can be realized at the browser end, and the application range of the frame pictures with the unequal scaling characteristics is expanded.
The following describes a picture generation method provided by the embodiment of the present disclosure in detail with reference to the accompanying drawings.
Fig. 2 is a flow chart of a picture generation method shown in accordance with an exemplary embodiment.
The execution subject of the picture generation method according to the embodiment of the present disclosure may be a picture generation apparatus, which may be an electronic device, or may be configured in the electronic device, so as to achieve an effect of performing non-isometric scaling on the border picture along with the text character at a browser end.
The electronic device may be any stationary or mobile computing device capable of performing data processing, for example, a mobile computing device such as a notebook computer and a wearable device, or a stationary computing device such as a desktop computer, or other types of computing devices, which is not limited in this disclosure.
As shown in fig. 2, the picture generation method may include the following steps 101-104.
In step 101, a picture generation request is obtained, where the picture generation request includes: text information and frame picture information, frame picture information includes: the frame picture and the corresponding frame characteristic information.
The text information may include any number of text characters and attribute information such as fonts and font sizes of the text characters, and in addition, the text information may also include any other information related to the text in the target picture to be generated, such as the maximum number of characters that can be accommodated in each line of a text region in the target picture, which is not limited in this application.
It can be understood that the frame picture has a feature that the overall size changes with the text, but the size of the edge portion of the frame picture remains unchanged, in this embodiment of the application, the frame picture may be divided into a plurality of frame picture units according to the feature of the frame picture, and correspondingly, the frame feature information may include attribute information of each frame picture unit of the frame picture, such as original size information of each frame picture unit, position distribution information between each frame picture unit, and the like.
For example, referring to the frame picture shown in fig. 3, it is assumed that the frame picture has the following characteristics: the text area is located in a dashed frame area of the frame picture shown in fig. 3, the dashed frame area can be scaled with the size of the text, and in the scaling process, for a left area of a straight line where a left short side of the dashed frame is located and a right area of a straight line where a right short side of the dashed frame is located in the frame picture, the width of the area is kept unchanged, the height is changed along with the height of the dashed frame area, for an upper area of a straight line where an upper long side of the dashed frame is located and a lower area of a straight line where a lower long side of the dashed frame is located in the frame picture, the height of the area is kept unchanged, and the width is changed along with. In this embodiment, according to the characteristics of the frame picture, the frame picture may be divided into 9 frame picture units shown in fig. 4 by using 4 straight lines where 4 sides of the dashed frame are located as boundary lines. Assuming that each of the frame picture units is numbered as shown in fig. 4, a region where text is allowed to appear, i.e., a text region, is located in a region where the frame picture unit numbered 5 is located.
Accordingly, the frame characteristic information of the frame pictures shown in fig. 3 and 4 may include original size information of each frame picture unit, position distribution information between each frame picture unit, and the like, including: the original size of the frame picture unit numbered 1 is a × D pixels, the original size of the frame picture unit numbered 2 is B × D pixels, the original size of the frame picture unit numbered 3 is C × D pixels, the original size of the frame picture unit numbered 4 is a × E pixels, the original size of the frame picture unit numbered 5 is B × E pixels, the original size of the frame picture unit numbered 6 is C × E pixels, the original size of the frame picture unit numbered 7 is a × F pixels, the original size of the frame picture unit numbered 8 is B × F pixels, the original size of the frame picture unit numbered 9 is C × F pixels, and the frame picture units numbered 1 to 9 are sequentially arranged in a 3 × 3 manner.
In this embodiment, text characters included in the text information may be input into the picture generating apparatus by the user, or may be obtained by the picture generating apparatus according to touch operations such as copying and selecting by the user, which is not limited in this embodiment of the present application. Frame picture information, which can be input into the picture generation device by a user; alternatively, it may be obtained by: the method comprises the following steps that a developer of frame pictures sets frame characteristic information of each frame picture in advance and stores the frame characteristic information in a picture generation device, and after the picture generation device displays a plurality of frame pictures, the frame pictures and corresponding frame characteristic information are obtained according to the selection operation of a user on the frame pictures; alternatively, the frame picture information may also be obtained by the picture generating device through other manners, which is not limited in this embodiment of the application.
In an exemplary embodiment, the picture generation request may be triggered automatically after the user inputs text characters and selects a border picture to be added to the text characters, or triggered by touch operations such as touching a button with a picture generation function after the user inputs the text characters and selects the border picture to be added to the text characters, or triggered by other ways, which is not limited in the embodiment of the present application.
In step 102, target size information of the text region is determined based on the text information.
The text area is an area occupied by a text, the target size information of the text area is size information of the text area in the target picture to be generated, and the size information may include width information and height information of the text area.
In step 103, according to the target size information of the text region and the border feature information, target size information of the picture sides to be zoomed of each border picture unit in the border picture, target size information of other picture sides, and canvas size of the canvas element are determined.
The canvas may be a canvas capable of drawing graphics on a webpage. Among them, canvas is an HTML (hypertext Markup Language) element for drawing graphics using JavaScript script.
It can be understood that, in the process of scaling the frame picture along with the text, among the picture edges of each frame picture unit, the size of some picture edges may change along with the text, and the size of some picture edges may remain unchanged. In the embodiment of the application, the target size information of the picture edge to be zoomed of each frame picture unit in the frame picture, the target size information of other picture edges and the canvas size of the canvas element can be determined according to the target size information and the frame characteristic information of the text area.
It should be noted that, the picture sides of the frame picture units in the embodiments of the present application refer to sides of a rectangular area occupied by the frame picture units. For example, referring to fig. 3 and 4, the picture side of the frame picture unit numbered 4 refers to the side of the rectangular region with a size of a × E pixels, which is occupied by the frame picture unit numbered 4; the picture side of the frame picture element numbered 7 refers to the side of the rectangular region having a size of a × F pixels, which is occupied by the frame picture element numbered 7.
In step 104, a canvas element is created according to the canvas size, and each frame picture unit and the text region are drawn in the canvas element according to the target size information of the picture side to be zoomed of each frame picture unit, the target size information of other picture sides, and the target size information of the text region, so as to generate the target picture.
In the embodiment of the application, after the picture generation device determines the target size information of the picture to be zoomed of each frame picture unit, the target size information of other picture sides, the target size information of the text region and the canvas size of the canvas element, the canvas element can be created according to the canvas size, and then each frame picture unit and the text region can be drawn in the canvas element according to the target size information of the picture to be zoomed of each frame picture unit, the target size information of other picture sides and the target size information of the text region, so as to generate the target picture.
Because the target picture is generated by the canvas element capable of drawing a graph on a webpage, and when the target picture is generated, the target size information of the text region is determined according to the text information, the target size information of the picture side to be zoomed of each frame picture unit, the target size information of the other picture side are determined according to the target size information of the text region and the frame characteristic information, so that the target size information of the text region, the target size information of the picture side to be zoomed of each frame picture unit can be changed along with the text information, thereby leading the generated target picture to be drawn to be integrally zoomed compared with the original frame picture according to the target size information of the picture side to be zoomed of each frame picture unit, the target size information of the other picture side and the target size information of the text region, and the sizes of the edge parts of the frame pictures before and after being zoomed are kept unchanged, therefore, the effect of scaling the border picture along with the text characters in an unequal manner is achieved at the browser end.
According to the picture generation method, after a picture generation request is obtained, according to text information included in the picture generation request, target size information of a text region is determined, according to the target size information of the text region and border feature information included in the picture generation request, target size information of a picture side to be zoomed of each border picture unit in the border picture, target size information of other picture sides and canvas size of canvas elements are determined, the canvas elements are created according to the canvas sizes, and according to the target size information of the picture side to be zoomed of each border picture unit, the target size information of other picture sides and the target size information of the text region, each border picture unit and the text region are drawn in the canvas elements to generate a target picture. Therefore, the effect of carrying out unequal scaling on the frame pictures along with the text characters can be realized at the browser end, and the application range of the frame pictures with the unequal scaling characteristics is expanded.
As can be seen from the above analysis, according to the image generating method provided in the embodiment of the present application, the target size information of the text region may be determined according to the text information. Next, with reference to fig. 5, a process of determining target size information of a text region in the picture generating method provided in the embodiment of the present disclosure is described.
Fig. 5 is a flow chart illustrating another picture generation method according to an example embodiment.
As shown in fig. 5, the step 102 shown in fig. 2 may specifically include the following steps 201 and 203.
In step 201, size information of a text character is determined according to the font and font size of the text character.
The size information of a text character refers to size information of one text character, which may include width information and height information of one text character.
In an exemplary embodiment, the text information may include attribute information of the text character, wherein the attribute information may include a font and a font size, so that the size information of the text character may be determined according to the font and the font size of the text character.
In step 202, the width of the text region is determined based on the size information of the text characters and the number of characters per line.
In step 203, the height of the text region is determined based on the size information and the number of lines of the text characters.
The number of characters in each line is the maximum number of characters that can be accommodated in each line of the text area.
The line number, which is the line number occupied by the text characters included in the text information, may be determined according to the number of text characters included in the text information and the number of characters per line. For example, when the number of text characters included in the text information is less than the number of characters per line, the number of lines may be determined to be 1, and when the number of text characters included in the text information is greater than the number of characters per line, the number of lines may be determined to be the ratio of the number of text characters to the number of characters per line plus 1.
In an exemplary embodiment, the number of rows may be determined by a code as shown below.
const{width}=context.measureText(withANewLetter);
context.fillText(currentLineLetter,x,y);
y+=lineHeight;
lineCount+=1;
Specifically, after the picture generating apparatus determines the size information of the text characters, the product of the size of the text characters and the number of characters per line may be used as the width of the text region, and the product of the size of the text characters and the number of lines may be used as the height of the text region.
By the method, the target size information of the text region can be accurately determined, and a foundation is laid for accurately determining the target size information of the picture sides to be zoomed of each frame picture unit in the frame picture, the target size information of other picture sides and the canvas size of the canvas element according to the target size information and the frame characteristic information of the text region.
As can be seen from the above analysis, the picture generation method provided in the embodiment of the present application may determine the target size information of the text region, and then determine the target size information of the picture to be zoomed side of each frame picture unit in the frame picture, the target size information of the other picture sides, and the canvas size of the canvas element according to the target size information and the frame feature information of the text region. With reference to fig. 6, a process of determining target size information of a picture edge to be zoomed of each frame picture unit in a frame picture, target size information of other picture edges, and a canvas size of a canvas element in the picture generation method provided in the embodiment of the present disclosure is described below.
Fig. 6 is a flow chart illustrating another picture generation method according to an example embodiment.
As shown in fig. 6, the step 103 shown in fig. 2 may specifically include the following steps 301-303.
In step 301, for each text edge of the text region, a picture edge overlapping with the text edge among the picture edges is determined as a picture edge to be zoomed.
In step 302, the target size information of the text side is determined as the target size information of the picture side to be zoomed.
In an exemplary embodiment, the target size information of the text region may include target size information corresponding to each text side of the text region, and since a size of a picture side overlapping with the text side of the text region among the picture sides of the picture units of the frames of the picture varies with a size of the text region, for each text side of the text region, the picture side overlapping with the text side among the picture sides of the picture units of the frames may be determined as a picture side to be zoomed, and the target size information of the text side may be determined as the target size information of the picture side to be zoomed overlapping with the text side.
Referring to fig. 3 and 4, assuming that the text region is located in a region where a frame picture unit (i.e., a frame picture unit numbered 5) located in the middle of the frame picture is located, since the lower picture side of the frame picture unit numbered 2 overlaps with the upper text side of the text region, the lower picture side of the frame picture unit numbered 2 may be determined as a picture side to be scaled, and the target size information of the upper text side of the text region may be determined as the target size information of the lower picture side of the frame picture unit numbered 2, i.e., the width of the text region may be determined as the target size of the lower picture side of the frame picture unit numbered 2.
Similarly, the upper side picture side of the frame picture unit numbered 8 may be determined as the picture side to be scaled, and the target size information of the lower side text side of the text region may be determined as the target size information of the upper side picture side of the frame picture unit numbered 8, the right side picture side of the frame picture unit numbered 4 may be determined as the picture side to be scaled, and the target size information of the left side text side of the text region may be determined as the target size information of the right side picture side of the frame picture unit numbered 4, the left side picture side of the frame picture unit numbered 6 may be determined as the picture side to be scaled, and the target size information of the right side text side of the text region may be determined as the target size information of the left side picture side of the frame picture unit numbered 6.
In step 303, the target size information of the other picture edges and the canvas size of the canvas element are determined according to the target size information of the picture edge to be zoomed and the border feature information.
In an exemplary embodiment, the border feature information may include original size information corresponding to each picture edge of each border picture unit, and accordingly, step 303 may be implemented as follows:
determining original size information of other picture edges except the edge of the picture to be zoomed in each picture edge as target size information of other picture edges;
and determining the canvas size of the canvas element according to the target size information of the picture edge to be zoomed and the target size information of other picture edges.
Specifically, since the other picture sides except the picture side to be zoomed in each frame picture unit are picture sides whose sizes do not change with the text, the original size information of the other picture sides included in the frame feature information can be determined as the target size information of the other picture sides, and then the canvas size of the canvas element can be determined according to the target size information of the picture side to be zoomed and the target size information of the other picture sides. It should be noted that, because the sizes of the parallel picture sides in one frame picture unit are changed synchronously, the picture sides other than the picture side to be zoomed in each frame picture unit implemented in the present application do not include the picture side parallel to the picture side to be zoomed.
For example, referring to fig. 3 and 4, continuing the above example, assume that the original size of the frame picture unit numbered 1 of the frame picture is a × D pixels, the original size of the frame picture unit numbered 2 is B × D pixels, the original size of the frame picture unit numbered 3 is C × D pixels, the original size of the frame picture unit numbered 4 is a × E pixels, the original size of the frame picture unit numbered 5 is B × E pixels, the original size of the frame picture unit numbered 6 is C × E pixels, the original size of the frame picture unit numbered 7 is a × F pixels, the original size of the frame picture unit numbered 8 is B × F pixels, and the original size of the frame picture unit numbered 9 is C × F pixels. Suppose that the lower side picture edge of the frame picture unit numbered 2 and the upper side picture edge of the frame picture unit numbered 8 of the frame picture are to-be-zoomed picture edges, and the target sizes are both B ', the right side picture edge of the frame picture unit numbered 4 and the left side picture edge of the frame picture unit numbered 6 are to-be-zoomed picture edges, and the target sizes are both E'. The original size information of the other picture sides except the picture side to be zoomed of each frame picture unit can be determined as the target size information of the corresponding picture side, and then the width of the canvas element is determined as a + B '+ C pixel according to the target size information of the upper or lower side picture side of the frame picture unit numbered 1, 2, 3, or the target size information of the upper or lower side picture side of the frame picture unit numbered 4, 5, 6, or the target size information of the upper or lower side picture side of the frame picture unit numbered 7, 8, 9, and then the width of the canvas element is determined as a + B' + C pixel according to the target size information of the left or right side picture side of the frame picture unit numbered 1, 4, 7, or the target size information of the left or right side picture side of the frame picture unit numbered 2, 5, 8, or the target size information of the left or right side picture side of the frame picture unit numbered 3, 6, 9, the height of the canvas element is determined to be D + E' + F pixels.
The canvas size of the canvas element is determined according to the target size information of the picture edge to be zoomed and the target size information of other picture edges, so that the canvas size of the text region in the region of the frame picture unit in the middle position of the frame picture can be accurately determined.
It can be understood that, in practical applications, due to the limitation of the size of the screen on which the target picture is to be displayed, or the limitation of the size of the display area on which the target picture is to be displayed on the screen, the size of the generated target picture is generally limited, and the canvas size of the canvas element determined in the above manner is determined based on the text information and the frame characteristic information of the frame picture, in practical applications, due to the reason that the maximum number of characters per line set by a developer is large, and the like, the finally determined canvas size may exceed the maximum size of the target picture, and if the generated target picture is drawn on the canvas element of such a size, the finally generated target picture may exceed the screen size or the size of the display area on which the target picture is to be displayed on the screen, in this embodiment of the application, when the canvas size is larger than the maximum size of the target picture, and performing degradation fault tolerance processing.
Specifically, the maximum size of the target picture can be carried in the picture generation request, so that the picture generation device can determine whether the size of the canvas is larger than the maximum size of the target picture after determining the size of the canvas element according to the target size information of the text region and the frame characteristic information of the frame picture, and if the size of the canvas is not larger than the maximum size of the target picture, the determined size of the canvas is used as the size of the canvas element of the target picture to be drawn.
If the size of the canvas is larger than the maximum size of the target picture, the maximum size of the target picture can be used as the size of the canvas, or a prompt message can be returned to the user to prompt that the input number of text characters of the user exceeds the bearing capacity of a screen display area, or the size of the target picture can be reduced in a proper amount after the target picture is generated, or other modes can be adopted to realize the degradation fault tolerance.
After the size of the canvas is determined, the size of the canvas is adjusted according to the maximum size of the target picture carried in the target picture generation request, so that the size of the generated target picture drawn in the canvas element with the size of the canvas does not exceed the size of a screen or the size of a display area of the target picture to be displayed on the screen, and the abnormal display condition when the target picture is displayed is avoided.
With reference to fig. 7, a process of drawing each frame picture unit and a text region in a canvas element in the picture generating method provided in the embodiment of the present disclosure is further described.
Fig. 7 is a flow chart illustrating another picture generation method according to an example embodiment.
As shown in fig. 7, the step 104 shown in fig. 2 may specifically include the following steps 401-403.
In step 401, according to the target size information of the picture edge to be zoomed and the target size information of other picture edges, the position information of each frame picture unit in the canvas element is determined.
The position information of each frame picture unit in the canvas element may specifically refer to coordinates of each pixel point of each frame picture unit in the canvas element.
In step 402, the position information of the text region in the canvas element is determined according to the position information of each border picture unit in the canvas element and the target size information of the text region.
The position information of the text region in the canvas element may specifically refer to coordinates of each pixel point of the text region in the canvas element.
In step 403, drawing each border picture unit and the text region in the canvas element according to the position information of each border picture unit in the canvas element and the position information of the text region in the canvas element.
Specifically, after the canvas size of the canvas element is determined, the canvas element with the canvas size can be created, and each frame picture unit and the text area are drawn in the canvas element. When each frame picture unit and the text area are specifically drawn, the position information of each frame picture unit in the canvas element and the position information of the text area in the canvas element can be determined firstly, then each frame picture unit is drawn in the canvas element according to the position information of each frame picture unit in the canvas element, and the text area is drawn in the canvas element according to the position information of the text area in the canvas element.
With reference to fig. 8, a process of determining location information of each border picture unit in the canvas element and location information of the text area in the canvas element in the embodiment of the present application is further described below. It is assumed that the position distribution of each frame picture unit in the frame picture is shown in fig. 4, and the target sizes of the upper and lower sides of the frame picture units numbered 1, 4, and 7 are both a pixels, the target sizes of the upper and lower sides of the frame picture units numbered 2, 5, and 8 are both B 'pixels, the target sizes of the upper and lower sides of the frame picture units numbered 3, 6, and 9 are both C pixels, the target sizes of the left and right sides of the frame picture units numbered 1, 2, and 3 are both D pixels, the target sizes of the left and right sides of the frame picture units numbered 4, 5, and 6 are both E' pixels, and the target sizes of the left and right sides of the frame picture units numbered 7, 8, and 9 are both F pixels.
As shown in fig. 8, a rectangular coordinate system may be established with a vertex of the canvas element as an origin, and then the coordinates of the pixel points at the top left corner vertex of the frame picture unit numbered 1 may be determined to be (0,0), and according to the target size of each picture edge of the frame picture unit numbered 1, the coordinates of each pixel point of the frame picture unit numbered 1 may be determined, for example, the coordinates of the pixel points at the bottom left corner vertex of the frame picture unit numbered 1 may be determined to be (0, D), and the coordinates of the pixel points at the bottom right corner vertex may be (a, D). According to the target size of the upper side picture side of the frame picture unit with the number of 1, the coordinates of the pixel point at the top left corner vertex position of the frame picture unit with the number of 2 can be determined to be (A, 0), and according to the target size of each picture side of the frame picture unit with the number of 2, the coordinates of each pixel point of the frame picture unit with the number of 2 can be determined. According to the target size of the upper side picture side of the frame picture unit with the number of 2, the coordinates of the pixel points at the top left corner vertex position of the frame picture unit with the number of 3 can be determined to be (A + B', 0), and according to the target size of each picture side of the frame picture unit with the number of 3, the coordinates of each pixel point of the frame picture unit with the number of 3 can be determined. By analogy, the coordinates of each pixel point of each frame picture unit in the canvas element can be determined.
After the coordinates of each pixel point of each frame picture unit in the canvas element are determined, because the text area is located in the area where the frame picture unit with the number of 5 is located, the target size information of each text side of the text area is the same as the target size information of each picture side of the frame picture unit with the number of 5, the coordinates of each pixel point of the text area in the canvas element can be determined according to the coordinates of each pixel point of the frame picture unit with the number of 5 in the canvas element.
By the method, when the frame picture unit of which the text area is located in the middle of the frame picture is located in the area, the position information of each frame picture unit in the canvas element and the position information of the text area in the canvas element can be accurately determined, so that each frame picture unit can be drawn in the canvas element according to the position information of each frame picture unit in the canvas element, and the text area can be drawn in the canvas element according to the position information of the text area in the canvas element.
It should be noted that, in the above embodiments, the text region is located in the region where the frame picture unit of the middle position of the frame picture is located, and in a possible implementation form, when the frame picture is added to the text character, the frame picture may further allow the text region to have a certain position offset relative to the region where the frame picture unit of the middle position of the frame picture is located, at this time, the frame feature information corresponding to the frame picture may further include position offset information of the text region. The position offset information of the text region may represent position offset information of a region where a frame picture unit of the text region relative to a middle position of the frame picture is located, and specifically may include a coordinate offset value of each text edge of the text region relative to each picture edge of the frame picture unit of the middle position of the frame picture.
Accordingly, the position information of the text region in the canvas element may be determined according to the position information of each frame picture unit in the canvas element, the position offset information of the text region, and the target size information of the text region.
For example, assuming that the positions of the frame picture units of the frame picture in the canvas element are as shown in fig. 9, the positional offset information of the text region includes: the coordinate offset value of the upper text side of the text region with respect to the lower picture side of the frame picture unit at the middle position of the frame picture is (0, c), the coordinate offset value of the lower text side of the text region with respect to the lower picture side of the frame picture unit at the middle position of the frame picture is (0, -d), the coordinate offset value of the left text side of the text region with respect to the left picture side of the frame picture unit at the middle position of the frame picture is (-a,0), and the coordinate offset value of the right text side of the text region with respect to the right picture side of the frame picture unit at the middle position of the frame picture is (-b, 0).
The coordinates of the pixel points at the top left vertex position of the text region can be determined to be (a-a, D + c) according to the coordinates of the pixel points at the top left vertex position of the frame picture unit at the middle position of the frame picture and the position offset information of the text region, and the coordinates of each pixel point of the text region can be determined according to the target size information of each text edge of the text region.
By the method, the position information of the text region in the canvas element can be accurately determined when the text region has a certain position offset relative to the region of the frame picture unit at the middle position of the frame picture.
It should be noted that, when the border feature information corresponding to the border picture further includes the position offset information of the text region, the canvas size of the canvas element is also different from the canvas size of the canvas element when the border feature information does not include the position offset information of the text region. When the frame characteristic information corresponding to the frame picture further includes the position offset information of the text region, the canvas size of the canvas element may be determined according to the target size information of the picture side to be zoomed of each frame picture unit, the target size information of the other picture sides, and the position offset information of the text region.
In an exemplary embodiment, when each frame picture unit is drawn, each frame picture unit may be drawn sequentially according to a position distribution relationship of each frame picture unit.
In an exemplary embodiment, drawing the border picture elements in the canvas element may be implemented by:
const context=canvas.getContext('2d');
context.drawImage(image,sx,sy,sWidth,sHeight,dx,dy,dWidth,dHeight);
through the above codes, for example, the frame picture unit with the original size of a × E pixels and the number of 4 shown on the left side of fig. 10 can be redrawn into the frame picture unit with the target size of a × E' shown on the right side of fig. 10 according to the position information of the frame picture unit with the number of 4 in the canvas element.
In an exemplary embodiment, drawing a text region in a canvas element may be accomplished by code as follows.
context.fillText(currentLineLetter,x,y);
By the above method, the target picture including the text characters and the frame picture, such as the target picture shown in fig. 11, can be drawn and generated at the browser end according to the target size information of the picture side to be zoomed, the target size information of the other picture sides, and the target size information of the text region.
It should be noted that, according to the target size information of the picture edge to be zoomed, the target size information of other picture edges, and the target size information of the text region, each frame picture unit and the text region are drawn in the canvas element, and the obtained canvas which is usually in a non-picture format is obtained.
In an exemplary embodiment, the conversion of the canvas to a picture format after drawing may be accomplished by the code shown below.
const$titleCanvas=this.canvas;
context2D.drawImage(
$titleCanvas,
titleCanvasX,
titleCanvasY,
$titleCanvas.width,
$titleCanvas.height
);
The picture generation method provided by the embodiment of the application determines the position information of each frame picture unit in the canvas element according to the target size information of the picture edge to be zoomed and the target size information of other picture edges, determines the position information of the text region in the canvas element according to the position information of each frame picture unit in the canvas element and the target size information of the text region, further draws each frame picture unit and the text region in the canvas element according to the position information of each frame picture unit in the canvas element and the position information of the text region in the canvas element, realizes that at a browser end, a target picture comprising text characters and frame pictures is drawn and generated according to the target size information of the picture edge to be zoomed of each frame picture unit, the target size information of other picture edges and the target size information of the text region, the effect of carrying out non-equal-ratio scaling on the frame picture along with the text characters can be achieved at the browser end, and the application range of the frame picture with the non-equal-ratio scaling characteristic is expanded.
In order to implement the above embodiments, the present disclosure provides an image generating device.
Fig. 12 is a block diagram of a picture generation apparatus shown in accordance with an example embodiment.
Referring to fig. 12, the picture generation apparatus 100 may include: an acquisition module 110, a first determination module 120, a second determination module 130, and a rendering module 140.
The obtaining module 110 is configured to execute a request for obtaining a picture generation; wherein the picture generation request includes: text information and frame picture information, frame picture information includes: frame pictures and corresponding frame characteristic information;
a first determining module 120 configured to perform determining target size information of the text region according to the text information;
a second determining module 130 configured to perform determining, according to the target size information of the text region and the border feature information, target size information of a picture side to be zoomed of each border picture unit in the border picture, target size information of other picture sides, and a canvas size of the canvas element;
and a drawing module 140 configured to create canvas elements according to the canvas size, and draw each of the frame picture units and the text region in the canvas elements according to the target size information of the picture edge to be scaled of each of the frame picture units, the target size information of the other picture edges, and the target size information of the text region to generate the target picture.
It should be noted that the picture generating apparatus 100 according to the embodiment of the present disclosure may execute the picture generating method in the foregoing embodiment, and the picture generating apparatus may be an electronic device, or may be configured in the electronic device, so as to achieve an effect of performing non-isometric scaling on the border picture along with the text character at the browser end.
The electronic device may be any stationary or mobile computing device capable of performing data processing, for example, a mobile computing device such as a notebook computer and a wearable device, or a stationary computing device such as a desktop computer, or other types of computing devices, which is not limited in this disclosure.
It should be noted that, regarding the apparatus in the above embodiment, the specific manner in which each module performs the operation has been described in detail in the embodiment related to the method, and will not be elaborated herein.
The picture generation device of the embodiment of the disclosure determines, after obtaining a picture generation request, target size information of a text region according to text information included in the picture generation request, determines, according to the target size information of the text region and frame feature information included in the picture generation request, target size information of a picture side to be zoomed of each frame picture unit in the frame picture, target size information of other picture sides, and a canvas size of a canvas element, further creates the canvas element according to the canvas size, and draws each frame picture unit and the text region in the canvas element according to the target size information of the picture side to be zoomed of each frame picture unit, the target size information of other picture sides, and the target size information of the text region to generate a target picture. Therefore, the effect of carrying out unequal scaling on the frame pictures along with the text characters can be realized at the browser end, and the application range of the frame pictures with the unequal scaling characteristics is expanded.
Fig. 13 is a block diagram of another picture generation apparatus shown in accordance with an example embodiment.
Referring to fig. 13, in the picture generating apparatus 100, when the target size information of the text region includes target size information corresponding to each text edge of the text region, in addition to the target size information shown in fig. 12, the second determining module 130 may include:
a first determining unit 1301 configured to perform, for each text edge of the text region, determining, as a picture edge to be zoomed, a picture edge that overlaps with the text edge among the picture edges;
a second determining unit 1302, configured to perform determining target size information of a text side as target size information of a picture side to be zoomed;
and a third determining unit 1303 configured to determine target size information of other picture edges and a canvas size of the canvas element according to the target size information of the picture edge to be zoomed and the border feature information.
In an exemplary embodiment, the bezel feature information may include: original size information corresponding to each picture side of each frame picture unit respectively; correspondingly, the third determining unit 1303 is specifically configured to perform:
determining original size information of other picture edges except the edge of the picture to be zoomed in each picture edge as target size information of other picture edges;
and determining the canvas size of the canvas element according to the target size information of the picture edge to be zoomed and the target size information of other picture edges.
In an exemplary embodiment, the text information includes: attribute information of text characters, the number of characters in each line and the number of lines, wherein the attribute information comprises fonts and word sizes; accordingly, the first determining module 120 is specifically configured to perform:
determining the size information of the text characters according to the fonts and the font sizes of the text characters;
determining the width of a text area according to the size information of the text characters and the number of characters in each line;
and determining the height of the text area according to the size information and the line number of the text characters.
In an exemplary embodiment, the rendering module 140 may include:
a fourth determining unit 1401 configured to perform determining position information of each of the border picture units in the canvas element according to the target size information of the picture edge to be zoomed and the target size information of the other picture edges;
a fifth determining unit 1402 configured to perform determining position information of the text region in the canvas element according to the position information of the respective border picture units in the canvas element and the target size information of the text region;
a first drawing unit 1403 configured to perform drawing of each of the frame picture units and the text region in the canvas element according to the position information of each of the frame picture units and the position information of the text region in the canvas element.
In an exemplary embodiment, the border feature information may further include: positional offset information of the text region; accordingly, the fifth determining unit 1402 is specifically configured to perform:
and determining the position information of the text area in the canvas element according to the position information, the position offset information and the target size information of the text area of each frame picture unit in the canvas element.
In an exemplary embodiment, the rendering module 140 may include:
the second drawing unit is configured to draw each frame picture unit and the text area in the canvas element according to the target size information of the picture edge to be zoomed, the target size information of other picture edges and the target size information of the text area to obtain a drawn canvas;
and the conversion unit is configured to perform format conversion on the canvas after drawing so as to generate the target picture.
It should be noted that, regarding the apparatus in the above embodiment, the specific manner in which each module performs the operation has been described in detail in the embodiment related to the method, and will not be elaborated herein.
The picture generation device of the embodiment of the disclosure determines, after obtaining a picture generation request, target size information of a text region according to text information included in the picture generation request, determines, according to the target size information of the text region and frame feature information included in the picture generation request, target size information of a picture side to be zoomed of each frame picture unit in the frame picture, target size information of other picture sides, and a canvas size of a canvas element, further creates the canvas element according to the canvas size, and draws each frame picture unit and the text region in the canvas element according to the target size information of the picture side to be zoomed of each frame picture unit, the target size information of other picture sides, and the target size information of the text region to generate a target picture. Therefore, the effect of carrying out unequal scaling on the frame pictures along with the text characters can be realized at the browser end, and the application range of the frame pictures with the unequal scaling characteristics is expanded.
In order to implement the above embodiments, the embodiment of the present disclosure further provides an electronic device.
Wherein, the electronic device 200 includes:
a processor 220;
a memory 210 for storing instructions executable by processor 220;
wherein the processor 220 is configured to execute the instructions to implement the picture generation method as previously described.
As an example, fig. 14 is a block diagram of an electronic device 200 for generating a target picture according to an exemplary embodiment, and as shown in fig. 14, the electronic device 200 may further include:
a memory 210 and a processor 220, a bus 230 connecting different components (including the memory 210 and the processor 220), wherein the memory 210 stores a computer program, and when the processor 220 executes the program, the picture generation method according to the embodiment of the present disclosure is implemented.
A program/utility 280 having a set (at least one) of program modules 270, including but not limited to an operating system, one or more application programs, other program modules, and program data, each of which or some combination thereof may comprise an implementation of a network environment, may be stored in, for example, the memory 210. The program modules 270 generally perform the functions and/or methodologies of the embodiments described in this disclosure.
The processor 220 executes various functional applications and data processing by executing programs stored in the memory 210.
It should be noted that, for the implementation process and the technical principle of the electronic device of the embodiment, reference is made to the foregoing explanation of the picture generation method of the embodiment of the present disclosure, and details are not repeated here.
The electronic equipment provided by the embodiment of the disclosure enables the effect of non-equal-ratio scaling of the frame picture along with the text characters to be realized at the browser end, and the application range of the frame picture with the non-equal-ratio scaling characteristic is expanded.
In an exemplary embodiment, the disclosed embodiment also proposes a computer-readable storage medium comprising instructions, such as the memory 210 comprising instructions, executable by the processor 220 of the electronic device 200 to perform the above-mentioned method. Alternatively, the computer readable storage medium may be a ROM, a Random Access Memory (RAM), a CD-ROM, a magnetic tape, a floppy disk, an optical data storage device, and the like.
In an exemplary embodiment, the present disclosure also provides a computer program product comprising a computer program which, when executed by a processor of an electronic device, enables the electronic device to perform the picture generation method as described above.
Other embodiments of the disclosure will be apparent to those skilled in the art from consideration of the specification and practice of the disclosure disclosed herein. This disclosure is intended to cover any variations, uses, or adaptations of the disclosure following, in general, the principles of the disclosure and including such departures from the present disclosure as come within known or customary practice within the art to which the disclosure pertains. It is intended that the specification and examples be considered as exemplary only, with a true scope and spirit of the disclosure being indicated by the following claims.
It will be understood that the present disclosure is not limited to the precise arrangements described above and shown in the drawings and that various modifications and changes may be made without departing from the scope thereof. The scope of the present disclosure is limited only by the appended claims.
Claims (10)
1. A picture generation method is characterized by comprising the following steps:
acquiring a picture generation request; wherein the picture generation request comprises: text information and frame picture information, the frame picture information includes: frame pictures and corresponding frame characteristic information;
determining target size information of a text area according to the text information;
determining target size information of the picture sides to be zoomed of each frame picture unit in the frame picture, target size information of other picture sides and canvas size of canvas elements according to the target size information of the text area and the frame characteristic information;
and creating the canvas element according to the canvas size, and drawing each frame picture unit and the text area in the canvas element according to the target size information of the picture edge to be zoomed of each frame picture unit, the target size information of other picture edges and the target size information of the text area so as to generate a target picture.
2. The picture generation method according to claim 1, wherein the text information includes: attribute information of the text characters, the number of characters in each line and the number of lines; wherein the attribute information includes: font and font size;
the determining the target size information of the text region according to the text information includes:
determining the size information of the text characters according to the fonts and the font sizes of the text characters;
determining the width of the text area according to the size information of the text characters and the number of the characters in each line;
and determining the height of the text area according to the size information and the line number of the text characters.
3. The picture generation method according to claim 1, wherein the target size information of the text region includes target size information corresponding to each text edge of the text region;
determining, according to the target size information of the text region and the border feature information, target size information of a picture edge to be zoomed of each border picture unit in the border picture, target size information of other picture edges, and a canvas size of a canvas element, including:
determining a picture edge overlapped with the text edge in each picture edge as a picture edge to be zoomed aiming at each text edge of the text area;
determining the target size information of the text edge as the target size information of the image edge to be zoomed;
and determining the target size information of other picture sides and the canvas size of the canvas element according to the target size information of the picture side to be zoomed and the frame characteristic information.
4. The picture generation method according to claim 3, wherein the frame feature information includes: original size information corresponding to each picture side of each frame picture unit respectively;
determining the target size information of other picture edges and the canvas size of the canvas element according to the target size information of the picture edge to be zoomed and the frame characteristic information, comprising:
determining the original size information of the other image edges except the image edge to be zoomed in each image edge as the target size information of the other image edges;
and determining the canvas size of the canvas element according to the target size information of the picture edge to be zoomed and the target size information of the other picture edges.
5. The method according to claim 1, wherein the drawing the respective border picture unit and the text region in the canvas element according to the target size information of the picture edge to be zoomed of the respective border picture unit, the target size information of the other picture edges, and the target size information of the text region comprises:
determining the position information of each frame picture unit in the canvas element according to the target size information of the picture edge to be zoomed and the target size information of other picture edges;
determining the position information of the text area in the canvas element according to the position information of each frame picture unit in the canvas element and the target size information of the text area;
and drawing each frame picture unit and the text area in the canvas element according to the position information of each frame picture unit in the canvas element and the position information of the text area in the canvas element.
6. The picture generation method according to claim 5, wherein the frame feature information further includes: positional offset information of the text region;
the determining the location information of the text region in the canvas element comprises:
and determining the position information of the text area in the canvas element according to the position information of each frame picture unit in the canvas element, the position offset information and the target size information of the text area.
7. A picture generation apparatus, comprising:
an acquisition module configured to execute an acquisition picture generation request; wherein the picture generation request comprises: text information and frame picture information, the frame picture information includes: frame pictures and corresponding frame characteristic information;
a first determination module configured to perform determining target size information of a text region according to the text information;
a second determining module configured to perform determining, according to the target size information of the text region and the border feature information, target size information of a picture edge to be zoomed of each border picture unit in the border picture, target size information of other picture edges, and a canvas size of a canvas element;
and the drawing module is configured to create the canvas elements according to the canvas size, and draw the frame picture units and the text area in the canvas elements according to the target size information of the picture sides to be zoomed of the frame picture units, the target size information of other picture sides and the target size information of the text area so as to generate a target picture.
8. An electronic device, comprising:
a processor;
a memory for storing the processor-executable instructions;
wherein the processor is configured to execute the instructions to implement the picture generation method of any one of claims 1 to 6.
9. A computer-readable storage medium, whose instructions, when executed by a processor of an electronic device, enable the electronic device to perform the picture generation method of any of claims 1 to 6.
10. A computer program product comprising a computer program, characterized in that the computer program, when being executed by a processor, implements the picture generation method of any one of claims 1 to 6.
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202110322338.9A CN113096217B (en) | 2021-03-25 | 2021-03-25 | Picture generation method and device, electronic equipment and storage medium |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202110322338.9A CN113096217B (en) | 2021-03-25 | 2021-03-25 | Picture generation method and device, electronic equipment and storage medium |
Publications (2)
Publication Number | Publication Date |
---|---|
CN113096217A true CN113096217A (en) | 2021-07-09 |
CN113096217B CN113096217B (en) | 2023-05-09 |
Family
ID=76669680
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN202110322338.9A Active CN113096217B (en) | 2021-03-25 | 2021-03-25 | Picture generation method and device, electronic equipment and storage medium |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN113096217B (en) |
Cited By (1)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN114398125A (en) * | 2021-12-31 | 2022-04-26 | 深圳市珍爱捷云信息技术有限公司 | Point nine effect graph generation method and related device thereof |
Citations (6)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
US6741270B1 (en) * | 2000-01-19 | 2004-05-25 | Xerox Corporation | Systems and methods scaling a captured image using predetermined scale information |
US7590947B1 (en) * | 2004-05-28 | 2009-09-15 | Adobe Systems Incorporated | Intelligent automatic window sizing |
CN107577403A (en) * | 2017-09-12 | 2018-01-12 | 珠海智汇网络设备有限公司 | Text box method of combination, hand-held bill printer and its program recorded medium |
US20190188887A1 (en) * | 2017-12-14 | 2019-06-20 | Adobe Inc. | Text border tool and enhanced corner options for background shading |
CN112085818A (en) * | 2019-06-14 | 2020-12-15 | 腾讯数码(天津)有限公司 | Picture processing method and device |
CN113011131A (en) * | 2021-03-22 | 2021-06-22 | 掌阅科技股份有限公司 | Typesetting method based on picture electronic book, electronic equipment and storage medium |
-
2021
- 2021-03-25 CN CN202110322338.9A patent/CN113096217B/en active Active
Patent Citations (6)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
US6741270B1 (en) * | 2000-01-19 | 2004-05-25 | Xerox Corporation | Systems and methods scaling a captured image using predetermined scale information |
US7590947B1 (en) * | 2004-05-28 | 2009-09-15 | Adobe Systems Incorporated | Intelligent automatic window sizing |
CN107577403A (en) * | 2017-09-12 | 2018-01-12 | 珠海智汇网络设备有限公司 | Text box method of combination, hand-held bill printer and its program recorded medium |
US20190188887A1 (en) * | 2017-12-14 | 2019-06-20 | Adobe Inc. | Text border tool and enhanced corner options for background shading |
CN112085818A (en) * | 2019-06-14 | 2020-12-15 | 腾讯数码(天津)有限公司 | Picture processing method and device |
CN113011131A (en) * | 2021-03-22 | 2021-06-22 | 掌阅科技股份有限公司 | Typesetting method based on picture electronic book, electronic equipment and storage medium |
Cited By (2)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN114398125A (en) * | 2021-12-31 | 2022-04-26 | 深圳市珍爱捷云信息技术有限公司 | Point nine effect graph generation method and related device thereof |
CN114398125B (en) * | 2021-12-31 | 2024-02-27 | 深圳市珍爱捷云信息技术有限公司 | Point nine effect graph generation method and related device thereof |
Also Published As
Publication number | Publication date |
---|---|
CN113096217B (en) | 2023-05-09 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
JP4498146B2 (en) | MEDIA DISPLAY METHOD FOR COMPUTER DEVICE, COMPUTER DEVICE, COMPUTER PROGRAM | |
US8907990B2 (en) | Display system, display method, program, and recording medium | |
USRE43742E1 (en) | Method and system for enhanced detail-in-context viewing | |
CN107204023B (en) | Method and apparatus for avoiding distortion of graphics drawn in canvas | |
US8515176B1 (en) | Identification of text-block frames | |
CN105930464B (en) | Web rich media cross-screen adaptation method and device | |
US9135885B2 (en) | Resolution independent client side rendering | |
CN113536173B (en) | Page processing method and device, electronic equipment and readable storage medium | |
US7675529B1 (en) | Method and apparatus to scale graphical user interfaces | |
US10417310B2 (en) | Content inker | |
CN111915705A (en) | Picture visual editing method, device, equipment and medium | |
CN110443772B (en) | Picture processing method and device, computer equipment and storage medium | |
CN107122104B (en) | Data display method and device | |
JP4812077B2 (en) | DATA DISPLAY METHOD, DATA DISPLAY DEVICE, AND PROGRAM | |
CN113096217B (en) | Picture generation method and device, electronic equipment and storage medium | |
JP6395160B2 (en) | Document layout of electronic display | |
CN109800039B (en) | User interface display method and device, electronic equipment and storage medium | |
JP2996933B2 (en) | Drawing display device | |
CN109032476B (en) | Method for displaying big data set in graphical user interface | |
US10846878B2 (en) | Multi-axis equal spacing smart guides | |
CN112800373A (en) | Webpage resource data generation method and device, computer equipment and storage medium | |
CN102681755A (en) | Method, device and equipment for realizing display transformation of display object | |
CN111523288B (en) | Display method and device for aerial view of PDF document | |
CN111782333B (en) | Interface display method and device in game, storage medium and terminal equipment | |
JP7310980B2 (en) | Information processing device, graph display method and program |
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 | ||
GR01 | Patent grant | ||
GR01 | Patent grant |