A method, apparatus, device and storage medium for rendering a PDF file

Abstract

This invention discloses a method, apparatus, device, and storage medium for rendering PDF files. The method includes: acquiring a PDF file to be processed and parsing the page content in the PDF file to obtain multiple drawing commands for describing various graphic elements in the page content; reconstructing the multiple drawing commands for describing the same graphic element into corresponding graphic element objects; wherein the graphic element object is structured data encapsulating graphic feature information representing the graphic element; converting each graphic element object into a corresponding three-dimensional entity object using a three-dimensional rendering engine; wherein the three-dimensional entity object is the visual form of the graphic element in three-dimensional space; and rendering all three-dimensional entity objects into the same three-dimensional space through the three-dimensional rendering engine, so that the page content in the PDF file is visualized in the three-dimensional space. This invention achieves efficient rendering and smooth interaction, improving the user experience.

Description

Technical Field

[0001] This invention relates to the field of document information processing technology, and in particular to a method, apparatus, device, and storage medium for rendering PDF files. Background Technology

[0002] The existing method of rendering PDF files in the browser using PDF.js has inherent performance and experience bottlenecks in page scaling, specifically including: (1) Response latency: When rendering pages containing complex graphics or high-resolution images, scaling operations cause significant computational delays and interface stuttering, resulting in poor interactive smoothness; (2) Poor visual experience: During zooming, there is a noticeable refresh process from low-quality images to high-quality images, producing visual blanks and flickering; (3) High resource consumption: At high scaling ratios, the memory usage of the Canvas buffer increases exponentially, consuming huge amounts of system resources, especially in multi-page document scenarios, which can easily lead to memory overflow; (4) Weak support for continuous scaling: It is difficult to maintain high frame rates and real-time rendering in smooth continuous scaling interactions. Therefore, how to solve the problems of low rendering efficiency and poor interactive experience in the existing PDF file rendering methods has become a technical problem that needs to be solved by those skilled in the art. Summary of the Invention

[0003] The purpose of this invention is to provide a method, apparatus, device, and storage medium for rendering PDF files. By converting the content of PDF documents into independent objects in three-dimensional space, efficient rendering and smooth interaction are achieved, significantly improving the user experience.

[0004] According to one aspect of the present invention, a method for rendering a PDF file is provided, the method comprising:

[0005] Obtain the PDF file to be processed, parse the page content in the PDF file, and obtain multiple drawing commands to describe each graphic element in the page content;

[0006] Multiple drawing commands used to describe the same graphic element are reconstructed into corresponding graphic element objects; wherein, the graphic element object is structured data that encapsulates graphic feature information representing the graphic element;

[0007] Each graphic element object is converted into a corresponding three-dimensional entity object using a 3D rendering engine; wherein, the three-dimensional entity object is the visual form of the graphic element in three-dimensional space.

[0008] The 3D rendering engine renders all 3D entity objects into the same 3D space, so that the page content in the PDF file can be visualized in the 3D space.

[0009] Optionally, the step of reconstructing multiple drawing commands used to describe the same graphic element into corresponding graphic element objects includes:

[0010] The path coordinate information, coordinate transformation matrix, and path style information are parsed from multiple drawing commands used to describe a line path element to form a line path object;

[0011] The region outline coordinates, coordinate transformation matrix, and fill style information are parsed from multiple drawing commands used to describe a filled region element to form a filled region object.

[0012] The text content, text coordinate information, coordinate transformation matrix, and text style information are parsed from multiple drawing commands used to describe a text element to form a text object;

[0013] The source image reference information, image coordinate information, image size information, and coordinate transformation matrix are parsed from multiple drawing commands used to describe an image element to form an image object.

[0014] Optionally, the step of using a 3D rendering engine to convert each graphical element object into a corresponding 3D solid object includes:

[0015] When the graphic element object is a line path object, a filled area object, or a text object, the corresponding coordinate information is extracted from the graphic element object, and the coordinate information is converted into a three-dimensional coordinate sequence according to the coordinate transformation matrix in the graphic element object.

[0016] The 3D rendering engine generates a 3D geometric structure corresponding to the 3D coordinate sequence.

[0017] The corresponding style information is parsed from the graphic element object, and a rendering material corresponding to the style information is created through the 3D rendering engine;

[0018] The three-dimensional geometric structure is combined with the rendering material to form a three-dimensional solid object corresponding to the graphic element object.

[0019] Optionally, the step of using a 3D rendering engine to convert each graphical element object into a corresponding 3D solid object includes:

[0020] When the graphic element object is an image object, the source image reference information is parsed from the image object, and a standard two-dimensional image resource is generated based on the source image reference information;

[0021] The standard two-dimensional image resources are converted into texture resources that the three-dimensional rendering engine can recognize;

[0022] Based on the image coordinate information, image size information, and coordinate transformation matrix of the image object, a planar geometric structure is created.

[0023] The texture resource and the planar geometric structure are bound together to form a three-dimensional solid object corresponding to the image object.

[0024] Optionally, the step of using a 3D rendering engine to convert each graphical element object into a corresponding 3D solid object further includes:

[0025] When a clipping object is associated with the graphic element object, a clipping region is generated based on the clipping object.

[0026] The three-dimensional solid object is clipped using the clipping region to retain only the portion of the three-dimensional solid object located within the clipping region.

[0027] Optionally, the step of acquiring the PDF file to be processed and parsing the page content in the PDF file to obtain multiple drawing commands for describing various graphic elements in the page content includes:

[0028] The PDF file to be processed is loaded using PDF.js, and a document proxy object describing the PDF file is generated.

[0029] The document proxy object is used to retrieve specified pages from the PDF file as needed, and a page content object describing the specified page is generated.

[0030] All drawing commands on the specified page can be obtained through the page content object.

[0031] Optionally, the step of rendering all three-dimensional entity objects into the same three-dimensional space using the three-dimensional rendering engine, so that the page content in the PDF file can be visualized in the three-dimensional space, includes:

[0032] Constructing a three-dimensional space using Three.js;

