Method and equipment for generating PDF (Portable Document Format) from page elements based on canvas and storage medium

By drawing page elements into the canvas canvas and cutting them in pieces, generating picture data, and then adding them to the PDF file stream, the problem of slow response speed caused by relying on fixed templates when generating PDF files on the server is solved, and the flexibility of PDF generation and response speed is improved.

CN119990063AActive Publication Date: 2025-05-13SHENZHEN SMARTCITY TECH DEV GRP CO LTD
View PDF 4 Cites 0 Cited by

Patent Information

Application Number
CN202510464946.1
Authority / Receiving Office
CN · China
Patent Type
Applications(China)
Current Assignee / Owner
Filing Date
2025-04-15
Publication Date
2025-05-13
Estimated Expiration
2045-04-15

AI Technical Summary

Technical Problem

When the server generates PDF files, the system response speed is slow due to relying on fixed templates.

Method used

By obtaining the page elements of the area to be exported on the page and drawing them on the canvas canvas, obtaining the height of the canvas canvas, determining the number of PDF sheets required, performing shard cutting, generating picture data, and adding it to the PDF file stream to generate a PDF file.

Benefits of technology

The flexibility of PDF generation is achieved without preset templates, which improves the flexibility and response speed of PDF generation.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN119990063A_ABST
    Figure CN119990063A_ABST
Patent Text Reader

Abstract

The invention discloses a method and equipment for generating a PDF (Portable Document Format) from a page element based on canvas, and a storage medium, and relates to the technical field of document processing, the method comprises the following steps: obtaining the page element of a to-be-exported region on a page, and drawing the page element on a canvas; obtaining the canvas height of the canvas, and determining the required number of PDFs based on the canvas height, the page size and the reserved blank margin; according to the number of the PDFs, performing fragmentation cutting on the canvas to generate picture data; and sequentially adding the picture data into the PDF file stream according to the sequence to generate a PDF file. According to the method and the device, the page elements are drawn to the canvas and are subjected to fragment cutting to generate the picture data, and then the picture data are added to the PDF file stream, so that the PDF can be flexibly generated without a preset template, and the flexibility and the response speed of PDF generation are effectively improved.
Need to check novelty before this filing date? Find Prior Art

Description

Technical Field

[0001] The present application relates to the field of document processing technology, and in particular to a method, device and storage medium for generating PDF from page elements based on canvas. Background Art

[0002] In the actual application scenario of generating PDF files, the client usually sends a network request containing specific parameters to the server. The server queries the data based on the received parameters and then generates the corresponding PDF file with the help of a pre-developed template. Since the server-side PDF generation relies on pre-developed templates, in the face of ever-changing business needs, once the PDF content or format needs to be adjusted, the template must be re-edited and modified, which reduces the system's response speed and efficiency. Summary of the invention

[0003] The main purpose of this application is to provide a method, device and storage medium for generating PDF from page elements based on canvas, aiming to solve the technical problem of slow system response speed caused by reliance on fixed templates when the server generates PDF files.

[0004] To achieve the above purpose, an embodiment of the present application provides a method for generating a PDF from page elements based on canvas, and the method for generating a PDF from page elements based on canvas includes: Get the page element of the area to be exported on the page, and draw the page element on the canvas; Obtain the canvas height of the canvas, and determine the required number of PDF pages based on the canvas height, page size, and reserved blank margins; According to the number of PDF sheets, the canvas is sliced ​​and cut into pieces to generate image data; The image data are added to the PDF file stream in sequence to generate a PDF file.

[0005] In one embodiment, before the step of obtaining the page element of the area to be exported on the page and drawing the page element on the canvas, the following steps are included: According to the received encoding instruction, identifying the area identifier in the encoding instruction; Based on the area identifier, the DOM structure of the page is queried, the area to be exported is located, and the area to be exported is marked and displayed.

[0006] In one embodiment, the step of obtaining page elements of the area to be exported on the page and drawing the page elements on a canvas includes: Traversing the DOM structure of the area to be exported, and obtaining the page elements in the area to be exported; According to the size information of the area to be exported, create a canvas of corresponding size; The page elements are drawn onto the canvas according to the layout and style of the page elements in the area to be exported.

[0007] In one embodiment, the step of obtaining the canvas height of the canvas and determining the required number of PDF pages based on the canvas height, the page size, and the reserved blank margin includes: Based on the properties of the canvas, obtain the canvas height of the canvas; Determine the available height of the PDF page according to the page size of the PDF page and the reserved blank margin of the page size; The required number of PDF sheets is calculated according to the canvas height and the available height, wherein if the calculated result is a decimal, it is rounded up.

[0008] In one embodiment, the step of slicing the canvas according to the number of PDF sheets to generate image data includes: Based on the number of PDF pages, the canvas is sliced ​​vertically according to the available height of each PDF page to obtain a plurality of canvas slices; Pixel point information of the canvas slice is extracted, and the pixel point information is encoded according to an encoding rule of a preset picture format to generate picture data corresponding to the canvas slice.

