High-density element loading system and method applied to large-scale scene rendering

By using scene data analysis, multi-level detail management, visual emphasis analysis, and cross-layer caching technology, rendering resources are dynamically scheduled, solving the performance and memory problems in high-density element rendering and achieving efficient rendering and smooth interaction.

CN121074221APending Publication Date: 2025-12-05SICHUAN ZUOSONG TECHNOLOGY CO LTD

Patent Information

Application Number
CN202511621357.6
Authority / Receiving Office
CN · China
Patent Type
Applications(China)
Current Assignee / Owner
Filing Date
2025-11-07
Publication Date
2025-12-05

AI Technical Summary

Technical Problem

Existing SVG development models and Fabric.js models suffer from performance degradation, sharp increase in memory usage, reduced frame rate, and browser crashes when rendering high-density elements, especially when rendering a large number of elements.

Method used

It employs a scene data parsing module, a multi-level detail hierarchy management module, a visual importance analysis module, a rendering scheduling module, and a compositing module. By pre-creating multi-level LOD versions, visual importance analysis, and cross-layer caching technology, it dynamically schedules rendering resources, prioritizes rendering areas of user interest, and caches data from inactive areas.

Benefits of technology

It effectively improves rendering performance and smoothness, reduces memory usage, ensures the stability of high-density element rendering and interactive response speed, and avoids browser crashes.

✦ Generated by Eureka AI based on patent content.
Patent Text Reader

Abstract

The invention is suitable for the technical field of graphic processing, and provides a high-density element loading system and method applied to large-scale scene rendering, and the system comprises a scene data analysis module which is used for constructing a scene graph with a spatial index; the multi-level-of-detail management module is used for generating multi-level-of-detail (LOD) resources for the elements; the visual attention degree analysis module comprises a static feature analysis unit and a dynamic behavior learning unit and is used for generating and dynamically correcting an attention degree thermodynamic diagram; the rendering scheduling module is used for dynamically formulating a rendering strategy based on the thermodynamic diagram, the current window state and the LOD resources; and the synthesis module is used for synthesizing and outputting the cache bitmap and the dynamic element to the display canvas. Therefore, according to the method, the rendering performance, the memory efficiency, the interaction fluency, the convenience and other dimensions are all improved.
Need to check novelty before this filing date? Find Prior Art

Description

TECHNICAL FIELD

[0001] The application belongs to the technical field of graphics processing, and provides a high-density element loading system and method applied to large scene rendering. BACKGROUND

[0002] In a high-density element scene, a rendering model is needed to render a large number of graphic elements on a canvas, so as to allow the rendered picture to be scaled. At the same time, in the process of user interaction with the picture, not only the rendering performance needs to be ensured, but also the smoothness of the interaction needs to be ensured to avoid the occurrence of lag and crash.

[0003] The mainstream rendering model at present includes an SVG development model and a Fabric.js model. The SVG development model is to control SVG vector pictures to realize the loading of specific elements. Since the SVG development is to use the vector format SVG, the image can be infinitely scaled without distortion, so it can easily adapt to different screen sizes and is suitable for cross-platform development. However, the disadvantage is that the technical threshold is high and the cost is high, and it is very tedious to directly write complex SVG code. If the SVG graphics contain a large number of paths, nodes or complex effects, the rendering performance will decrease significantly. Fabric.js is a graphics library based on HTML5 Canvas, which is specially used to create and operate complex graphic objects, and has more advantages in rendering large scene high-density elements.

[0004] However, although the Fabric.js has excellent performance in performance and function when rendering a large number of elements, it still has disadvantages. When the number of elements on the canvas is too large, the rendering performance of Fabric.js will decrease significantly. Specifically, the Fabric.js model needs to traverse all objects and call the render method every time it is rendered. Since each object will occupy a certain amount of memory, a large number of objects will cause the memory occupation to increase sharply, thereby causing the frame rate to decrease, the page to lag, and even the browser to crash. SUMMARY