[0033] Each three-dimensional entity object is arranged sequentially in the three-dimensional space according to the original position information of the corresponding graphic elements in the PDF file;

[0034] Configure the field of view parameters of the orthogonal camera in the three-dimensional space using Three.js to adapt the field of view of the orthogonal camera to the visualization display requirements of the PDF file.

[0035] To achieve the above objectives, the present invention also provides an apparatus for rendering PDF files, the apparatus comprising:

[0036] The parsing module is used to acquire the PDF file to be processed and parse the page content in the PDF file to obtain multiple drawing commands for describing each graphic element in the page content.

[0037] The reconstruction module is used to reconstruct multiple drawing commands used to describe the same graphic element into corresponding graphic element objects; wherein, the graphic element object is structured data that encapsulates graphic feature information representing the graphic element;

[0038] The conversion module is used to convert each graphic element object into a corresponding three-dimensional entity object using a three-dimensional rendering engine; wherein, the three-dimensional entity object is the visual form of the graphic element in three-dimensional space.

[0039] The rendering module is used to render all three-dimensional entity objects into the same three-dimensional space through the three-dimensional rendering engine, so that the page content in the PDF file can be visualized in the three-dimensional space.

[0040] To achieve the above objectives, the present invention also provides a computer device, which specifically includes: a memory, a processor, and a computer program stored in the memory and executable on the processor, wherein the processor executes the computer program to implement the steps of the method for rendering PDF files described above.

[0041] To achieve the above objectives, the present invention also provides a computer-readable storage medium having a computer program stored thereon, which, when executed by a processor, implements the steps of the method for rendering PDF files described above.

[0042] The present invention provides a method, apparatus, device, and storage medium for rendering PDF files, which offers a new way of rendering PDF files. By performing high-precision parsing of PDF files to extract structured drawing commands from the PDF files, and using a 3D rendering engine to reinterpret and draw these 2D commands in a 3D scene, the traditional 2D planar display method of PDF files is broken, realizing efficient rendering and smooth interaction of PDF content in 3D space, and significantly improving the user experience. Attached Figure Description

[0043] Various other advantages and benefits will become apparent to those skilled in the art upon reading the following detailed description of preferred embodiments. The accompanying drawings are for illustrative purposes only and are not intended to limit the invention. Furthermore, the same reference numerals denote the same parts throughout the drawings. In the drawings:

[0044] Figure 1 This is an optional flowchart illustrating the method for rendering a PDF file provided in Embodiment 1.

[0045] Figure 2 This is a schematic diagram of an optional component structure of the apparatus for rendering PDF files provided in Embodiment 2;

[0046] Figure 3 This is a schematic diagram of an optional hardware structure for the computer device provided in Embodiment 3. Detailed Implementation

[0047] To make the objectives, technical solutions, and advantages of this invention clearer, the invention will be further described in detail below with reference to the accompanying drawings and embodiments. It should be understood that the specific embodiments described herein are merely illustrative and not intended to limit the invention. All other embodiments obtained by those skilled in the art based on the embodiments of this invention without inventive effort are within the scope of protection of this invention.

[0048] Example 1

[0049] This invention provides a method for rendering PDF files, such as... Figure 1 As shown, the method specifically includes the following steps:

[0050] Step S101: Obtain the PDF file to be processed, and parse the page content in the PDF file to obtain multiple drawing commands for describing each graphic element in the page content.

[0051] Drawing commands are operators defined according to the PDF standard. They are mathematical instructions used to describe graphic elements (such as paths, text, and images). Common command types include, but are not limited to: commands to define the starting point of a path, commands to draw a straight line, commands to draw a Bézier curve, and commands to set color and line width. All the drawing commands contained in a PDF file describe how to draw all the visual elements (i.e., graphic elements) of a PDF page from scratch.

[0052] Alternatively, the internal structure of a PDF file can be directly read and these drawing commands extracted using the application programming interface provided by existing open-source PDF parsing libraries (such as PDF.js); or a file parser can be written in advance to parse the content of a specified page in the PDF file to reconstruct the page drawing commands; no specific limitations are made here.

[0053] Step S102: Reconstruct multiple drawing commands used to describe the same graphic element into corresponding graphic element objects; wherein, the graphic element object is structured data that encapsulates graphic feature information representing the graphic element.

[0054] Graphical elements can be lines (straight or curved), filled areas, text, or images, but each graphic element is formed by multiple drawing commands. Therefore, semantic analysis and correlation analysis are needed to cluster the multiple drawing commands that constitute a graphic element to obtain a group of drawing commands for that graphic element. Then, the group of drawing commands for that graphic element needs to be analyzed to extract its graphic feature information. Finally, the graphic feature information of the graphic element is processed into a data structure to form the corresponding image element object. Therefore, a graphic element object is a data structure that encapsulates complete graphic feature information; it represents an independent visual element on the page, such as a complete path, a filled area, or a piece of text.

[0055] In addition, the graphic element object includes at least one of the following types: line path object, fill area object, text object, and image object; the graphic element object encapsulates at least the following three types of core feature information: (1) geometric information (i.e., coordinate information): defines the shape and outline of the graphic, such as the coordinate sequence of the line path, the vector outline of the fill area, etc.; (2) style information: defines the appearance of the graphic, such as color, line width, fill mode, font attributes, transparency, etc.; (3) spatial information: defines the position, direction, and scaling of the graphic, which is mainly represented by a coordinate transformation matrix, which uniformly describes how to transform the local coordinates of the graphic to the global coordinate system of the page. It should also be noted that the graphic element object is structured data that can be read and used by the 3D rendering engine.

[0056] Step S103: Use a 3D rendering engine to convert each graphic element object into a corresponding 3D entity object; wherein, the 3D entity object is the visual form of the graphic element in 3D space.

[0057] In this context, a 3D solid object is a basic rendering unit that can be manipulated in a 3D rendering engine. It typically contains two core data components: geometry that defines the object's shape and materials that define the object's appearance. In this embodiment, based on the geometric and style information described by the graphic element object, corresponding 3D geometry and materials are created. These created 3D geometry and materials are then bound to form a 3D solid object that can be used by the 3D rendering engine. This maps the 2D document object into 3D space, laying the foundation for 3D rendering and interaction.