[0009] In one embodiment, the step of vertically slicing the canvas according to the available height of each PDF page based on the number of PDF pages to obtain a plurality of canvas slices further includes: Determine a pre-truncation position for slice cutting, and obtain color data of the pre-truncation position; The color data is compared with the background color. If the comparison result is consistent, the pre-truncation position is determined as the slice truncation point, and the slice cutting is completed according to the slice truncation point; If the comparison result is inconsistent, the pre-truncation position is adjusted, and the color data and the background color at the adjusted position are repeatedly compared until the fragmentation truncation point where the color data and the background color are consistent is found, and the fragmentation cutting is completed according to the fragmentation truncation point.

[0010] In one embodiment, the step of slicing the canvas according to the number of PDF sheets to generate image data further includes: When generating the image data, associating the image data corresponding to each canvas slice with the page sequence number of the PDF page; According to the sequence of the page numbers, the picture data are stored in sequence to obtain an ordered picture set.

[0011] In one embodiment, the step of adding the image data to the PDF file stream in sequence to generate the PDF file includes: Obtain the picture data from the picture collection in sequence; According to the page size of the PDF page and the reserved blank margin, the image data are added to the PDF file stream one by one, each of the image data corresponds to a PDF page; When all the picture data in the picture set are added to the file stream, the construction of the PDF file stream is finished and the PDF file is generated.

[0012] An embodiment of the present application also provides a device for generating a PDF from page elements based on canvas, wherein the device for generating a PDF from page elements based on canvas comprises: a memory, a processor, and a computer program stored in the memory and executable on the processor, wherein the computer program is configured to implement the steps of the method for generating a PDF from page elements based on canvas as described above.

[0013] An embodiment of the present application further provides a storage medium, which is a computer-readable storage medium. A computer program is stored on the storage medium. When the computer program is executed by a processor, the steps of the method for generating a PDF from page elements based on canvas as described above are implemented.

[0014] The embodiment of the present application discloses a method for generating PDF from page elements based on canvas, by obtaining page elements of the area to be exported on the page, and drawing the page elements on the canvas; obtaining the canvas height of the canvas, and determining the required number of PDF sheets based on the canvas height, page size, and reserved blank margins; according to the number of PDF sheets, the canvas is sliced ​​and cut to generate image data; the image data is sequentially added to the PDF file stream to generate a PDF file. The present application draws page elements on the canvas and slices and cuts to generate image data, and then adds the image data to the PDF file stream, so that PDF can be flexibly generated without a preset template, which effectively improves the flexibility and response speed of PDF generation. BRIEF DESCRIPTION OF THE DRAWINGS

[0015] Figure 1This is a flowchart of a first embodiment of a method for generating a PDF from page elements based on canvas according to an embodiment of the present application; Figure 2 This is a schematic diagram of the effect of determining the area to be exported according to the first embodiment of the method for generating PDF from page elements based on canvas involved in the embodiment of the present application; Figure 3 This is a flow chart of a second embodiment of a method for generating a PDF from page elements based on canvas according to an embodiment of the present application; Figure 4 This is a flowchart of a third embodiment of a method for generating a PDF from page elements based on canvas according to an embodiment of the present application; Figure 5 This is a flowchart of a fourth embodiment of a method for generating a PDF from page elements based on canvas according to an embodiment of the present application; Figure 6 This is a flowchart of a fifth embodiment of a method for generating a PDF from page elements based on canvas according to an embodiment of the present application; Figure 7 This is a flowchart of a sixth embodiment of a method for generating a PDF from page elements based on canvas according to an embodiment of the present application; Figure 8 This is a schematic diagram of the structure of a device for generating PDF from page elements based on canvas according to an embodiment of the present application.

[0016] The purpose, features and advantages of this application will be further described in conjunction with the embodiments and with reference to the accompanying drawings. DETAILED DESCRIPTION

[0017] It should be understood that the specific embodiments described herein are only used to explain the present application and are not used to limit the present application.

[0018] In the actual application scenario of generating PDF files, the client usually sends a network request containing specific parameters to the server. The server queries the data based on the received parameters and then generates the corresponding PDF file with the help of a pre-developed template. Since the server-side PDF generation relies on pre-developed templates, in the face of ever-changing business needs, once the PDF content or format needs to be adjusted, the template must be re-edited and modified, which reduces the system's response speed and efficiency.

[0019] In order to solve the above-mentioned defects existing in the related art, the embodiment of the present application proposes a method for generating PDF from page elements based on canvas, which obtains the page elements of the area to be exported on the page and draws the page elements on the canvas; obtains the canvas height of the canvas, and determines the required number of PDF sheets based on the canvas height, page size and reserved blank margin; according to the number of PDF sheets, the canvas is sliced ​​and cut to generate image data; the image data is added to the PDF file stream in sequence to generate a PDF file. The present application draws page elements on the canvas and slices them to generate image data, and then adds the image data to the PDF file stream, so that PDF can be flexibly generated without a preset template, which effectively improves the flexibility and response speed of PDF generation.