[0005] In view of the above defects, the application aims to provide a high-density element loading system and method applied to large scene rendering, which aims to solve the problems proposed in the background art, scene data analysis module, multi-level detail level management module, visual importance analysis module, rendering scheduling module and synthesis module; The scene data analysis module is used to receive original scene data and perform structured processing thereon, and constructs a lightweight scene graph with spatial indexing; The multi-level detail level management module is used for pre-creating multiple detail level version rendering tasks for high-density elements, and includes a multi-level LOD generation unit; the multi-level LOD generation unit is responsible for receiving element internal proxy items sent by the scene data analysis module; for a complex element, the multi-level LOD generation unit pre-generates multiple; The visual importance analysis module is used for detecting a user's attention area, and giving a higher rendering priority to an area with higher importance; and includes a static feature analysis unit for generating a static importance heat map and a dynamic behavior learning unit for dynamically correcting the importance heat map; The rendering scheduling module is used for dynamically formulating an optimal rendering strategy according to the static importance heat map from the visual importance analysis module, the current window state, and the resource condition of the multi-level detail level management module, and assigning a rendering order to the multi-level LOD generation unit in real time to generate rendering result data; The synthesis module is used for merging the cached dynamic elements and bitmaps onto a display canvas.

[0006] Further, the scene data analysis module includes an element loading unit for receiving original element data; the element loading unit describes the type, position, color, shape path attribute of an element based on a text key-value pair structure, and creates an element internal proxy item; the element internal proxy item contains a unique identifier and a bounding box data corresponding to the element; A space index construction unit for establishing a global space index structure; An element data management unit for assigning a logical layer to which each element internal proxy item belongs, and scoring an initial graph complexity.

[0007] Further, the LOD versions generated by the multi-level LOD generation unit include three types: a high-detail LOD version recording an original vector path, a medium-detail LOD version recording a simplified path, and a low-detail LOD version with a substitute pure color geometric figure.

[0008] Further, the system further includes a cross-layer cache module responsible for managing cache data of an off-screen canvas.

[0009] Further, the multi-level detail level management module further includes an LOD resource pool; the LOD resource pool is used for storing and managing all LOD version resource data created by the multi-level LOD generation unit.

[0010] A high-density element loading method applied to large scene rendering, based on a high-density element loading system applied to large scene rendering; the method includes the following steps: S1, the system receives original scene data, and performs structural processing after analyzing the scene data; S2, rendering to get a low-detail panoramic map; comprising the following steps: S2.1, the system calls the multi-level detail hierarchy management module in the initialization process to obtain the low-detail LOD version of all elements; Specifically, for the elements determined to be complex in step S1, this version is an alternative solid color geometric figure; for simple elements, the inherent simplified representation is used; S2.2, the rendering scheduling module adopts the default initialization global rendering strategy, and the composition module draws all the low-detail LOD versions obtained in step S2.1 to the canvas to generate a complete low-detail panoramic map; S3, slice the low-detail panoramic map into multiple layers, and assign importance to the slice area; the system subsequently performs subsequent rendering scheduling based on the attributes of the slice area; comprising the following steps: S3.1, the system separates the low-detail panoramic map generated in S2 according to the logical layers allocated in step S1.3; then, for each layer, the panoramic map is divided into a plurality of slice areas according to a fixed grid size; S3.2, the system uses the static feature analysis unit in the visual importance analysis module to analyze the visual features of each slice of the low-detail panoramic map; S4, based on the above importance, a static importance heat map covering all slices is formed, and then according to the real-time state and prediction information of the user window, the rendering task of different slice areas is dynamically executed; S5, the composition module outputs the canvas of the window range slice based on the window.

[0011] Further, the step S1 comprises: S1.1, the system receives the original element data, and creates an element internal agent for each graphic element, which contains the unique identifier of the element and the bounding box data defined by the minimum / maximum X, minimum / maximum Y coordinates; S1.2, based on all the bounding box information, a global spatial index structure is constructed to support subsequent fast spatial query based on the window; S1.3, the system assigns a logical layer to each agent according to the predefined rules; at the same time, the complexity score is calculated based on the number of vector path points of the element and the rendering effect complexity.