[0058] Step S104: Render all three-dimensional entity objects into the same three-dimensional space using the three-dimensional rendering engine, so that the page content in the PDF file can be visualized in the three-dimensional space.

[0059] In this embodiment, the content of a two-dimensional PDF document is converted into a three-dimensional scene composed of multiple independent three-dimensional objects. Because the 3D rendering engine inherently possesses high-performance characteristics when handling camera transformations (such as scaling and translation), scaling operations on the entire document become smoother, thus fundamentally solving the problems of response latency and visual stuttering, achieving smooth scaling interaction and efficient rendering.

[0060] Specifically, step S102, which involves reconstructing multiple drawing commands used to describe the same graphic element into corresponding graphic element objects, includes the following steps:

[0061] The path coordinate information, coordinate transformation matrix, and path style information are parsed from multiple drawing commands used to describe a line path element to form a line path object;

[0062] The region outline coordinates, coordinate transformation matrix, and fill style information are parsed from multiple drawing commands used to describe a filled region element to form a filled region object.

[0063] The text content, text coordinate information, coordinate transformation matrix, and text style information are parsed from multiple drawing commands used to describe a text element to form a text object;

[0064] The source image reference information, image coordinate information, image size information, and coordinate transformation matrix are parsed from multiple drawing commands used to describe an image element to form an image object.

[0065] In this embodiment, when traversing each drawing command, a specific execution command is identified as the end marker of the graphic element definition, and this is used as a trigger point to parse and integrate the relevant command sequence preceding the execution command into a structured graphic element object; specifically including:

[0066] The formation of a line path object: When the parsing process reaches the "path execution command" that triggers line drawing (e.g., a command that represents stroking the current path), the commands recorded before this command that define the path geometry (such as moving to a point, drawing a straight line, drawing a curve, etc.) are parsed into path coordinate information; at the same time, the coordinate transformation commands (such as translation, rotation, scaling commands) and line style commands (such as color setting, width setting, line endpoint style commands) recorded before this command are parsed into coordinate transformation matrices and path style information; finally, the above path coordinate information, coordinate transformation matrix, and path style information are associated and encapsulated to form a line path object;

[0067] The formation of the fill region object: When the parsing process encounters a region fill execution command (e.g., a command representing color or pattern filling of the current closed path), the path definition commands recorded before this command are parsed into region outline coordinate information. Simultaneously, coordinate transformation commands and fill style commands (such as fill color settings, gradient rule commands, and fill mode commands) recorded before this command are parsed into coordinate transformation matrices and fill style information. Finally, the aforementioned region outline coordinate information, coordinate transformation matrix, and fill style information are associated and encapsulated to form a fill region object.

[0068] The formation of a text object: When the parsing process reaches the end command of a text block, it parses all text-related commands recorded since the start command of the corresponding text block, extracts the text content, text coordinate information used to locate the text, coordinate transformation matrix, and text style information (such as font, font size, color, etc.); these information are then encapsulated together to form a complete text object;

[0069] Image object formation: When the parsing process reaches the image drawing execution command, it extracts the source image reference information (pointing to image data), image coordinate information (drawing position), and image size information from the command and its related parameters, and combines this with the current coordinate transformation matrix. All this information is then encapsulated to form a complete image object.

[0070] In this embodiment, scattered drawing commands are reconstructed into four types of structured graphic element objects: line paths, filled areas, text, and images. This not only achieves accurate extraction and unified encapsulation of the core information (coordinates, styles, content / resources, etc.) of different types of graphic elements, but also completes the transformation from "command sequence" to "structured data." This provides a standardized and normalized data foundation for the efficient conversion of graphic element objects into three-dimensional entity objects, while ensuring the integrity and independence of various graphic element information, thus supporting the accurate visualization of PDF page content in three-dimensional space.

[0071] Specifically, step S103, which involves using a 3D rendering engine to convert each graphic element object into a corresponding 3D solid object, includes the following steps:

[0072] Step A1: When the graphic element object is a line path object, a filled area object, or a text object, extract the corresponding coordinate information from the graphic element object, and convert the coordinate information into a three-dimensional coordinate sequence according to the coordinate transformation matrix in the graphic element object;

[0073] Step A2: Using the 3D rendering engine, generate a 3D geometric structure corresponding to the 3D coordinate sequence;

[0074] Step A3: Parse the corresponding style information from the graphic element object, and create a rendering material corresponding to the style information through the 3D rendering engine;

[0075] Step A4: Combine the three-dimensional geometric structure with the rendering material to form a three-dimensional solid object corresponding to the graphic element object.

[0076] In this embodiment, for non-image-type graphic element objects such as line path objects, filled area objects, or text objects, the conversion to 3D solid objects first extracts the corresponding coordinate information from each graphic element object (path coordinate information for line path objects, area outline coordinate information for filled area objects, and text coordinate information for text objects). Using the coordinate transformation matrix already encapsulated within the object, coordinate system adaptation is completed, accurately converting the 2D coordinate information into a 3D coordinate sequence recognizable in 3D space. Then, using the geometry generation function of the 3D rendering engine, a 3D geometric structure matching the graphic shape is constructed based on this 3D coordinate sequence. Simultaneously, the corresponding style information (path style information, fill style information, and text style information) is parsed from the graphic element object, and a rendering material that fits this style information is created using the 3D rendering engine. Finally, the 3D geometric structure and the rendering material are associated and combined to form a 3D solid object that combines geometric form and visual style. This process achieves standardized and precise conversion of non-image-type graphic elements from structured data to 3D renderable entities, and the coordinate transformation matrix ensures the accuracy of the graphic's position and posture in 3D space.

[0077] Furthermore, step S103 also includes:

[0078] Step A1': When the graphic element object is an image object, the source image reference information is parsed from the image object, and a standard two-dimensional image resource is generated based on the source image reference information;

[0079] Step A2': Convert the standard two-dimensional image resource into a texture resource that the three-dimensional rendering engine can recognize;