[0020] It should be noted that the execution subject of this embodiment can be a system for generating PDF from page elements based on canvas, or a computing service device with data processing, network communication and program running functions, such as a tablet computer, a personal computer, a mobile phone, etc., or a device for generating PDF from page elements based on canvas that can realize the above functions, etc. The following takes a system for generating PDF from page elements based on canvas as an example to illustrate this embodiment and the following embodiments.

[0021] The method of generating PDF from page elements based on canvas in the first embodiment of this application is provided in the following description. Figure 1 The method comprises steps S10 to S40: Step S10: Obtain page elements of the area to be exported on the page, and draw the page elements on the canvas.

[0022] Page elements refer to the various elements that make up the content of a web page, such as text, images, tables, and buttons. These elements exist in the form of DOM (Document Object Model) in a web page. DOM is a structured representation of web page content, which decomposes web page content into multiple nodes and objects, allowing users to operate on web page content through programming languages ​​(such as JavaScript).

[0023] Canvas is an HTML element used for drawing graphics. It provides users with an area where they can draw through scripts (usually JavaScript), similar to a virtual canvas. Users can draw various graphics and display content on the canvas.

[0024] In this embodiment, the DOM operation function provided by the browser is used to locate the identifier of the area to be exported, and all page elements in the area to be exported on the page are obtained. Then, the visual representation of the page elements is drawn on the canvas by using the canvas drawing API.

[0025] For example, for text elements in the area to be exported, you can use the text drawing function of canvas (such as fillText method) to set the font, size, color and other properties of the text, and then draw it to the specified position. For image elements in the area to be exported, you can use the image drawing method of canvas (such as drawImage method) to load the image onto the canvas, and scale and position it as required.

[0026] In an optional implementation, the area to be exported is the entire page by default. If the user has a specific requirement, each area can be marked during coding, such as using a custom class name or data attribute, to facilitate the user to select the area to be exported. The marking process can be added to the corresponding HTML element through CSS or JavaScript code, so that different areas can be distinguished at the code level.

[0027] In addition, when the user interactively selects the area to be exported, JavaScript can be used to add event triggers (such as click events). When the user clicks an area on the page, the markup information of the corresponding area will be recorded. At the same time, the style of the corresponding area is dynamically modified through DOM operations to make the corresponding area visually selectable, such as adding borders, changing background colors, and modifying font colors or font sizes.

[0028] For example, please refer to Figure 2 , Figure 2 This is a schematic diagram of the effect of determining the area to be exported. When the user does not specify a specific area, the area to be exported covers the entire page content by default. If the user needs to specify an area, he can mark an area on the page through coding and set the corresponding area as the area to be exported. At this time, the corresponding area to be exported will be distinguished and displayed on the entire page by a border or background color to ensure that the user can intuitively identify and confirm the area to be exported.

[0029] Step S20: Obtain the canvas height of the canvas, and determine the required number of PDF pages based on the canvas height, page size, and reserved blank margins.

[0030] After drawing the page elements to the canvas, you need to convert the elements in the canvas into a PDF file. Since PDF files are in paged form and the canvas is a continuous area, the canvas needs to be paged.

[0031] In an optional embodiment, step S20 includes steps S210 to S230: Step S210: Based on the properties of the canvas, the height of the canvas is obtained.

[0032] In this embodiment, the attribute value of the canvas element is obtained by programming, so as to obtain the size of the canvas in the vertical direction and determine the height of the canvas.

[0033] Step S220: determining the available height of the PDF page according to the page size of the PDF page and the reserved blank margin of the page size.

[0034] Step S230: Calculate the required number of PDF sheets according to the canvas height and the available height, wherein if the calculated result is a decimal, round it up.

[0035] Page size refers to the size of the final generated PDF page. The PDF page size usually follows the international standard ISO216, such as the common A4 paper size. The blank margin is reserved to ensure the beauty and readability of the PDF page, and the blank space around the PDF page.

[0036] In this embodiment, the blank margins reserved at the top and bottom of the PDF page are first subtracted from the page size of the PDF page to determine the page height actually used to display the content of the PDF page. Then, the canvas height of the canvas is divided by the actual available page height to obtain the required number of PDF sheets.

[0037] If it cannot be divided evenly, the extra part will occupy a separate PDF page, so the result needs to be rounded up.

[0038] For example, if the PDF page size is determined to be A4, the A4 paper size is 210mm*297mm, and the reserved blank margins are 10mm, then the actual available display area in each PDF page is 190mm*277mm. The total height of the obtained canvas is 3450mm, so the required number of PDF pages can be calculated as pageNum=3450 / 277, and pageNum=13 pages can be rounded up.

[0039] Step S30: According to the number of PDF sheets, the canvas is sliced ​​and cut into pieces to generate image data.

[0040] Since the canvas is a continuous drawing area and the PDF document is in paged form, in order to distribute the elements in the canvas to each PDF page, the canvas needs to be sliced ​​according to the number of PDF pages.

[0041] In an optional implementation, step S30 includes steps S310 to S320: Step S310: based on the number of PDF pages, the canvas is sliced ​​vertically according to the available height of each PDF page to obtain a plurality of canvas slices.