[0012] Further, the step S3.2 comprises the following steps: S3.2.1, calculate the element spatial density in each slice, the higher the density, the higher the initial importance score of the slice; S3.2.2, analyze the color and contrast features of each slice, and the slice with high contrast and high saturation obtains a higher importance score.

[0013] Further, the step S4 includes the following sub-steps: S4.1, the rendering scheduling module monitors the transformation of the user window in real time, and divides the scene space into a core visible area and a preloading buffer area according to the current window position; S4.2, dynamic scheduling decision: for each slice defined in step S3.1, the system comprehensively considers the area where the slice is located and the importance heat map of step S3.2 to make a dynamic scheduling; S4.3, in the interactive process, the dynamic behavior learning unit continuously analyzes the user behavior, and updates the static heat map generated in step S3.2 in real time.

[0014] Further, the dynamic scheduling process based on the importance heat map of step S4.2 includes the following process: S4.2.1, if the slice is located in the core visible area and the slice has high importance, immediately schedule to load the high-detail LOD version thereof; S4.2.2, if the slice is located in the preloading buffer area and the importance is high, define it as a high-priority preloading task, and schedule to load the high-detail LOD version thereof; S4.2.3, if the slice is located in the preloading buffer area but the importance is medium or low, do not schedule or only load the low-detail LOD version thereof when the system is idle, and wait for the importance heat map to be updated when the user interacts, and then schedule the high-detail LOD version according to the change of the importance; S4.2.4, if the slice is located in the dormant area, mark it as a dormant state, and instruct the cross-layer caching module to serialize and store it to release the memory.

[0015] The present application has the following beneficial effects: 1. In the prior art, Fabric.js needs to traverse all objects in the scene every time it is rendered, and when the number of elements reaches more than ten thousand, the calculation amount increases linearly, resulting in a sharp decrease in frame rate. The present application manages the elements in each area through the cross-layer caching module and the slicing, and caches the rendered static layers or slices in the form of a bitmap snapshot. In subsequent rendering, the cached area is directly subjected to efficient bitmap copying operation without traversing a large number of vector elements again. Thus, high rendering frame rate and smooth user interaction experience are ensured.

[0016] 2. Through the "visual importance analysis module", combined with static visual feature analysis and dynamic user behavior learning, an importance heat map is generated and updated in real time, so that high-detail LOD versions are preferentially preloaded for areas with high importance before actual user operation occurs. Thus, through resource scheduling, when the user actually interacts, the high-definition content of the target area is already ready, and instantaneous response can be basically achieved.

[0017] 3. The application proposes the application of multi-version LOD technology, which is functionally associated and integrated with rendering scheduling. That is, the application pre-generates multiple sets of resources from high-detail vectors to low-detail geometric graphics for complex elements, and then dynamically selects the most suitable LOD version for rendering according to the distance of the element from the window and its level in the importance heat map. This effectively ensures that limited computing resources are accurately invested in the most critical places for visual quality and interactive experience, significantly reducing the overall rendering load while ensuring high-definition display in the core area.

[0018] 4. To address the problem of rapid increase in memory usage caused by a large number of objects in Fabric.js, the application lightens the data structure of the scene graph through "element internal proxy items", and uses a cross-layer cache module to serialize and store elements in the dormant area, removing them from active memory, thus achieving fine-grained memory management. DETAILED DESCRIPTION

[0019] The technical solutions in the embodiments of the application will be described clearly and completely below. Obviously, the described embodiments are only a part of the embodiments of the application, not all.

[0020] To make the purpose, technical solutions and advantages of the application clearer and more understandable, the application will be further described in detail. It should be understood that the specific embodiments described here are only used to explain the application and not to limit the application.

[0021] In the rendering of a large scene with high-density elements, to ensure smooth interaction, the application proposes a high-density element loading system and method applied to large scene rendering. The system of the application intelligently predicts the user's focus area by introducing an importance prediction mechanism, and combines multi-level detail hierarchy and cross-layer caching technology to achieve efficient allocation of rendering resources, while maintaining high-speed rendering and reducing memory usage.