[0080] Step A3': Create a planar geometric structure based on the image coordinate information, image size information, and coordinate transformation matrix of the image object;

[0081] Step A4': Bind the texture resource and the planar geometric structure to form a three-dimensional solid object corresponding to the image object.

[0082] In this embodiment, the source image reference information (such as image storage path, unique identifier, etc.) is first parsed from the image object. Based on this reference information, the original image data is loaded, and through processing such as format standardization and size calibration, a standard two-dimensional image resource that meets the requirements of subsequent conversion is generated. Subsequently, through the texture processing interface of the 3D rendering engine, the standard two-dimensional image resource is converted into a texture resource that the engine can directly recognize. At the same time, image coordinate information (drawing start coordinates), image size information (width and height parameters), and coordinate transformation matrix are extracted from the image object. Combined with the three-dimensional space coordinate rules, the actual position, scaling ratio, and rotation angle of the image in the three-dimensional scene are calculated, and a planar geometric structure matching the image size is created accordingly. Finally, the converted texture resource is bound to the planar geometric structure to form a three-dimensional entity object that combines image content and three-dimensional space attributes.

[0083] Furthermore, step S103 also includes:

[0084] Step B1: When a clipping object is associated with the graphic element object, generate a clipping region based on the clipping object;

[0085] Step B2: Use the clipping region to clip the three-dimensional solid object so as to retain only the portion of the three-dimensional solid object located within the clipping region.

[0086] In this embodiment, when a graphic element object (such as a line path object, a filled area object, a text object, or an image object) is associated with a clipping object, the clipping object must first be parsed: Clipping path information (such as closed contour coordinates) and the associated coordinate transformation matrix are extracted from the clipping object. Referring to the rules of 3D spatial coordinates, the clipping path information is converted into a 3D clipping path adapted to the 3D scene, thereby generating a 3D clipping region. Subsequently, using the clipping function of the 3D rendering engine, the generated 3D clipping region is applied to the converted 3D solid object. By comparing the spatial positional relationship between each part of the 3D solid object and the clipping region, only the solid parts located within the clipping region are retained, and redundant parts outside the region are eliminated.

[0087] Alternatively, as an optimal implementation, multiple drawing commands are parsed from the PDF file to be processed using PDF.js, and the graphic element objects are converted into 3D solid objects and rendered in 3D space using Three.js. The specific implementation methods for each of the above steps are as follows:

[0088] Specifically, step S101 includes the following steps:

[0089] Step C1: Load the PDF file to be processed using the getDocument method of PDF.js, and generate a document proxy object (PdfDocumentProxy) to describe the PDF file.

[0090] PDF.js is an open-source JavaScript library developed primarily by Mozilla. Its core function is to parse, render, and display Portable Document Format (PDF) files entirely within the client-side (i.e., web browser) environment. In this embodiment, PDF.js's document parsing function is used to decode binary or Base64 encoded PDF files to extract their internal structural information, including but not limited to: document metafiles, page trees, text streams, fonts, images, and vector graphics drawing instructions.

[0091] In addition, the document proxy object contains information describing the global attributes of the PDF file, such as the total number of pages and file metadata (e.g., title and author). The document proxy object also contains interfaces or methods for accessing individual pages within the PDF file.

[0092] Step C2: Obtain the specified page from the PDF file as needed through the document proxy object, and generate a page content object (PdfPageProxy) to describe the specified page.

[0093] The page content object contains drawing commands that describe the specific content of the specified page.

[0094] Step C3: Obtain all drawing commands on the specified page using the getOperatorList method in the page content object.

[0095] The drawing commands are operators defined by the PDF standard, including: moving the pen tip (m), drawing a straight line (l), drawing a curve (c), setting the color (rg), starting text drawing (BT), ending text drawing (ET), filling (f), tracing (S), image drawing (Do), image parameter setting (cm), font parameter setting (Tf), text position setting (Td), and text drawing (Tj).

[0096] Specifically, step S102 includes the following steps:

[0097] Step D1: Create an empty data object drawingObjs to store the generated graphic element objects, and create a CtxState canvas and object state to track the current drawing state;

[0098] The CtxState canvas and object state includes: coordinate transformation matrix and drawing style information; the drawing style information includes: fill description, stroke color, line width, font information, current path information, and clipping path information of the currently drawn object;

[0099] Step D2: Traverse each drawing command and convert each drawing command into a corresponding executable function containing function parameters according to the preset operator-processing function mapping relationship to form a function list; wherein, a single drawing command can correspond to at least one executable function;

[0100] Step D3: Iterate through and execute each executable function in the function list; when the executable function is a state setting function, update the CtxState canvas and object state; when the executable function is a drawing execution function, determine the graphic shape information based on the graphic definition function associated with the drawing execution function;

[0101] Step D4: Combine the canvas and object state with the graphic shape information to generate the corresponding graphic element object and add it to the data object drawingObjs.

[0102] Furthermore, the graphic element objects in step S102 include: a line path object strokeObj, a fill area object fillObj, a text object textObj, an image object imgObj, and a clipping object clipObj.

[0103] The line path object `strokeObj` includes: `routes` (stroke path coordinate information); `CtxState` (canvas and object state), which records style information such as the coordinate transformation matrix, stroke line color, line width, and line connection point style when drawing the path; and `ClipDataRef` (clipping object index), pointing to the specific clipping object `clipObj`, which can be empty if there is no clipping. The fill area object `fillObj` includes: `routes` (fill path coordinate information, i.e., area outline coordinate information); `fillRule` (fill rule model, either odd / even fill or non-zero wrapping fill); `fillStyle` (fill style information, such as solid color fill defining fill color, gradient fill defining gradient rules, and image fill defining image); `CtxState` (canvas and object state), which records style information such as the coordinate transformation matrix, stroke line color, line width, and line connection point style when drawing the path; and `ClipDataRef` (clipping object index), pointing to the specific clipping object `clipObj`, which can be empty if there is no clipping. The text object `textObj` includes: `text` (the text text); `textMatrix` (the coordinate transformation matrix used for text drawing, primarily for text rotation or relative translation); `CtxState` (the canvas and object state, which records style information such as the coordinate transformation matrix, stroke color, line width, and line connection point style when drawing the path); and `ClipDataRef` (the clipping object index, pointing to the specific clipping object `clipObj`, which can be empty if there is no clipping). The image object `imgObj` includes: `originImg` (the source image); image coordinates, image size, and image rotation information; `CtxState` (the canvas and object state, which records style information such as the coordinate transformation matrix, stroke color, line width, and line connection point style when drawing the path); and `ClipDataRef` (the clipping object index, pointing to the specific clipping object `clipObj`, which can be empty if there is no clipping). The clipping object `clipObj` includes: `routes` (the clipping path coordinates) and `fillRule` (the clipping rule).