[0042] Step S320: extracting pixel information of the canvas slice, and encoding the pixel information according to a coding rule of a preset picture format to generate picture data corresponding to the canvas slice.

[0043] In this embodiment, pixel information is the basic unit that constitutes the canvas slice, including information such as color and transparency, and is used to describe the visual content of the canvas slice. Different image formats have different encoding methods. Therefore, it is necessary to pre-set the conversion of pixel information into a certain image format (such as JPEG, PNG, etc.), and then follow the corresponding encoding rules to convert the pixel information into data in the preset image format.

[0044] Specifically, first, based on the canvas height of the canvas, the required number of PDF pages and the available height of each PDF page, the height of each canvas slice is calculated. Then, based on the height of each canvas slice, the canvas is divided into multiple parts in the vertical direction, each of which corresponds to a PDF page.

[0045] For example, the height of the canvas is H, the number of required PDF sheets is n, and the height of each canvas slice is H / n. For each canvas slice, the image data extraction API of the canvas is used to extract the visual content in the canvas slice and convert the canvas slice into image data.

[0046] Next, traverse from the starting position to the ending position of each canvas slice to extract the pixel information of each canvas slice, and encode the extracted pixel information according to the encoding rules of the preset picture format.

[0047] Different image formats have different encoding algorithms. For example, the JPEG format can use an encoding method based on a compression algorithm, while the PNG format takes into account its support for transparency and lossless compression characteristics, converts pixel information into binary data of the image format, and generates image data corresponding to the canvas slices.

[0048] Step S40: adding the image data to the PDF file stream in sequence to generate a PDF file.

[0049] PDF file stream is a way to store and process PDF data in memory or during transmission. It combines various elements in a certain order and gradually forms the final PDF file. In this process, PDF file stream temporarily stores information of various PDF elements, including page layout, images, text, etc., and finally generates a complete PDF file.

[0050] In this embodiment, the acquired image data is arranged according to the order of slicing the canvas to ensure that the order of the image data is consistent with the layout order of the original canvas. Then, the image data is added to the PDF file stream in sequence using the API provided by the PDF generation tool or PDF generation library. Finally, the data stored in the PDF file stream is converted into a storable and viewable PDF file to complete the conversion from page elements to PDF files, so that the finally generated PDF file can be consistent with the layout and content of the original page elements.

[0051] It should be noted that in the process of adding image data to the PDF file stream, the corresponding page attributes such as page size, position, resolution, etc. will be set for each image data according to the PDF file format specification to ensure that the image can be displayed correctly in the PDF page.

[0052] Please refer to Figure 3 The method for generating PDF from page elements based on canvas in the second embodiment of the present application includes steps S101 to S102 before step S10: Step S101: according to the received encoding instruction, identifying the area identifier in the encoding instruction.

[0053] Step S102: Based on the area identifier, query the DOM structure of the page, locate the area to be exported, and mark and display the area to be exported.

[0054] The encoding instruction is an instruction that includes the user's required information, which is presented in the form of encoding and includes the region identifier specified by the user. The region identifier is a mark used to uniquely identify a region in the page. The region identifier can be the ID, class name, or other custom attributes of the element. Through the region identifier, the region to be exported can be accurately filtered and located in the DOM structure of the page.

[0055] The DOM structure is a hierarchical representation of web page content, which allows users to access and manipulate page elements in the page through programming. In the DOM structure, each node represents an HTML element, including the element's attributes, child elements and other information.

[0056] After receiving the encoding instruction, identify the area identifier encoded in the instruction, and then locate the area to be exported by traversing the DOM tree or using the DOM query method. In order to confirm the selected area to the user, the system will mark the selected area. The area to be exported can be highlighted by changing the border color of the area, adding shadows or highlighting and other visual effects. Specifically, the marking display of the area to be exported can be achieved by modifying the style attributes of the DOM element, such as setting CSS border, box-shadow or background-color attributes.

[0057] Please refer to Figure 4 In the method for generating PDF from page elements based on canvas in the third embodiment of the present application, step S10 includes steps S110 to S130: Step S110: traverse the DOM structure of the area to be exported, and obtain the page elements in the area to be exported.

[0058] In this embodiment, according to the determined area identifier of the area to be exported, the DOM structure of the area to be exported is traversed through the DOM operation function of the programming language, each node is checked in turn, and the DOM object is obtained to extract the page elements in the area to be exported.

[0059] Step S120: creating a canvas of a corresponding size according to the size information of the area to be exported.

[0060] In this embodiment, according to the acquired size information of the area to be exported, a canvas of corresponding size is created using the creation function of the canvas element to ensure that the canvas can completely cover the area to be exported and provide enough space for drawing page elements.

[0061] Step S130: drawing the page elements onto the canvas according to the layout and style of the page elements in the area to be exported.

[0062] Use the corresponding canvas drawing operations for different types of page elements. Draw the page elements on the canvas with the correct shape, position and size according to the style attributes of different types of page elements in the DOM structure, ensuring that the drawn page elements on the canvas can maintain the original layout and style of the original page.