[0022] The system includes a scene data analysis module, a multi-level detail hierarchy management module, a visual importance analysis module, a rendering scheduling module, a cross-layer caching module, and a synthesis module.

[0023] The scene data analysis module, as the data input end of the system, is responsible for receiving raw scene data and structuring it. The scene data analysis module can convert a large amount of element data into data objects that can be uniformly managed and scheduled internally, and use the converted objects to construct a lightweight scene graph with spatial indexing, providing a structured data foundation for all subsequent intelligent decisions.

[0024] Specifically, the scene data analysis module includes an element loading unit, a spatial index construction unit, and an element data management unit.

[0025] The element loading unit is configured to receive raw element data, including JSON configuration, graphic API call, etc. Specifically, the element loading unit of the present application uses JSON configuration for data exchange. The JSON configuration describes the type, position, color, shape path, and other attributes of the element based on the text-based key-value pair structure. After data input, the element loading unit creates an element internal agent for each graphic element. Notably, the element internal agent does not directly hold rendering data. It only contains a unique identifier and bounding box data corresponding to the element. The element loading unit generates a string or number corresponding to each element as a unique identifier for the element, which is used to uniquely retrieve the element in the global system. At the same time, the element internal agent also contains bounding box data corresponding to the unique identifier of each element. The bounding box data is defined by the minimum X coordinate, minimum Y coordinate, maximum X coordinate, and maximum Y coordinate. The bounding box data is used to represent the approximate position and range of the element in two-dimensional space, thereby supporting fast spatial calculation and collision detection by the system.

[0026] The spatial index construction unit receives the element internal agent from the element loading unit and establishes a global spatial index structure based on the bounding box information. The global spatial index structure is used for subsequent fast execution of user window-based spatial queries.

[0027] The element data management unit is responsible for assigning each element internal agent to its corresponding logical layer and scoring its initial graphic complexity, thereby providing data support for subsequent level-of-detail division and importance analysis.

[0028] Specifically, the system is preconfigured with multiple layers, including a background layer, a static element layer, a dynamic element layer, etc. The allocation rule is based on the element internal agent properties for layer allocation. For elements representing the background or large-scale static information, they are allocated to the background layer. For static decorative elements that do not require interaction, they are allocated to the static element layer. For elements with animation or state changes, they are allocated to the dynamic element layer. In addition, for elements that need to receive and respond to user operations such as mouse and touch, they are allocated to the top interactive layer.

[0029] The element data management unit scores the initial graphic complexity of the element internal agent. Specifically, the element data management unit calculates the number of vector path points of the element and combines the rendering effect of the element to obtain the complexity by adding the path point base score and the effect weighted score. For example, a rectangle composed of only 4 points has a lower score, while a complex icon composed of hundreds of points with special effects has a high score.

[0030] The multi-level detail level management module pre-creates multiple detail level version rendering tasks for high-density elements, facilitates dynamic processing of the rendering process in subsequent steps of the system, and ensures fidelity of the final processing result. The multi-level detail level management module specifically includes a multi-level LOD generation unit and an LOD resource pool.

[0031] The multi-level LOD generation unit is responsible for receiving the element internal proxy items sent by the scene data analysis module. For complex elements, the multi-level LOD generation unit pre-generates multiple LOD versions. Preferably, the judgment of complex elements is based on the graphic complexity score contained in the element internal proxy item. When the number of path points of an element exceeds a preset threshold or contains complex effects, the element is considered a complex element.

[0032] Specifically, the multi-level LOD generation unit generates three versions of resource data for a complex element: a high-detail LOD version, i.e., an original vector path; a medium-detail LOD version, i.e., a simplified path. Specifically, the simplification process of the medium-detail LOD version reduces the path points through a DP algorithm (Douglas-Poole algorithm). The DP algorithm is a line simplification algorithm in the prior art, whose principle is to divide a curve into smaller line segments and remove points that deviate from the line segment by more than a certain tolerance, thereby reducing the number of points, reducing the geometric complexity of the element, and improving rendering performance while keeping the shape substantially unchanged. Since this algorithm is a method for simplifying vector paths known in the art, it will not be described in detail in the present application.