[0104] Specifically, step S103 includes the following steps:

[0105] For the straight path object `strokeObj`, create a path point coordinate array `points`. Iterate through the path information in `storkeObj`'s `routes` array. When a straight line is encountered, add the endpoints of the line directly to the `points` array. Use the `CtxState` canvas and the coordinate transformation matrix in the `storkeObj` object's state to transform the coordinates in the `points` array. Pass the transformed point coordinate array `points` to Three.js's `LineSegments` to generate the line geometry. Use the `CtxState` canvas and the stroke color and line width in the `storkeObj` object's state to pass to Three.js's `LineBasicMaterial` to generate the material. Use the geometry from Three.js's `LineSegments` and the material from Three.js's `LineBasicMaterial` to draw the path geometry object.

[0106] Unlike straight path objects, for Bézier curve path objects, Three.js's QuadraticBezierCurve is used to fit and interpolate the points of the bezierline into multiple relatively continuous points, which are then added to the points array.

[0107] For the fill region object `fillObj`, a `shapes` array is created. The `routes` array within the `fillObj` object is iterated through to obtain the region outline coordinates. The coordinate transformation matrix in the `CtxState` canvas and object state of the `fillObj` object is used to transform the region outline coordinates. A planar graphic outline is created based on the transformed coordinates using Three.js's `Shape` property. The planar graphic outline is then processed for self-intersection path correction and hole path recognition to generate corrected graphic outline data. Based on the corrected graphic outline data, the corresponding planar geometry `shapeGeometry` is generated using Three.js's `ShapeGeometry` property. The `fillStyle` property in the `fillObj` object is read, and a material is generated according to different filling rules. Specifically, when `fillStyle` is a linear gradient filled with a CanvasGradient, a custom material `material1` is implemented using a custom shader and a custom material object `ShaderMaterial` from Three.js. When `fillStyle` is a radial gradient filled with a CanvasGradient, a custom material `material2` is implemented using a custom shader and a custom material object `ShaderMaterial` from Three.js. When `fillStyle` is filled with a CanvasPattern image, a CanvasTexture object from Three.js is used, passing in `_CanvasPatternData` from `fillObj` to generate the corresponding texture. A MeshBasicMaterial from Three.js is then used, passing in the texture object to generate material `material3`. The generated `shapeGeometry` and the generated material are then passed to a Mesh object from Three.js to create a mesh for drawing the filled graphic.

[0108] For the text object textObj, just like the fillObj object, the fill of the font stroke path is drawn using Three.js's Shape and ShapeGeometry. When encountering self-intersecting or closed nested font stroke paths, consider hole-cutting processing.

[0109] For the image object `imgObj`, read the source image information `originImg` from `imgObj` and pass it to `Three.js`'s `CanvasTexture` to generate an image texture object `texture`. Using the `newWidth` and `newHeight` properties of `imgObj`, combined with the `width` and `height` properties of the `originImg` image itself, scale the texture object. Read the `beforeTrans` rotation property of `imgObj`; if it exists, use the rotation data to perform a self-rotation operation on the texture. Use `Three.js`'s `MeshBasicMaterial` to pass... The `material` class generates a material image texture by inputting a `texture`; it reads the `newX`, `newY`, `newWidth`, and `newHeight` properties of the `imgObj` object, uses the `beforeTrans` rotation information of the `imgObj` object and the coordinate transformation information in `ctxState` to calculate the actual height `h` and width `w` of the image to be rendered; it uses Three.js's `PlaneGeometry`, passing in the obtained `w` and `h`, to generate a polygon geometry; and it passes the generated material image texture and the generated polygon geometry into Three.js's `Mesh` to generate an image drawing mesh object for image drawing.

[0110] Specifically, step S104 includes the following steps:

[0111] Step E1: Construct a Scene using Three.js as a three-dimensional space;

[0112] Step E2: Arrange each 3D entity object in the Scene according to the original position information of the corresponding graphic element in the PDF file;

[0113] Step E3: Configure the field of view parameters of the orthographic camera of the Scene using Three.js so that the field of view of the orthographic camera is adapted to the visualization display requirements of the PDF file.

[0114] Three.js is an open-source, cross-browser JavaScript library and application programming interface (API) for creating and displaying animated 3D computer graphics in web browsers. It encapsulates underlying WebGL technology but provides a higher level of object-oriented abstraction, allowing developers to efficiently build complex 3D scenes and interactive applications without needing in-depth knowledge of complex graphics technologies such as shader languages.

[0115] Furthermore, after step S104, the method further includes:

[0116] Listen for mouse click and drag events and obtain corresponding mouse displacement data; adjust the field of view parameters of the orthogonal camera according to the displacement data and a preset conversion rule to achieve proportional zooming, scaling, and movement display effects; and / or,

[0117] When a mouse click event is detected, a virtual ray is sent from the mouse click location to the Scene using Three.js's Raycaster. The 3D entity object that comes into contact with the virtual ray is set as the selected object, so that interactive operations such as position adjustment and color modification can be performed on the selected object according to the adjustment instructions.

[0118] In addition, when all 3D solid objects are rendered into the 3D space, the following functions can be implemented using Three.js:

[0119] (1) One-click home: Pre-store the initial position parameters of the three-dimensional entity object and the initial field of view parameters of the orthogonal camera when the three-dimensional space is initialized; when the user triggers the one-click home command, the parameters of the three-dimensional space are reset to the initial position parameters and the initial field of view parameters so that the PDF file can be restored to its initial display position and size.