[0063] Please refer to Figure 5 Based on the above embodiments of the present application, the present application proposes a method for generating a PDF from page elements based on canvas in the fourth embodiment, wherein step S310 further includes steps S311 to S313: Step S311: determine the pre-truncation position for slice cutting, and obtain color data of the pre-truncation position.

[0064] When the canvas is sliced ​​vertically according to the available height of the PDF page, the element content may be truncated. In order to avoid truncating part of the content of an element to different pages, it is necessary to determine whether the current pre-truncation position is the final truncation point based on the color of the pre-truncation position.

[0065] The pre-truncation position is calculated based on the canvas height of the canvas, the determined number of PDF pages, and the available height of each PDF page, and the pre-truncation position of the slice cutting is obtained by calculating the slice height of each canvas slice.

[0066] Color data refers to the color information of the pixel at the pre-truncation position, including RGB value, transparency, etc. By obtaining the color data of the pre-truncation position, it can be determined whether the position is suitable as the fragmentation truncation point.

[0067] Background color refers to the background color of the page or canvas.

[0068] Step S312: Compare the color data with the background color. If the comparison result is consistent, determine the pre-truncation position as the slice truncation point, and complete the slice cutting according to the slice truncation point.

[0069] When judging whether the pre-truncation position is the final fragmentation truncation point, the background color is used as a reference standard to compare with the color data of the pre-truncation position. If the color data of the pre-truncation position is consistent with the background color, such as the same RGB value, it means that the pre-truncation position is in the blank area between page elements. Therefore, the pre-truncation position can be used as the final fragmentation truncation point and the fragmentation cutting is completed.

[0070] Step S313: If the comparison result is inconsistent, adjust the pre-truncation position, and repeatedly compare the color data and the background color at the adjusted position until the fragmentation truncation point where the color data and the background color are consistent is found, and complete the fragmentation cutting according to the fragmentation truncation point.

[0071] If the comparison results are inconsistent, it means that the pre-truncation position may be located in the middle of a page element. Slicing according to this pre-truncation position will truncate a complete page element. Therefore, the pre-truncation position needs to be adjusted. The adjustment operation can be to fine-tune the pre-truncation position up or down by a certain pixel unit, then obtain the color data of the adjusted position again, and repeat the comparison operation with the background color.

[0072] By continuously adjusting the pre-truncation position and comparing the color of the adjusted position with the background color, until a position is found whose color data is consistent with the background color, it is ensured that the position is suitable as the slicing truncation point. Finally, the adjusted pre-truncation position is used as the slicing truncation point to complete the slicing and cut the adjusted canvas into canvas slices.

[0073] This embodiment ensures that each canvas slice after slice cutting is relatively complete in content through color contrast and position adjustment, avoids unreasonable truncation of page elements, and thus improves the quality and readability of the PDF generated file.

[0074] Please refer to Figure 6 In the method for generating PDF from page elements based on canvas in the fifth embodiment of the present application, step S30 further includes steps S330 to S340: Step S330: when generating the image data, associating the image data corresponding to each canvas slice with the page sequence number of the PDF page.

[0075] In the process of slicing the canvas and converting it into image data, multiple image data will be generated. However, without clear order management, these image data will cause the final PDF page order to be chaotic. In order to ensure the correct arrangement of the order of pages and content in the final generated PDF file, these image data need to be organized in order. Therefore, assigning a number to each PDF page represents the order of the PDF page in the PDF file, which is convenient for distinguishing and sorting different pages.

[0076] Specifically, when generating the image data corresponding to each canvas slice, the page number of the corresponding PDF page is assigned to each image data according to the number of PDF sheets and the position of the current canvas slice in the entire canvas slice. For example, when processing the first canvas slice, the image data corresponding to the canvas slice is assigned to the PDF page with page number 1, the image data corresponding to the second canvas slice is assigned to the PDF page with page number 2, and so on.

[0077] Step S340: storing the image data in sequence according to the order of the page numbers to obtain an ordered image set.

[0078] According to the order of the page numbers of the PDF pages, the generated image data are stored in sequence to obtain an ordered image collection. During the storage process, a data structure such as an array or a list is used to store the image data according to the size of the page number. When a new image data is generated, it is inserted into the corresponding position according to the page number associated with the image data, ensuring that the stored image collection is arranged in ascending or descending order of the page number.

[0079] Please refer to Figure 7 In the sixth embodiment of the present application, the method for generating PDF from page elements based on canvas, step S40 includes steps S410 to S430: Step S410: sequentially obtain the picture data from the picture set.

[0080] In the above embodiment, the canvas slices of the canvas have been converted into image data and stored in the image collection. Then the image data needs to be added to the PDF file. PDF is a paged file, so each image data needs to be added as a separate PDF page.

[0081] Step S420: adding the image data to the PDF file stream one by one according to the page size of the PDF page and the reserved blank margin, each image data corresponding to a PDF page.

[0082] In this embodiment, the actual available space of the image data in the PDF page is first calculated according to the page size and the reserved blank margin of the PDF page, so as to properly layout and scale the image data to ensure that the image is reasonably displayed in the page.