[0033] a low-detail LOD version, i.e., an alternative solid color geometric figure.

[0034] The LOD resource pool is used to store and manage all LOD version resource data created by the multi-level LOD generation unit. Specifically, each LOD version is bound to the unique identifier of the original element. Meanwhile, the LOD resource pool provides an interface that can be efficiently queried, for the subsequent rendering scheduling module to dynamically call different LOD detail versions of specified elements, and then process the rendering process according to the scheduling strategy.

[0035] The visual importance analysis module predicts the areas that the user is likely to focus on according to the importance rules stored therein, assigns higher rendering priority to areas with higher importance, and thereby realizes the allocation of rendering resources.

[0036] The visual importance analysis module includes a static feature analysis unit and a dynamic behavior learning unit. It is worth noting that the system immediately requests the low detail LOD version of all elements from the multi-level detail level management module after the scene data analysis module constructs the scene graph with spatial index, and this process is the initialization process of the system. Subsequently, the rendering scheduling module adopts the default global rendering strategy during the first execution because there is no user interaction data during the initialization process, i.e., the heat map is not generated, and the low detail LOD version of the panorama is generated by the fast initial view radiation rendering, thereby quickly drawing the range of the entire scene and quickly completing the rendering of the panorama canvas after initialization.

[0037] After the system is initialized and the low detail panorama is rendered, the static feature analysis unit extracts visual features from the low detail panorama to generate an initial static attention heat map. The basis for visual feature extraction includes element spatial density, color and contrast, etc. For example, in the high-density aggregation area of elements, the static feature analysis unit defines it as a high-attention area; for high-contrast and high-saturation areas, the static feature analysis unit defines it as a high-attention area, etc. The dynamic behavior learning unit obtains the user's interaction behavior data on the view window and performs behavior analysis to dynamically correct the attention heat map. Specifically, the user's interaction behavior data on the view window includes the stay time of the current area of the view window, the center point of the zoom operation, the speed and direction of the translation trajectory, etc. The system increases the attention degree in the corresponding area on the static attention heat map according to the user's behavior operation. Specifically, the dynamic behavior learning unit monitors the view transformation of the canvas in real time and calculates three key areas according to the view transformation: the high-attention area within the current view window, the core visible area within the current view window, the area with higher attention around the core visible area, the preloading buffer area, and the dormant area. The unit sends the area division results to the priority scheduling unit in real time.

[0038] The rendering scheduling module dynamically formulates the optimal rendering strategy by comprehensively considering the static attention heat map from the visual attention analysis module, the current view window state, and the resource situation of the multi-level detail level management module, and dynamically allocates the rendering order to the multi-level LOD generation unit for generating rendering result data.

[0039] The rendering scheduling module receives the multi-level LOD version from the multi-level detail level management module, refers to the attention heat map generated by the visual attention analysis module, and performs dynamic real-time rendering scheduling based on the attention comparison strategy.

[0040] Specifically, the rendering scheduling module divides the area into several slices according to the attention heat map, and defines the several slices as several priorities. If the slice region meets the core visible area derived by the dynamic behavior learning unit and meets the high importance degree derived by the static feature analysis unit, the highest priority is assigned to the partition, and after the low-detail LOD version is generated, the rendering engine is instructed to load and render the high-detail LOD version.

[0041] Based on the above, more specifically, the rendering scheduling module is based on the user window and the importance heat map, and the scheduling strategy is specifically: (1) The to-be-rendered slice region of the panoramic map is the core visible area, and the heat map evaluation is high importance degree: it is defined as a high-priority rendering item, and the high-detail LOD version is loaded first.

[0042] (2) The to-be-rendered slice region of the panoramic map is the preloading buffer area, and the heat map evaluation is high importance degree: it is defined as a high-priority rendering item, and the high-detail LOD version is loaded first after the core visible area rendering task is completed, to prepare for potential user interaction.