[0120] (2) Box selection and positioning: Listen for mouse box selection events, obtain the coordinate data of the box selection area, calculate the target three-dimensional entity object located in the box selection area based on the coordinate data, and adjust the field of view parameters of the orthogonal camera so that the target three-dimensional entity object corresponding to the box selection area fills the display interface of the Scene.

[0121] (3) Annotation: Overlay and render an annotation canvas on the base canvas that displays the PDF file in the three-dimensional space, listen for drawing events for the annotation canvas, and draw annotations on the annotation canvas according to the drawing events; wherein, the annotations include: arrows, polylines, pens, cloud frames, rectangles, ellipses, etc.

[0122] (4) Measurement: Overlay and render a measurement canvas on the base canvas that displays the PDF file in the three-dimensional space, listen for measurement events for the measurement canvas, and perform measurement on the PDF file on the measurement canvas according to the measurement events, including: measurement of polylines, angles, areas, etc.

[0123] (5) Endpoint adsorption during measurement:

[0124] By using Three.js's Raycaster, we can implement a snapping function for special points such as endpoints, midpoints, and intersections of graphic elements near the mouse position. When the mouse position approaches the above special points, the mouse will be automatically positioned to the special points to improve the accuracy of measurement.

[0125] In this embodiment, the parsing capabilities of PDF.js are combined with the rendering capabilities of Three.js to form a completely new way of rendering PDF files. Specifically, this involves first using PDF.js as a high-precision "content parser" to extract the structured drawing commands from the PDF file; then using Three.js as a powerful "3D space renderer" to reinterpret and draw these 2D commands in a dynamic 3D scene. This embodiment breaks away from the traditional 2D planar display of PDF files, achieving efficient rendering and smooth interaction of PDF content in 3D space, significantly improving the user experience. This embodiment has the following beneficial effects:

[0126] (1) Users can freely zoom and pan the entire document scene using the Three.js track controller. The zoom factor is not limited by the canvas size, and the zoom efficiency is significantly improved when the zoom factor is large.

[0127] (2) It greatly enriches the interactive experience of the document and realizes object-level, fine-grained three-dimensional manipulation of PDF content. Unlike traditional PDF rendering technology, which treats the entire page as a bitmap or a single Canvas, this embodiment uses the underlying operators of PDF.js to separate and objectify basic elements such as vector paths, text, and images within the PDF. This allows each graphic element to exist as an independent Three.js mesh object, enabling independent three-dimensional transformations (translation, rotation, scaling), animation, material modification, and lighting interaction, achieving unprecedented fine-grained manipulation of document content;

[0128] (3) PDF documents, which belong to the field of two-dimensional planar documents, have been introduced into the three-dimensional interactive space, creating a brand-new document reading and interaction paradigm. This allows PDF document content to be easily integrated and fused with other three-dimensional models, data visualization elements, and even virtual / augmented reality environments, providing a key technical foundation for building the next generation of integrated information workbench and digital twin system.

[0129] Example 2

[0130] This invention provides an apparatus for rendering PDF files, such as... Figure 2 As shown, the device specifically includes the following components:

[0131] The parsing module 201 is used to acquire the PDF file to be processed and parse the page content in the PDF file to obtain multiple drawing commands for describing each graphic element in the page content.

[0132] The reconstruction module 202 is used to reconstruct multiple drawing commands used to describe the same graphic element into corresponding graphic element objects; wherein, the graphic element object is structured data that encapsulates graphic feature information representing the graphic element;

[0133] The conversion module 203 is used to convert each graphic element object into a corresponding three-dimensional entity object using a three-dimensional rendering engine; wherein, the three-dimensional entity object is the visual form of the graphic element in three-dimensional space.

[0134] The rendering module 204 is used to render all three-dimensional entity objects into the same three-dimensional space through the three-dimensional rendering engine, so that the page content in the PDF file can be visualized in the three-dimensional space.

[0135] Specifically, the reconstruction module 202 is used for:

[0136] The path coordinate information, coordinate transformation matrix, and path style information are parsed from multiple drawing commands used to describe a line path element to form a line path object;

[0137] The region outline coordinates, coordinate transformation matrix, and fill style information are parsed from multiple drawing commands used to describe a filled region element to form a filled region object.

[0138] The text content, text coordinate information, coordinate transformation matrix, and text style information are parsed from multiple drawing commands used to describe a text element to form a text object;

[0139] The source image reference information, image coordinate information, image size information, and coordinate transformation matrix are parsed from multiple drawing commands used to describe an image element to form an image object.

[0140] Specifically, the conversion module 203 is used for:

[0141] When the graphic element object is a line path object, a filled area object, or a text object, the corresponding coordinate information is extracted from the graphic element object, and the coordinate information is converted into a three-dimensional coordinate sequence according to the coordinate transformation matrix in the graphic element object.

[0142] The 3D rendering engine generates a 3D geometric structure corresponding to the 3D coordinate sequence.

[0143] The corresponding style information is parsed from the graphic element object, and a rendering material corresponding to the style information is created through the 3D rendering engine;

[0144] The three-dimensional geometric structure is combined with the rendering material to form a three-dimensional solid object corresponding to the graphic element object.

[0145] Furthermore, the conversion module 203 is specifically used for:

[0146] When the graphic element object is an image object, the source image reference information is parsed from the image object, and a standard two-dimensional image resource is generated based on the source image reference information;

[0147] The standard two-dimensional image resources are converted into texture resources that the three-dimensional rendering engine can recognize;

[0148] Based on the image coordinate information, image size information, and coordinate transformation matrix of the image object, a planar geometric structure is created.

[0149] The texture resource and the planar geometric structure are bound together to form a three-dimensional solid object corresponding to the image object.

[0150] Furthermore, the conversion module 203 is also used for:

[0151] When a clipping object is associated with the graphic element object, a clipping region is generated based on the clipping object.

[0152] The three-dimensional solid object is clipped using the clipping region to retain only the portion of the three-dimensional solid object located within the clipping region.

[0153] Specifically, the parsing module 201 is used for:

[0154] The PDF file to be processed is loaded using PDF.js, and a document proxy object describing the PDF file is generated.

[0155] The document proxy object is used to retrieve specified pages from the PDF file as needed, and a page content object describing the specified page is generated.

[0156] All drawing commands on the specified page can be obtained through the page content object.

[0157] Specifically, the rendering module 204 is used for:

[0158] Constructing a three-dimensional space using Three.js;

[0159] Each three-dimensional entity object is arranged sequentially in the three-dimensional space according to the original position information of the corresponding graphic elements in the PDF file;

[0160] Configure the field of view parameters of the orthogonal camera in the three-dimensional space using Three.js to adapt the field of view of the orthogonal camera to the visualization display requirements of the PDF file.

[0161] Example 3

[0162] This embodiment also provides a computer device, such as a smartphone, tablet computer, laptop computer, desktop computer, rack server, blade server, tower server, or cabinet server (including a standalone server or a server cluster composed of multiple servers), etc., capable of executing programs. Figure 3 As shown, the computer device 30 in this embodiment includes, but is not limited to, a memory 301 and a processor 302 that are communicatively connected to each other via a system bus. It should be noted that... Figure 3 Only a computer device 30 with components 301-302 is shown; however, it should be understood that it is not required to implement all of the components shown, and more or fewer components may be implemented instead.

[0163] In this embodiment, the memory 301 (i.e., the readable storage medium) includes flash memory, hard disk, multimedia card, card-type memory (e.g., SD or DX memory), random access memory (RAM), static random access memory (SRAM), read-only memory (ROM), electrically erasable programmable read-only memory (EEPROM), programmable read-only memory (PROM), magnetic memory, magnetic disk, optical disk, etc. In some embodiments, the memory 301 may be an internal storage unit of the computer device 30, such as the hard disk or memory of the computer device 30. In other embodiments, the memory 301 may also be an external storage device of the computer device 30, such as a plug-in hard disk, smart media card (SMC), secure digital (SD) card, flash card, etc., equipped on the computer device 30. Of course, the memory 301 may include both the internal storage unit and the external storage device of the computer device 30. In this embodiment, the memory 301 is typically used to store the operating system and various application software installed on the computer device 30. In addition, the memory 301 may also be used to temporarily store various types of data that have been output or will be output.

[0164] In some embodiments, processor 302 may be a central processing unit (CPU), controller, microcontroller, microprocessor, or other data processing chip. This processor 302 is typically used to control the overall operation of the computer device 30.

[0165] Specifically, in this embodiment, the processor 302 is used to execute a program for rendering a PDF file stored in the memory 301. When the program for rendering a PDF file is executed, it performs the following steps:

[0166] Obtain the PDF file to be processed, parse the page content in the PDF file, and obtain multiple drawing commands to describe each graphic element in the page content;

[0167] Multiple drawing commands used to describe the same graphic element are reconstructed into corresponding graphic element objects; wherein, the graphic element object is structured data that encapsulates graphic feature information representing the graphic element;

[0168] Each graphic element object is converted into a corresponding three-dimensional entity object using a 3D rendering engine; wherein, the three-dimensional entity object is the visual form of the graphic element in three-dimensional space.

[0169] The 3D rendering engine renders all 3D entity objects into the same 3D space, so that the page content in the PDF file can be visualized in the 3D space.

[0170] For a detailed description of the above method steps, please refer to Example 1. This example will not be repeated here.

[0171] Example 4

[0172] This embodiment also provides a computer-readable storage medium, such as flash memory, hard disk, multimedia card, card-type memory (e.g., SD or DX memory), random access memory (RAM), static random access memory (SRAM), read-only memory (ROM), electrically erasable programmable read-only memory (EEPROM), programmable read-only memory (PROM), magnetic memory, disk, optical disk, server, app store, etc., which stores a computer program. When the computer program is executed by a processor, it implements the following method steps:

[0173] Obtain the PDF file to be processed, parse the page content in the PDF file, and obtain multiple drawing commands to describe each graphic element in the page content;

[0174] Multiple drawing commands used to describe the same graphic element are reconstructed into corresponding graphic element objects; wherein, the graphic element object is structured data that encapsulates graphic feature information representing the graphic element;

[0175] Each graphic element object is converted into a corresponding three-dimensional entity object using a 3D rendering engine; wherein, the three-dimensional entity object is the visual form of the graphic element in three-dimensional space.

[0176] The 3D rendering engine renders all 3D entity objects into the same 3D space, so that the page content in the PDF file can be visualized in the 3D space.

[0177] For a detailed description of the above method steps, please refer to the first embodiment. This embodiment will not repeat the details here.

[0178] It should be noted that, in this document, the terms "comprising," "including," or any other variations thereof are intended to cover non-exclusive inclusion, such that a process, method, article, or apparatus that comprises a list of elements includes not only those elements but also other elements not expressly listed, or elements inherent to such a process, method, article, or apparatus. Unless otherwise specified, an element defined by the phrase "comprising one..." does not exclude the presence of other identical elements in the process, method, article, or apparatus that includes that element.

[0179] The sequence numbers of the above embodiments of the present invention are for descriptive purposes only and do not represent the superiority or inferiority of the embodiments.

[0180] Through the above description of the embodiments, those skilled in the art can clearly understand that the methods of the above embodiments can be implemented by means of software plus necessary general-purpose hardware platforms. Of course, they can also be implemented by hardware, but in many cases the former is a better implementation method.

[0181] The above are merely preferred embodiments of the present invention and do not limit the scope of the patent. Any equivalent structural or procedural transformations made based on the description and drawings of the present invention, or direct or indirect applications in other related technical fields, are similarly included within the scope of patent protection of the present invention.

Claims