[0083] Then use the API provided by the PDF generation tool or PDF generation library to add the image data to the PDF file stream. During the adding process, adjust the position and size of the image data according to the page size of the PDF page, the reserved blank margin, and the size of the image data so that the image data fits the display range of the PDF page.

[0084] Exemplarily, the add picture function of the PDF generation library is called, the picture data is taken as a parameter, and information such as the page size of the PDF page and the reserved blank margin is passed, so that the picture data can be correctly displayed in the PDF page.

[0085] Step S430: When all the image data in the image set are added to the file stream, the construction of the PDF file stream is terminated and the PDF file is generated.

[0086] In this embodiment, the picture data is continuously taken out from the picture set and added to the PDF file stream until there is no remaining picture data in the picture set. After all the picture data are added, the file generation operation is triggered to convert the data stored in the PDF file stream into the final PDF file.

[0087] This embodiment uses a storage structure and a PDF generation tool to add the image data generated by canvas slicing to the PDF file stream in an orderly manner, and finally generates a complete PDF file, thereby realizing the conversion from image data to a PDF file, while ensuring that the page layout and content display of the generated PDF file are consistent with the original page.

[0088] An embodiment of the present application provides a device for generating a PDF from page elements based on canvas, and the device for generating a PDF from page elements based on canvas includes: at least one processor; and a memory communicatively connected to the at least one processor; wherein the memory stores instructions executable by the at least one processor, and the instructions are executed by the at least one processor so that the at least one processor can execute the method for generating a PDF from page elements based on canvas in the above-mentioned embodiment 1.

[0089] Reference below Figure 8 , which shows a schematic diagram of a structure of a device suitable for implementing an embodiment of the present application to generate a PDF from page elements based on canvas. The device for generating a PDF from page elements based on canvas in the embodiment of the present application may include various hardware and software components for implementing a method for generating a PDF from page elements based on canvas. Figure 8 The device for generating PDF from page elements based on canvas is only an example and should not bring any limitation to the functions and scope of use of the embodiments of the present application.

[0090] like Figure 8As shown, the device for generating PDF from page elements based on canvas may include a processing device 1001 (such as a central processing unit, a graphics processor, etc.), which can perform various appropriate actions and processes according to a program stored in a read-only memory (ROM: Read Only Memory) 1002 or a program loaded from a storage device 1003 to a random access memory (RAM: Random Access Memory) 1004. In RAM1004, various programs and data required for the operation of the device for generating PDF from page elements based on canvas are also stored. The processing device 1001, ROM1002 and RAM1004 are connected to each other through a bus 1005. An input / output (I / O) interface 1006 is also connected to the bus. Generally, the following systems can be connected to the I / O interface 1006: an input device 1007 including, for example, a touch screen, a touch pad, a keyboard, etc.; an output device 1008 including, for example, a liquid crystal display (LCD: Liquid Crystal Display), a speaker, a vibrator, etc.; a storage device 1003 including, for example, a magnetic tape, a hard disk, etc.; and a communication device 1009. The communication device 1009 can allow the device for generating PDF from page elements based on canvas to communicate wirelessly or wired with other devices to exchange data. Although the figure shows a device for generating PDF from page elements based on canvas with various systems, it should be understood that it is not required to implement or have all the systems shown. More or fewer systems can be implemented or provided instead.

[0091] In particular, according to the embodiments disclosed in the present application, the process described above with reference to the flowchart can be implemented as a computer software program. For example, the embodiments disclosed in the present application include a computer program product, which includes a computer program carried on a computer-readable medium, and the computer program includes a program code for executing the method shown in the flowchart. In such an embodiment, the computer program can be downloaded and installed from a network through a communication device, or installed from a storage device 1003, or installed from a ROM 1002. When the computer program is executed by the processing device 1001, the above-mentioned functions defined in the method of the embodiment disclosed in the present application are executed.

[0092] The device for generating PDF from page elements based on canvas provided by the present application adopts the method for generating PDF from page elements based on canvas in the above embodiment, which can solve the technical problem of slow system response speed due to reliance on fixed templates when the server generates PDF files. Compared with the prior art, the beneficial effects of the device for generating PDF from page elements based on canvas provided by the present application are the same as the beneficial effects of the method for generating PDF from page elements based on canvas provided by the above embodiment, and other technical features in the device for generating PDF from page elements based on canvas are the same as the features disclosed in the method of the previous embodiment, which will not be repeated here.

[0093] It should be understood that the various parts disclosed in this application can be implemented by hardware, software, firmware or a combination thereof. In the description of the above embodiments, specific features, structures, materials or characteristics can be combined in any one or more embodiments or examples in a suitable manner.

[0094] The above is only a specific implementation of the present application, but the protection scope of the present application is not limited thereto. Any person skilled in the art who is familiar with the present technical field can easily think of changes or substitutions within the technical scope disclosed in the present application, which should be included in the protection scope of the present application. Therefore, the protection scope of the present application should be based on the protection scope of the claims.

[0095] An embodiment of the present application provides a computer-readable storage medium having computer-readable program instructions (ie, a computer program) stored thereon, and the computer-readable program instructions are used to execute the method for generating a PDF from page elements based on canvas in the above embodiment.