[0043] (3) The to-be-rendered slice region of the panoramic map is the preloading buffer area, and the heat map evaluation is medium or low importance degree: it is defined as a low-priority rendering item, and rendering scheduling is performed under the condition of sufficient computing power. When the computing power is occupied, the low-priority rendering item waits for the dynamic behavior learning unit to update the heat map according to the user interaction behavior, and the core visible area is updated, the rendering priority is changed, and the high-detail LOD version is loaded.

[0044] (4) The to-be-rendered slice region of the panoramic map is the no-element slice region, and the heat map evaluation is low importance degree: under the condition of sufficient computing power, only the low-detail LOD version of the slice is maintained, that is, the slice region is defined as a dormant area, and it is serialized and stored to release memory. Subsequently, it is judged whether to perform high-detail LOD version rendering according to the change state of the core visible area.

[0045] The cross-layer cache module is responsible for managing the cache data of the off-screen canvas, and reduces the frequent calling of the underlying graphics library by caching the rendering results. When a slice region of a layer is completed and the data content is stable, the cross-layer cache module stores the data in the corresponding database. At the same time, for the static background layer and the dormant area, the cross-layer cache module compresses it into a bitmap for storage, thereby greatly reducing the memory occupation.

[0046] The synthesis module combines the cached dynamic elements and bitmaps on the display canvas through synthesis technology.

[0047] Based on the above system, the application proposes a high-density element loading method in large scene rendering, comprising the following steps: S1, the system receives original scene data, and performs structured processing after analyzing the scene data; Specifically, the scene data analysis module is used to convert a large amount of input element data into data objects that can be uniformly managed internally by the system, thereby constructing a lightweight scene graph with spatial indexing. This includes the following steps: S1.1, the system receives original element data and creates an element internal agent for each graphical element. The element internal agent does not directly hold rendering data, but contains a unique identifier of the element and bounding box data defined by minimum / maximum X and minimum / maximum Y coordinates.

[0048] S1.2, based on all the bounding box information, a global spatial index structure is constructed to support subsequent fast spatial queries based on the view window.

[0049] S1.3, the system assigns a logical layer to each agent according to predefined rules; at the same time, the complexity score is calculated based on the number of vector path points of the element and the rendering effect complexity.

[0050] S2, render a low-detail panoramic map; including the following steps: S2.1, the system calls the multi-level detail management module during initialization to obtain the low-detail LOD version of all elements; Specifically, for elements determined to be complex in step S1, this version is an alternative solid color geometric figure; for simple elements, their inherent simplified representation is used.

[0051] S2.2, the rendering scheduling module uses the default initialization global rendering strategy, and the composition module draws all low-detail LOD versions obtained in step S2.1 to the canvas to generate a complete low-detail panoramic map.

[0052] S3, slice the low-detail panoramic map into multiple layers, and assign importance to the slice areas; the system subsequently performs rendering scheduling based on the properties of the slice areas.

[0053] including the following steps: S3.1, the system separates the low-detail panoramic map generated in S2 according to the logical layers assigned in step S1.3; then, for each layer, the panoramic map is divided into a number of slice areas according to a fixed grid size.

[0054] S3.2, the system uses the static feature analysis unit in the visual importance analysis module to analyze the visual features of each slice of the low-detail panoramic map, including the following steps: S3.2.1, calculate the spatial density of elements in each slice. The higher the density, the higher the initial importance score of the slice.

[0055] S3.2.2, analyze the color and contrast features of each slice, and slices with high contrast and high saturation get higher attention score.

[0056] S4, integrate the above attention, form a static attention heat map covering all slices, and then dynamically perform rendering tasks for different slice areas according to the real-time state and prediction information of the user window. Specifically, the following steps are included: S4.1, the rendering scheduling module monitors the transformation of the user window in real time, and divides the scene space into a core visible area and a preloading buffer area according to the current window position; S4.2, dynamic scheduling decision: for each slice defined in step S3.1, the system integrates its area and the attention heat map of step S3.2 to make a dynamic scheduling decision. The dynamic scheduling process based on the attention heat map includes the following processes: S4.2.1: if the slice is in the core visible area and the slice has high attention, immediately schedule to load the high-detail LOD version of the slice; S4.2.2: if the slice is in the preloading buffer area and the slice has high attention, define it as a high-priority preloading task, and schedule to load the high-detail LOD version of the slice.