1. A method for rendering a PDF file, characterized in that, The method includes: Obtain the PDF file to be processed, parse the page content in the PDF file, and obtain multiple drawing commands to describe each graphic element in the page content; Multiple drawing commands used to describe the same graphic element are reconstructed into corresponding graphic element objects; wherein, the graphic element object is structured data that encapsulates graphic feature information representing the graphic element; Each graphic element object is converted into a corresponding three-dimensional entity object using a 3D rendering engine; wherein, the three-dimensional entity object is the visual form of the graphic element in three-dimensional space. The 3D rendering engine renders all 3D entity objects into the same 3D space, so that the page content in the PDF file can be visualized in the 3D space. The step of reconstructing multiple drawing commands used to describe the same graphic element into corresponding graphic element objects includes: The following methods are used to parse path coordinate information, coordinate transformation matrix, and path style information from multiple drawing commands used to describe a line path element to form a line path object; the following methods are used to parse region outline coordinate information, coordinate transformation matrix, and fill style information from multiple drawing commands used to describe a filled region element to form a filled region object; the following methods are used to parse text content, text coordinate information, coordinate transformation matrix, and text style information from multiple drawing commands used to describe a text element to form a text object; and the following methods are used to parse source image reference information, image coordinate information, image size information, and coordinate transformation matrix from multiple drawing commands used to describe an image element to form an image object. The process of converting each graphic element object into a corresponding 3D solid object using a 3D rendering engine includes: When the graphic element object is a line path object, a filled area object, or a text object, the corresponding coordinate information is extracted from the graphic element object, and the coordinate information is converted into a three-dimensional coordinate sequence according to the coordinate transformation matrix in the graphic element object; a three-dimensional geometric structure corresponding to the three-dimensional coordinate sequence is generated through the three-dimensional rendering engine; the corresponding style information is parsed from the graphic element object, and a rendering material corresponding to the style information is created through the three-dimensional rendering engine; the three-dimensional geometric structure and the rendering material are combined to form a three-dimensional solid object corresponding to the graphic element object; When the graphic element object is an image object, the source image reference information is parsed from the image object, and a standard two-dimensional image resource is generated based on the source image reference information; the standard two-dimensional image resource is converted into a texture resource that the three-dimensional rendering engine can recognize; a planar geometric structure is created according to the image coordinate information, image size information, and coordinate transformation matrix in the image object; the texture resource and the planar geometric structure are bound together to form a three-dimensional entity object corresponding to the image object.

2. The method for rendering a PDF file according to claim 1, characterized in that, The process of converting each graphic element object into a corresponding 3D solid object using a 3D rendering engine also includes: When a clipping object is associated with the graphic element object, a clipping region is generated based on the clipping object. The three-dimensional solid object is clipped using the clipping region to retain only the portion of the three-dimensional solid object located within the clipping region.

3. The method for rendering PDF files according to claim 2, characterized in that, The process involves acquiring a PDF file to be processed and parsing the page content within the PDF file to obtain multiple drawing commands for describing various graphic elements within the page content, including: The PDF file to be processed is loaded using PDF.js, and a document proxy object describing the PDF file is generated. The document proxy object is used to retrieve specified pages from the PDF file as needed, and a page content object describing the specified page is generated. All drawing commands on the specified page can be obtained through the page content object.

4. The method for rendering a PDF file according to claim 3, characterized in that, The step of rendering all three-dimensional entity objects into the same three-dimensional space using the three-dimensional rendering engine, so that the page content in the PDF file can be visualized in the three-dimensional space, includes: Constructing a three-dimensional space using Three.js; Each three-dimensional entity object is arranged sequentially in the three-dimensional space according to the original position information of the corresponding graphic elements in the PDF file; Configure the field of view parameters of the orthogonal camera in the three-dimensional space using Three.js to adapt the field of view of the orthogonal camera to the visualization display requirements of the PDF file.

5. An apparatus for rendering PDF files, characterized in that, The device includes: The parsing module is used to acquire the PDF file to be processed and parse the page content in the PDF file to obtain multiple drawing commands for describing each graphic element in the page content. The reconstruction module is used to reconstruct multiple drawing commands used to describe the same graphic element into corresponding graphic element objects; wherein, the graphic element object is structured data that encapsulates graphic feature information representing the graphic element; The conversion module is used to convert each graphic element object into a corresponding three-dimensional entity object using a three-dimensional rendering engine; wherein, the three-dimensional entity object is the visual form of the graphic element in three-dimensional space. The rendering module is used to render all three-dimensional entity objects into the same three-dimensional space through the three-dimensional rendering engine, so that the page content in the PDF file can be visualized in the three-dimensional space. The reconstruction module is used for: The following methods are used to parse path coordinate information, coordinate transformation matrix, and path style information from multiple drawing commands used to describe a line path element to form a line path object; the following methods are used to parse region outline coordinate information, coordinate transformation matrix, and fill style information from multiple drawing commands used to describe a filled region element to form a filled region object; the following methods are used to parse text content, text coordinate information, coordinate transformation matrix, and text style information from multiple drawing commands used to describe a text element to form a text object; and the following methods are used to parse source image reference information, image coordinate information, image size information, and coordinate transformation matrix from multiple drawing commands used to describe an image element to form an image object. The conversion module is used for: When the graphic element object is a line path object, a filled area object, or a text object, the corresponding coordinate information is extracted from the graphic element object, and the coordinate information is converted into a three-dimensional coordinate sequence according to the coordinate transformation matrix in the graphic element object; a three-dimensional geometric structure corresponding to the three-dimensional coordinate sequence is generated through the three-dimensional rendering engine; the corresponding style information is parsed from the graphic element object, and a rendering material corresponding to the style information is created through the three-dimensional rendering engine; the three-dimensional geometric structure and the rendering material are combined to form a three-dimensional solid object corresponding to the graphic element object; When the graphic element object is an image object, the source image reference information is parsed from the image object, and a standard two-dimensional image resource is generated based on the source image reference information; the standard two-dimensional image resource is converted into a texture resource that the three-dimensional rendering engine can recognize; a planar geometric structure is created according to the image coordinate information, image size information, and coordinate transformation matrix in the image object; the texture resource and the planar geometric structure are bound together to form a three-dimensional entity object corresponding to the image object.

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

7. A computer-readable storage medium having a computer program stored thereon, characterized in that, When the computer program is executed by a processor, it implements the steps of the method according to any one of claims 1 to 4.

Images