[0096] The computer-readable storage medium provided in the present application may be, for example, a USB flash drive, but is not limited to electrical, magnetic, optical, electromagnetic, infrared, or semiconductor systems, systems or devices, or any combination of the above. More specific examples of computer-readable storage media may include, but are not limited to: an electrical connection with one or more wires, a portable computer disk, a hard disk, a random access memory (RAM: Random Access Memory), a read-only memory (ROM: Read Only Memory), an erasable programmable read-only memory (EPROM: Erasable Programmable Read Only Memory or flash memory), an optical fiber, a portable compact disk read-only memory (CD-ROM: CD-Read Only Memory), an optical storage device, a magnetic storage device, or any suitable combination of the above. In this embodiment, the computer-readable storage medium may be any tangible medium containing or storing a program, which may be used by or in combination with an instruction execution system, system or device. The program code contained on the computer-readable storage medium may be transmitted using any appropriate medium, including but not limited to: wires, optical cables, RF (Radio Frequency: Radio Frequency), etc., or any suitable combination of the above.

[0097] The computer-readable storage medium may be included in a device that generates a PDF from page elements based on canvas; or may exist independently without being assembled into a device that generates a PDF from page elements based on canvas.

[0098] The computer-readable storage medium carries one or more programs. When the one or more programs are executed by a device that generates PDF from page elements based on canvas, the device that generates PDF from page elements based on canvas: obtains page elements of the area to be exported on the page, and draws the page elements on the canvas; obtains the canvas height of the canvas, and determines the required number of PDF sheets based on the canvas height, page size, and reserved blank margins; slices the canvas according to the number of PDF sheets to generate image data; and adds the image data to the PDF file stream in sequence to generate a PDF file.

[0099] Computer program code for performing the operations of the present application may be written in one or more programming languages ​​or a combination thereof, including object-oriented programming languages ​​such as Java, Smalltalk, C++, and conventional procedural programming languages ​​such as "C" or similar programming languages. The program code may be executed entirely on the user's computer, partially on the user's computer, as a separate software package, partially on the user's computer and partially on a remote computer, or entirely on a remote computer or server. In the case of a remote computer, the remote computer may be connected to the user's computer through any type of network, including a local area network (LAN) or a wide area network (WAN), or may be connected to an external computer (e.g., via the Internet using an Internet service provider).

[0100] The flow chart and block diagram in the accompanying drawings illustrate the possible architecture, function and operation of the system, method and computer program product according to various embodiments of the present application. In this regard, each box in the flow chart or block diagram can represent a module, a program segment or a part of a code, and the module, the program segment or a part of the code contains one or more executable instructions for realizing the specified logical function. It should also be noted that in some alternative implementations, the functions marked in the box can also occur in a sequence different from that marked in the accompanying drawings. For example, two boxes represented in succession can actually be executed substantially in parallel, and they can sometimes be executed in the opposite order, depending on the functions involved. It should also be noted that each box in the block diagram and / or flow chart, and the combination of the boxes in the block diagram and / or flow chart can be implemented with a dedicated hardware-based system that performs the specified function or operation, or can be implemented with a combination of dedicated hardware and computer instructions.

[0101] The modules involved in the embodiments described in the present application may be implemented by software or hardware, wherein the name of the module does not constitute a limitation on the unit itself in some cases.

[0102] The readable storage medium provided by the present application is a computer-readable storage medium, which stores computer-readable program instructions (i.e., computer programs) for executing the above-mentioned method of generating PDF from page elements based on canvas, and can solve the technical problem of slow system response speed due to reliance on fixed templates when the server generates PDF files. Compared with the prior art, the beneficial effects of the computer-readable storage medium provided by the present application are the same as the beneficial effects of the method of generating PDF from page elements based on canvas provided by the above-mentioned embodiment, and will not be repeated here.

[0103] An embodiment of the present application provides a computer program product, including a computer program, which, when executed by a processor, implements the steps of the above-mentioned method of generating a PDF from page elements based on canvas.

[0104] The computer program product provided by the present application can solve the technical problem that when the server generates a PDF file, the system response speed is slow due to reliance on a fixed template. Compared with the prior art, the beneficial effects of the computer program product provided by the embodiment of the present application are the same as the beneficial effects of the method for generating a PDF from page elements based on canvas provided by the above embodiment, and will not be repeated here.

[0105] The above are only preferred embodiments of the present application, and are not intended to limit the patent scope of the present application. Any equivalent structure or equivalent process transformation made using the contents of the present application specification and drawings, or directly or indirectly applied in other related technical fields, are also included in the patent processing scope of the present application.

[0106] It should be noted that, in this article, the terms "include", "comprises" or any other variations thereof are intended to cover non-exclusive inclusion, so that a process, method, article or system including a series of elements includes not only those elements, but also other elements not explicitly listed, or also includes elements inherent to such process, method, article or system. In the absence of further restrictions, an element defined by the sentence "comprises a ..." does not exclude the existence of other identical elements in the process, method, article or system including the element.