[0057] S4.2.3: if the slice is in the preloading buffer area but has medium or low attention, do not schedule or only load the low-detail LOD version of the slice when the system is idle. When the user interacts, the attention heat map is updated, and the high-detail LOD version is scheduled and rendered according to the change in attention.

[0058] S4.2.4: if the slice is in the dormant area, mark it as dormant and instruct the cross-layer cache module to serialize and store it to release memory.

[0059] S4.3, during the interaction process, the dynamic behavior learning unit continuously analyzes the user behavior and updates the static heat map generated in step S3.2 in real time.

[0060] S5, the synthesis module performs canvas output of the slice within the window range based on the window.

[0061] During the process, when a slice area is completed and the content is stable, the rendering output is stored as a bitmap snapshot, so that subsequent interactions can be directly called, avoiding a large amount of repeated calculation.

[0062] During the rendering result synthesis process, the synthesis module stores the bitmap snapshot and the scheduled dynamic element rendering result in order of layer depth, and finally displays them on the canvas through a graphics synthesis tool.

[0063] To sum up, the application forms a systematic solution by paying attention to degree prediction, multi-level LOD and cross-layer caching technology, and cooperating. The application not only improves the performance, but also innovates the rendering architecture, and improves the rendering performance, memory efficiency, interactive fluency and convenience in multiple dimensions.

[0064] Of course, the application can have other various embodiments, and those skilled in the art can make various corresponding changes and modifications according to the application without departing from the spirit and essence of the application. However, these corresponding changes and modifications should belong to the protection scope of the claims attached to the application.

Claims

1. A high-density element loading system for large-scene rendering, characterized in that, The scene data analysis module, the multi-level detail level management module, the visual importance analysis module, the rendering scheduling module, and the synthesis module are included. The scene data analysis module is configured to receive original scene data and perform structured processing thereon, and is configured to construct a lightweight scene graph with spatial indexing. The multi-level detail level management module is configured to pre-create multiple versions of rendering tasks with different levels of detail for high-density elements, and includes a multi-level LOD generation unit. The visual importance analysis module is configured to detect a user's focus area and assign a higher rendering priority to an area with higher importance, and includes a static feature analysis unit configured to generate a static importance heat map and a dynamic behavior learning unit configured to dynamically correct the importance heat map. The rendering scheduling module is configured to dynamically formulate an optimal rendering strategy based on the static importance heat map from the visual importance analysis module, the current view window state, and the resource conditions of the multi-level detail level management module, and assign rendering in real time to the multi-level LOD generation unit for generation of rendering result data. The synthesis module is configured to combine the cached dynamic elements and bitmaps onto a display canvas.

2. The high-density element loading system for large scene rendering of claim 1, wherein, The scene data analysis module includes an element loading unit configured to receive original element data, and the element loading unit is configured to describe the type, position, color, and shape path attributes of an element based on a text key-value pair structure, and create an element internal agent item, and the element internal agent item includes a unique identifier and bounding box data corresponding to the element. A spatial index construction unit is configured to establish a global spatial index structure. An element data management unit is configured to assign a logical layer to which each element internal agent item belongs, and score the initial graph complexity.

3. The high-density element loading system for large scene rendering of claim 1, wherein, The LOD versions generated by the multi-level LOD generation unit include three types: a high-detail LOD version recording an original vector path, a medium-detail LOD version recording a simplified path, and a low-detail LOD version with a substitute solid color geometric figure.

4. The high-density element loading system for large scene rendering of claim 1, wherein, A cross-layer caching module is further included, which is responsible for managing the cache data of off-screen canvases.

5. The high-density element loading system for large scene rendering of claim 1, wherein, The multi-level detail level management module further includes an LOD resource pool configured to store and manage all LOD version resource data created by the multi-level LOD generation unit.

6. A high-density element loading method applied to large scene rendering, characterized in that, The application of a high-density element loading system for large scene rendering based on claim 1, and the method includes the following steps: S1, the system receives original scene data, and performs structured processing on the parsed scene data; Step S1 includes the following steps: S1.1, the system receives original element data, and creates an element internal agent item for each graphical element, and the element internal agent item includes a unique identifier of the element and bounding box data defined by minimum / maximum X and minimum / maximum Y coordinates; S1.2, based on all the bounding box information, a global spatial index structure is constructed to support subsequent view-based fast spatial queries; S1.3, the system assigns a logical layer to each agent according to a predefined rule; meanwhile, a complexity score is calculated based on the number of vector path points of the element and the complexity of rendering effect; S2, a low-detail panoramic map is rendered; including the following steps: S2.1, the system calls the multi-level detail management module in the initialization process to obtain the low-detail LOD version of all elements; Specifically, for the elements determined to be complex in step S1, this version is an alternative solid color geometric figure; for simple elements, the inherent simplified representation is used; S2.2, the rendering scheduling module adopts the default initialization global rendering strategy, and the composition module draws all the low-detail LOD versions obtained in step S2.1 to the canvas to generate a complete low-detail panoramic map; S3, the low-detail panoramic map is sliced into multiple layers, and the slice area is given a degree of attention; the system subsequently performs subsequent rendering scheduling based on the attributes of the slice area; including the following steps: S3.1, the system separates the low-detail panoramic map generated in S2 according to the logical layer assigned in step S1.3; then, for each layer, the panoramic map is divided into a plurality of slice areas according to a fixed grid size; S3.2, the system uses the static feature analysis unit in the visual attention analysis module to analyze the visual features of each slice of the low-detail panoramic map; S4, based on the above attention, a static attention heat map covering all slices is formed, and then according to the real-time state and prediction information of the user window, the rendering task of different slice areas is dynamically executed; S5, the composition module outputs the canvas of the window range slice based on the window.

7. The high-density element loading method for large scene rendering according to claim 6, wherein, The step S3.2 includes the following steps: S3.2.1, calculate the spatial density of elements in each slice, the higher the density, the higher the initial attention score of the slice; S3.2.2, analyze the color and contrast features of each slice, and the slice with high contrast and high saturation obtains a higher attention score.

8. The high-density element loading method for large scene rendering according to claim 6, wherein, The step S4 includes the following steps: S4.1, the rendering scheduling module monitors the transformation of the user window in real time, and divides the scene space into a core visible area and a preloading buffer area according to the current window position; S4.2, dynamic scheduling decision: for each slice defined in step S3.1, the system integrates its region and the attention heat map of step S3.2 to make a dynamic scheduling decision; S4.3, in the interactive process, the dynamic behavior learning unit continuously analyzes the user behavior to update the static heat map generated in step S3.2 in real time.

9. The high-density element loading method for large scene rendering according to claim 8, wherein, The dynamic scheduling process based on the attention heat map in step S4.2 includes the following processes: S4.2.1, if the slice is in the core visible area and has high attention, load its high-detail LOD version immediately; S4.2.2, if the slice is in the preloading buffer area and has high attention, define it as a high-priority preloading task, and load its high-detail LOD version. S4.2.3, if the slice is in the preloaded buffer but the importance is medium or low, do not schedule or only load the low detail LOD version of the slice when the system is idle, and update the importance heat map when the user interacts, and schedule and render the high detail LOD version according to the change in importance; S4.2.4, if the slice is in the dormant area, mark it as dormant, and instruct the cross-layer cache module to serialize and store it to release memory.

Citation Information

Patent Citations

  • System and method for increasing canvas rendering speed of webpage

    CN105279253A

  • Map loading method and device, electronic equipment, storage medium and program product

    CN117453844A

  • Scene rendering method and device, storage medium and electronic equipment

    CN118247407A

Cited By

  • Adaptive rendering optimization method, system, device and medium for large-scale workflow engine

    CN122472971A