[0107] Through the description of the above implementation methods, those skilled in the art can clearly understand that the above embodiment methods can be implemented by means of software plus a necessary general hardware platform, and of course by hardware, but in many cases the former is a better implementation method.

[0108] The above are only preferred embodiments of the present application, and are not intended to limit the patent scope of the present application. Any equivalent structure or equivalent process transformation made using the contents of the present application specification and drawings, or directly or indirectly applied in other related technical fields, are also included in the patent protection scope of the present application.

Claims

1. A method for generating PDF from page elements based on canvas, characterized in that: The method for generating PDF from page elements based on canvas includes: Get the page element of the area to be exported on the page, and draw the page element on the canvas; Obtain the canvas height of the canvas, and determine the required number of PDF pages based on the canvas height, page size, and reserved blank margins; According to the number of PDF sheets, the canvas is sliced ​​and cut into pieces to generate image data; The image data are added to the PDF file stream in sequence to generate a PDF file.

2. The method for generating PDF from page elements based on canvas according to claim 1, characterized in that: Before the step of obtaining the page element of the area to be exported on the page and drawing the page element on the canvas, the method includes: According to the received encoding instruction, identifying the area identifier in the encoding instruction; Based on the area identifier, the DOM structure of the page is queried, the area to be exported is located, and the area to be exported is marked and displayed.

3. The method for generating PDF from page elements based on canvas according to claim 1, characterized in that: The step of obtaining the page elements of the area to be exported on the page and drawing the page elements on the canvas comprises: Traversing the DOM structure of the area to be exported, and obtaining the page elements in the area to be exported; According to the size information of the area to be exported, create a canvas of corresponding size; The page elements are drawn onto the canvas according to the layout and style of the page elements in the area to be exported.

4. The method for generating PDF from page elements based on canvas according to claim 1, characterized in that: The step of obtaining the canvas height of the canvas and determining the required number of PDF sheets based on the canvas height, the page size, and the reserved blank margin includes: Based on the properties of the canvas, obtain the canvas height of the canvas; Determine the available height of the PDF page according to the page size of the PDF page and the reserved blank margin of the page size; The required number of PDF sheets is calculated according to the canvas height and the available height, wherein if the calculated result is a decimal, it is rounded up.

5. The method for generating PDF from page elements based on canvas according to claim 1, characterized in that: The step of cutting the canvas into pieces according to the number of PDF sheets to generate image data comprises: Based on the number of PDF pages, the canvas is sliced ​​vertically according to the available height of each PDF page to obtain a plurality of canvas slices; Pixel point information of the canvas slice is extracted, and the pixel point information is encoded according to an encoding rule of a preset picture format to generate picture data corresponding to the canvas slice.

6. The method for generating PDF from page elements based on canvas as claimed in claim 5, characterized in that: The step of vertically slicing the canvas according to the available height of each PDF page based on the number of PDF pages to obtain a plurality of canvas slices further includes: Determine a pre-truncation position for slice cutting, and obtain color data of the pre-truncation position; The color data is compared with the background color. If the comparison result is consistent, the pre-truncation position is determined as the slice truncation point, and the slice cutting is completed according to the slice truncation point; If the comparison result is inconsistent, the pre-truncation position is adjusted, and the color data and the background color at the adjusted position are repeatedly compared until the fragmentation truncation point where the color data and the background color are consistent is found, and the fragmentation cutting is completed according to the fragmentation truncation point.

7. The method for generating PDF from page elements based on canvas according to claim 1, characterized in that: The step of cutting the canvas into pieces according to the number of PDF sheets to generate image data also includes: When generating the image data, associating the image data corresponding to each canvas slice with the page sequence number of the PDF page; According to the sequence of the page numbers, the picture data are stored in sequence to obtain an ordered picture set.

8. The method for generating PDF from page elements based on canvas according to claim 1, characterized in that: The step of adding the image data to the PDF file stream in sequence to generate a PDF file comprises: Obtain the picture data from the picture collection in sequence; According to the page size of the PDF page and the reserved blank margin, the image data are added to the PDF file stream one by one, each of the image data corresponds to a PDF page; When all the picture data in the picture set are added to the file stream, the construction of the PDF file stream is finished and the PDF file is generated.

9. A device for generating PDF from page elements based on canvas, characterized in that: The device for generating a PDF from page elements based on canvas comprises: a memory, a processor, and a computer program stored in the memory and executable on the processor, wherein the computer program is configured to implement the steps of the method for generating a PDF from page elements based on canvas as described in any one of claims 1 to 8.

10. A storage medium, characterized in that: The storage medium is a computer-readable storage medium, and a computer program is stored on the storage medium. When the computer program is executed by a processor, the steps of the method for generating a PDF from page elements based on canvas according to any one of claims 1 to 8 are implemented.

Citation Information

Patent Citations

  • Method and device for converting PDF document, terminal and medium

    CN111859865A

  • PDF format data exporting method and device, electronic equipment and readable storage medium

    CN114004209A

  • Method for converting webpage into pdf capable of being paged

    CN117591766A

  • Implementation method for converting front-end page into PDF (Portable Document Format) and improving definition of PDF based on canvas

    CN118428323A