Three.js-based BIM model rendering and component positioning method, device and product

By combining independent components in large-scale BIM models and using octree for spatial segmentation, the problem of insufficient fluency and interactivity in web-side rendering is solved, and efficient rendering and fine component interaction are achieved.

CN119690559AActive Publication Date: 2025-03-25WISDRI ENG & RES INC LTD
View PDF 6 Cites 0 Cited by

Patent Information

Application Number
CN202411711393.7
Authority / Receiving Office
CN · China
Patent Type
Applications(China)
Current Assignee / Owner
Filing Date
2024-11-26
Publication Date
2025-03-25
Estimated Expiration
2044-11-26

AI Technical Summary

Technical Problem

In web-side rendering of large-scale BIM models, the existing technology is difficult to meet the requirements of fluency and interactivity, especially when the number of components is huge, the problem of rendering frame drops or browser crashes has not been completely solved.

Method used

By combining multiple independent components in the imported BIM model that meets the predetermined merge conditions into a whole model, and using an octree to divide the space of the BIM model into multiple subspaces, nodes corresponding to the subspace are generated, and fast positioning and interaction of components are achieved.

Benefits of technology

This method significantly reduces the rendering pressure in the web-side rendering of large-scale BIM models, improves rendering efficiency and interactivity, enables users to quickly locate and obtain information of individual components, and meets the fine interaction needs of the BIM model.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN119690559A_ABST
    Figure CN119690559A_ABST
Patent Text Reader

Abstract

The invention provides a Three.js-based BIM model rendering and component positioning method, device and product. The method comprises the following steps: merging a plurality of independent components meeting a predetermined merging condition into an integral model; dividing the space of the BIM model into a plurality of subspaces by using an octree, and generating corresponding nodes; each independent component is distributed to a corresponding octree node; in response to clicking on the overall model, determining a screen coordinate of a click point, and obtaining a three-dimensional space coordinate of the click point in the BIM model; determining a minimum octree node to which the click point belongs; and in the at least one independent component contained in the minimum octree node, determining the independent component of which the boundary box contains the click point as a target component corresponding to the click. By means of the technical scheme, click query of the single component can be kept on the basis of the combined model, and therefore the requirements for fluency and interactivity are met in Web end rendering of a large-scale BIM model.
Need to check novelty before this filing date? Find Prior Art

Description

Technical Field

[0001] This invention relates to the field of BIM model rendering, and in particular to a method, device, and product for BIM model rendering and component positioning based on Three.js. Background Technology

[0002] Unlike the general construction industry, in the steel industry, BIM models, or Building Information Modeling, usually contain a much larger number of complex components and parts, which put a lot of pressure on the three.js rendering process on the web, causing frame drops or browser crashes.

[0003] In the rendering of BIM models on the web, for large-scale BIM models, such as those containing hundreds of thousands of component data points, commonly used optimization methods include the Level of Detail (LOD) method, the model hierarchy loading method, and the InstancedMesh optimization method. Among these:

[0004] LOD (Level of Detail) method: LOD dynamically loads different resolution versions of the model based on the camera distance, displaying a low-resolution model at a distance and a high-resolution model at a close distance. Its drawbacks include: in BIM scenarios, LOD still places a significant burden on rendering models viewed at close range, especially when there are many high-resolution components in the same viewpoint, making resource consumption unavoidable; furthermore, LOD implementation is complex, requiring layer-by-layer storage and loading of model data, increasing storage and management burdens.

[0005] Model hierarchical loading: Load model data in batches or divide the model into regions, loading only the corresponding region model within the visible range; its disadvantages include: hierarchical loading will cause delays during the initial load and frequent region switching, affecting the user experience; for large-volume BIM data, each model loading switch will still put significant pressure on rendering resources.

[0006] InstancedMesh optimization: Instantiate and render identical geometries such as repeated beams and columns; its disadvantages include: although it reduces repeated rendering, it is still ineffective for a large number of unique components, and additional data structures are still required after instantiation to support the selection and interaction of individual components.

[0007] In summary, although the above methods optimize rendering performance to some extent, they still cannot meet the requirements of smoothness and interactivity in the web rendering of large-scale BIM models. Summary of the Invention

[0008] The embodiments of the present invention provide a method, device and product for BIM model rendering and component positioning based on Three.js, so as to maintain the click query of individual components on the basis of merging models, thereby meeting the requirements of smoothness and interactivity in the web rendering of large-scale BIM models.

[0009] To achieve the above objectives, on the one hand, a method for BIM model rendering and component positioning based on Three.js is provided, including:

[0010] Merge multiple independent components in the imported BIM model that meet the predetermined merging conditions into a whole model, and save the coordinates of the boundary box of each of the multiple independent components.

[0011] The space of the BIM model is divided into multiple subspaces using an octree, and multiple nodes corresponding to the multiple subspaces are generated.

[0012] Based on the coordinates of the bounding box of each of the multiple independent components and the subspace corresponding to the octree node, each of the multiple independent components is assigned to the corresponding octree node;

[0013] After the BIM model is loaded onto the front end for display, in response to a click on the overall model, the screen coordinates of the click point corresponding to the click are determined, and the screen coordinates are converted into the three-dimensional spatial coordinates of the click point in the BIM model.

[0014] Based on the three-dimensional spatial coordinates of the click point in the BIM model, determine the smallest octree node with the smallest subspace among the octree nodes to which the click point belongs;

[0015] The independent component whose bounding box contains the click point among at least one independent component contained in the minimum octree node is determined as the target component corresponding to the click.

[0016] Preferably, the method further includes, after determining the target component corresponding to the click, returning the information of the target component to the front end.

[0017] Preferably, the method, wherein the step of merging the plurality of independent components into a single integrated model includes:

[0018] Obtain the world coordinates of each of the plurality of independent components in the world coordinate system;

[0019] Based on the world coordinates of each independent component in the world coordinate system, the multiple independent components are merged to generate the merged component corresponding to the overall model;

[0020] Generate a Mesh object corresponding to the overall model based on the merged components;

[0021] Add the Mesh object to the selected scene to replace the multiple individual components in the selected scene.

[0022] Preferably, the method further includes, after adding the Mesh object to the selected scene, removing the multiple independent components.

[0023] Preferably, in the method, the multiple independent components have a uniform material before being merged.

[0024] Preferably, the method, in which the step of dividing the space of the BIM model into multiple subspaces using an octree and generating multiple nodes corresponding to the multiple subspaces includes:

[0025] The global space of the BIM model is initialized as the root node of an octree;

[0026] Starting from the global space, the space is recursively divided into eight subspaces according to the center point, and eight child nodes are generated corresponding to the eight subspaces. The division of the subspace stops when the number of independent components contained in the subspace is less than or equal to a predetermined number. Each octree node records: the node's own boundary, the identifier of its own parent node, the identifier of its own child nodes, the depth of the current node, and the information of the components it contains. The information of the components includes: the component identifier and the coordinates of the component bounding box.

[0027] Preferably, the method, wherein the step of converting the screen coordinates into the three-dimensional spatial coordinates of the click point in the BIM model includes:

[0028] The screen coordinates are normalized to obtain normalized coordinates;

[0029] Using the Raycaster class in Three.js, the normalized coordinates are mapped onto the camera's view frustum to generate a ray that extends along the direction from the camera to the 3D space.

[0030] Using the intersectObject or intersectObjects method of Raycaster, the intersection point of the ray and the Mesh object is detected to obtain the position coordinates of the intersection point and the information of the object intersecting with the intersection point; wherein, the position coordinates of the intersection point are determined as the three-dimensional spatial coordinates of the click point.

[0031] On the other hand, an electronic device is provided, including a memory and a processor, the memory storing at least one program, the at least one program being executed by the processor to implement the method for BIM model rendering and component positioning based on Three.js as described above.

[0032] In another aspect, a computer-readable storage medium is provided, wherein at least one program is stored therein, the at least one program being executed by a processor to implement the method for BIM model rendering and component positioning based on Three.js as described above.

[0033] In another aspect, a computer program product is provided, comprising a computer program, characterized in that, when the computer program is executed by a processor, it implements the steps of the method for BIM model rendering and component positioning based on Three.js as described above.

[0034] The above technical solution has the following technical effects:

[0035] The technical solution of this invention combines component model merging with interactivity retention. It reduces rendering pressure and rendering resource consumption by merging models, improves the rendering performance of the web client, and can simultaneously achieve component interaction by combining spatial segmentation query in the background. This allows users to still obtain information about individual components by clicking even after merging, thus meeting the fine interaction requirements of BIM models.

[0036] By applying octrees to click detection in large-scale models, coordinate positioning queries are accelerated, the backend query speed is significantly improved, the problem of inaccurate positioning after component merging is solved, and it is suitable for large-scale BIM models, improving system response speed.

[0037] By rendering the overall model on the front end and querying the coordinates on the back end, a balance is achieved between rendering optimization and query efficiency, making it suitable for web-based applications of large-scale BIM models. Attached Figure Description

[0038] Figure 1 This is a flowchart illustrating a BIM model rendering and component positioning method based on Three.js according to an embodiment of the present invention.

[0039] Figure 2 This is a schematic diagram of the component merging process in a BIM model rendering and component positioning method based on Three.js according to an embodiment of the present invention.

[0040] Figure 3 This is a code example of component merging in a BIM model rendering and component positioning method based on Three.js according to an embodiment of the present invention;

[0041] Figure 4 This is an exemplary flowchart illustrating the octree construction process in a BIM model rendering and component positioning method based on Three.js according to an embodiment of the present invention.

[0042] Figure 5 This is a JSON code example of the MongoDB document for an octree node in a BIM model rendering and component positioning method based on Three.js, as an embodiment of the present invention.

[0043] Figure 6 This is a flowchart illustrating the process of converting screen coordinates into the three-dimensional spatial coordinates of the click point in the BIM model in a BIM model based on Three.js, according to an embodiment of the present invention.

[0044] Figure 7 This is a code example of converting screen coordinates into the three-dimensional spatial coordinates of the click point in the BIM model in a BIM model based on Three.js, as an embodiment of the present invention.

[0045] Figure 8 This is a schematic diagram illustrating the process of querying and locating components in the background in a BIM model rendering and component positioning method based on Three.js according to an embodiment of the present invention.

[0046] Figure 9 This is a flowchart illustrating the specific implementation of a BIM model rendering and component positioning method based on Three.js according to an embodiment of the present invention. Detailed Implementation

[0047] To further illustrate the various embodiments, the present invention provides accompanying drawings. These drawings are part of the disclosure of the present invention, primarily used to illustrate the embodiments and to explain the operating principles of the embodiments in conjunction with the relevant descriptions in the specification. With reference to these drawings, those skilled in the art should be able to understand other possible implementations and the advantages of the present invention. Components in the drawings are not drawn to scale, and similar component symbols are generally used to represent similar components.

[0048] The present invention will now be further described in conjunction with the accompanying drawings and specific embodiments.

[0049] The inventors of this application discovered that in rendering methods for large-scale BIM models, merging components can significantly reduce rendering pressure. However, in existing technologies, after a single component is merged, it is usually impossible to obtain the relevant attribute information of the individual component by clicking on the merged overall model. In typical business needs, users often need to click to locate a specific component to view its information or perform other operations; therefore, these components are often not allowed to be merged. To solve this problem, this invention proposes a novel method for rendering and locating components in large-scale BIM models.

[0050] The BIM model rendering and component positioning method based on Three.js of this invention reduces rendering pressure by merging independent components. Moreover, when a user wants to locate a specific independent component, the user only needs to select, for example, the position of the independent component in the merged model. The coordinates of the click point can be located in the background to locate the specific independent component that the user wants to locate. Thus, while reducing the rendering pressure of large-scale BIM models, it improves the user's interactive experience.

[0051] The implementation logic of this invention includes:

[0052] Model merging: Merge all independent components in the BIM model that meet the predetermined merging conditions to generate an overall model, reducing the number of times individual components are rendered, thereby reducing resource consumption and improving rendering efficiency;

[0053] Octree spatial partitioning and backend data storage: During model merging, the bounding box coordinates of each component are recorded and stored in the database or cache; octrees are used to partition the space of the model to accelerate subsequent queries;

[0054] Mouse click detection: When a mouse click is detected, Three.js obtains the 3D spatial coordinates of the click point and sends these coordinates to the backend for querying.

[0055] Background query for component location: After receiving the coordinates in the background, the system uses an octree to find the spatial region to which the point belongs, then matches it with the list of components in that region, and finally uses boundary detection to determine the specific component where the clicked point is located.

[0056] Example 1:

[0057] Figure 1 This is a flowchart illustrating a BIM model rendering and component positioning method based on Three.js according to an embodiment of the present invention. Figure 1 The BIM model rendering method based on Three.js in this embodiment includes:

[0058] 101. Merge multiple independent components in the imported BIM model that meet predetermined merging conditions into a single overall model, and save the coordinates of the boundary box of each independent component; in one specific implementation, the boundary box is defined by the minimum coordinates (x-axis, y-axis, and z-axis) of the coordinates of each point contained in the independent component in the three-dimensional world coordinate system. min y min , z min ) and the point formed by the maximum coordinates in the x-axis direction, the y-axis direction, and the z-axis direction (x max y max , z max The bounding box is determined by the two points mentioned above; in one specific implementation, the bounding box is a cube defined by the two points mentioned above; the coordinates of the bounding box include the coordinates of the two points mentioned above. In one specific implementation, similar components that satisfy predetermined similarity conditions are merged into a whole.

[0059] In one specific implementation, interfaces such as BufferGeometry and Mesh provided by Three.js are used to merge multiple components, i.e. component geometry, and create a more efficient rendering object; Figure 2 This is a flowchart illustrating the component merging process.

[0060] like Figure 2 Component merging includes:

[0061] Extract components, i.e., geometric shapes, from the original component model;

[0062] Transform the geometric shape into coordinates in the world coordinate system;

[0063] Merge geometry;

[0064] Generate the merged Mesh;

[0065] Replace the original standalone components with the merged Mesh.

[0066] The following is a detailed description of each step:

[0067] 1) Initialize components, i.e., geometry and materials:

[0068] Obtain all independent component models that need to be merged, and ensure that they have the same material or can have the same material. Otherwise, the material needs to be processed before merging.

[0069] Create a BufferGeometry object to store the merged geometry data; the geometry data includes the data of the points, lines and faces corresponding to the component, such as vertex coordinates and face indices;

[0070] Iterate through each component model:

[0071] The applyMatrix4 method is executed on the BufferGeometry of each component to transform its local coordinates in the corresponding design software to the world coordinate system; for example, the design software mentioned above is Bentley; this step is used to ensure the position of the components to be correctly merged.

[0072] MergeBufferGeometries is used to merge the geometry data of each component into a large geometry, thus obtaining the overall model of the merged components.

[0073] 2) Create a Mesh corresponding to the merged overall model described above:

[0074] Create a new Mesh object using the merged BufferGeometry and a unified material. This merged Mesh contains the geometry data of all the original individual components.

[0075] Add the Mesh to the scene, i.e., the selected 3D scene, to replace all the previous individual components;

[0076] 3) Clear memory:

[0077] Remove existing individual components to free up memory and optimize rendering performance.

[0078] The key interfaces of Three.js are described below:

[0079] BufferGeometry: A component, or geometric data structure, in Three.js that supports efficient data storage and manipulation;

[0080] applyMatrix4: Transforms the vertex coordinates of a geometry into the world coordinate system, which is used to correctly merge components, i.e., geometry.

[0081] mergeBufferGeometries: Merges multiple BufferGeometry into a single geometry.

[0082] Figure 3 Code example for implementing component merging.

[0083] 102. Use an octree to divide the space of the BIM model into multiple subspaces and generate multiple nodes corresponding to the multiple subspaces;

[0084] In one specific implementation, step 102 includes: initializing the global space of the BIM model as the root node of an octree; starting from the global space, recursively dividing the space into eight subspaces according to the center point and generating eight child nodes corresponding to the eight subspaces, until the number of independent components contained in the subspace is less than or equal to a predetermined number before stopping the division of the subspace; wherein, each octree node records: the node's own boundary, the identifier of its own parent node, the identifier of its own child nodes, the depth of the current node and the information of the components it contains, the component information including: component identifier and the coordinates of the component boundary box.

[0085] Figure 4 This is a schematic diagram illustrating an exemplary process for constructing an octree in an embodiment of the present invention. Figure 4 The octree construction in this embodiment of the invention includes:

[0086] The global space is divided into 8 regions;

[0087] Check the number of components in each area;

[0088] When the number of components within a region is less than or equal to a predetermined threshold, the region is determined to meet the condition for stopping segmentation, and is retained without further segmentation. Otherwise, when the number of components within a region exceeds the predetermined threshold, the region is further divided or segmented. The method for further division or segmentation is to divide the region (space) into eight sub-regions or sub-spaces; repeat the component number confirmation steps above, stop segmentation, and retain or continue segmentation. Segmentation can begin from the center point of the region or space or from other pre-selected points. This method of division or segmentation achieves recursive segmentation. Figure 3 The example provided uses regions 1, 2, and 3. Region 1 was retained, while regions 2 and 3 were further subdivided.

[0089] For example, implementing octree space partitioning based on Three.js includes:

[0090] 1) Initialize the root node:

[0091] The root node of an octree represents the entire spatial extent (e.g., the outer bounding box of the entire scene), and each node contains a unique ID, boundary coordinates, depth information, and a list of child nodes.

[0092] 2) Recursive node splitting:

[0093] Recursion divides the space into eight subspaces based on the center point, generating eight child nodes;

[0094] Each node records its own boundary and includes the ID of the parent node, the depth of the current node, and preliminary information about the component; the preliminary information about the component includes: the coordinates of the corresponding bounding box and the ID of the component;

[0095] Nested nodes are stored in MongoDB, and each node is uniquely identified using an identifier field, the _id field.

[0096] 3) Storage nodes and child nodes:

[0097] a) Store each node as a MongoDB document; each document records information such as node boundaries, child node IDs, component data, and the current node's hierarchy (depth); Figure 5 Example JSON code for the MongoDB document for each octree node.

[0098] b) Store the component's ID, location, and boundary information in the component data to facilitate subsequent precise positioning.

[0099] 103. Based on the coordinates of the bounding box of each independent component and the subspace corresponding to the octree node, assign each independent component to the corresponding octree node.

[0100] This step assigns components to octree nodes, specifically:

[0101] For each component, check whether its bounding box is within the current node's range;

[0102] If the bounding box of a component is smaller than the current node's bounding box but is within the current node's bounding box, then it is treated as a component of that node and stored in the node's component list; otherwise, it is recursively assigned to a smaller child node.

[0103] This invention embodiment achieves octree spatial partitioning of the BIM model and backend data storage through steps 102 and 103. In one specific implementation, the backend database is a NoSQL database—MongoDB. Octree storage and spatial partitioning are implemented in MongoDB, utilizing the nested structure of documents to recursively represent octree nodes, and spatial indexing to efficiently retrieve data.

[0104] 104. After the BIM model is loaded onto the front end for display, in response to a click on the overall model, the screen coordinates of the click point corresponding to the click are determined, and the screen coordinates are converted into the three-dimensional spatial coordinates of the click point in the BIM model; in specific implementation, in response to the user's selection or click on a single component in the overall model, such as a click using a mouse;

[0105] Figure 6This is a flowchart illustrating the process of converting screen coordinates into the three-dimensional spatial coordinates of the click point in the BIM model in a specific implementation. Figure 7 This is a code example of converting screen coordinates into the three-dimensional spatial coordinates of the click point in the BIM model in a BIM model based on Three.js, which is an embodiment of the present invention.

[0106] like Figure 6 The coordinate transformation process includes:

[0107] Normalize the screen coordinates to obtain normalized coordinates;

[0108] Using the Raycaster class in Three.js, normalized coordinates are mapped onto the camera's view frustum to generate a ray that extends along the direction from the camera to the 3D space.

[0109] Use Raycaster's intersectObject or intersectObjects methods to detect the intersection of the ray and the Mesh object;

[0110] Determine if an intersection point exists; if so, return the position coordinates of the intersection point and information about the object intersecting with it; otherwise, if there is no intersection point, no operation is performed; the position coordinates of the intersection point are used as the three-dimensional spatial coordinates of the clicked point.

[0111] In this way, accurate conversion from screen coordinates to 3D coordinates and click detection can be achieved, effectively identifying which component the user clicked and obtaining its spatial coordinates.

[0112] 105. Based on the three-dimensional spatial coordinates of the click point in the BIM model, determine the smallest octree node in the octree node to which the click point belongs, and the smallest octree node in the subspace.

[0113] 106. Among the at least one independent component contained in the smallest octree node, the independent component whose bounding box contains the click point is determined as the target component corresponding to the click. Further, the information of the target component, such as its attributes, is returned to the front end.

[0114] Steps 105 and 106 above enable the querying or retrieval of independent components within the BIM model space. Specifically:

[0115] During a query or retrieval, the coordinates of the clicked point are obtained based on the point selected by the user, such as a point on the screen clicked by the mouse. Starting from the root node, the smallest octree node containing the clicked point is recursively queried. By utilizing MongoDB's spatial index, the search for the child nodes containing the clicked point can be accelerated.

[0116] Figure 8This is a schematic diagram illustrating the process of querying and locating components via a background process in one embodiment of the present invention. For example... Figure 8 The process of querying and locating components through the backend includes:

[0117] Octree localization: After a user clicks and generates the coordinates of the click point, the coordinates are sent to the backend. The backend starts from the root node in the octree and searches step by step to locate the subspace region where the click point is located until the smallest subregion containing the point is found. Specifically, it determines whether the click point is within the range of the current node. If so, it further determines whether the current node has child nodes. If it has child nodes, it recursively checks the child nodes. If it has no child nodes, it finds the smallest subregion containing the click point and continues with the subsequent boundary detection steps.

[0118] Boundary detection: Obtain the list of components within the sub-region; traverse the bounding boxes of the components, and for each component, determine whether the click point is within the bounding box of the component, that is, determine whether the bounding box of the component contains the coordinates of the click point, so as to further narrow down the scope of the searched components;

[0119] Final component location: If the click point is located within the bounding box of a component, then the component is determined to be the clicked target, and the component identifier (component ID) is returned; otherwise, continue to check the next component.

[0120] Figure 9 This is a schematic flowchart illustrating a specific implementation of a BIM model rendering and component positioning method based on Three.js according to an embodiment of the present invention. Figure 9 The specific implementation includes:

[0121] Importing BIM models;

[0122] Merge component geometry, that is, merge multiple selected independent components;

[0123] Record the boundary boxes and corresponding coordinates of each independent component;

[0124] Construct an octree to store space partitioning information;

[0125] Load the merged component BIM model onto the front end for display;

[0126] Respond to user click events, specifically when a user clicks on the merged overall model within the BIM model;

[0127] Send the coordinates of the click point to the backend, and use octal query in the backend;

[0128] Locate the list of components containing the clicked point;

[0129] Traverse the component boundaries;

[0130] Determine the component ID corresponding to the specific clicked component in the overall model;

[0131] Query the attribute information of this component;

[0132] Return the component's attribute information to the front end.

[0133] Example 2:

[0134] The present invention also provides an electronic device, including a memory and a processor, wherein the memory stores at least one program, which is executed by the processor to implement the method for BIM model rendering and component positioning based on Three.js as described above.

[0135] Example 3:

[0136] The present invention also provides a computer-readable storage medium storing a computer program, which, when executed by a processor, implements the steps of the method described in the embodiments of the present invention.

[0137] If the modules / units integrated in the computer unit are implemented as software functional units and sold or used as independent products, they can be stored in a computer-readable storage medium. Based on this understanding, all or part of the processes in the methods of the above embodiments can also be implemented by a computer program instructing related hardware. The computer program can be stored in a computer-readable storage medium, and when executed by a processor, it can implement the steps of the various method embodiments described above. The computer program includes computer program code, which can be in the form of source code, object code, executable files, or certain intermediate forms. The computer-readable medium can include: any entity or device capable of carrying the computer program code, recording media, USB flash drives, portable hard drives, magnetic disks, optical disks, computer memory, read-only memory (ROM), random access memory (RAM), and software distribution media, etc. It should be noted that the content contained in the computer-readable medium can be appropriately increased or decreased according to the requirements of legislation and patent practice in the jurisdiction.

[0138] Example 4:

[0139] The present invention also provides a computer program product, including a computer program that, when executed by a processor, implements the steps described above.

[0140] Although the invention has been specifically shown and described in conjunction with preferred embodiments, those skilled in the art should understand that various changes in form and detail may be made to the invention without departing from the spirit and scope of the invention as defined in the appended claims, all of which shall be within the scope of protection of the invention.

Claims

1. A method for BIM model rendering and component positioning based on Three.js, characterized in that: include: Merge multiple independent components in the imported BIM model that meet a predetermined merging condition into an overall model, and save the coordinates of a boundary box of each independent component in the multiple independent components; Using an octree to divide the space of the BIM model into a plurality of subspaces, and generating a plurality of nodes corresponding to the plurality of subspaces; Allocating each of the plurality of independent components to a corresponding octree node according to the coordinates of the bounding box of each of the plurality of independent components and the subspace corresponding to the octree node; After the BIM model is loaded into the front-end display, in response to a click on the overall model, the screen coordinates of the click point corresponding to the click are determined, and the screen coordinates are converted into the three-dimensional space coordinates of the click point in the BIM model; Determine, according to the three-dimensional spatial coordinates of the click point in the BIM model, a minimum octree node with the smallest subspace among the octree nodes to which the click point belongs; An independent component whose boundary box contains the click point among at least one independent component contained in the minimum octree node is determined as a target component corresponding to the click.

2. The method according to claim 1, characterized in that After determining the target component corresponding to the click, the method further includes: The information of the target component is returned to the front end.

3. The method according to claim 1, characterized in that The step of combining the plurality of independent components into an overall model comprises: Obtaining the world coordinates of each of the plurality of independent components in a world coordinate system; According to the world coordinates of each independent component in the world coordinate system, the multiple independent components are merged to generate a merged component corresponding to the overall model; Generate a Mesh object corresponding to the overall model according to the merged component; The Mesh object is added to the selected scene to replace the multiple independent components in the selected scene.

4. The method according to claim 3, characterized in that After adding the Mesh object to the selected scene, it also includes: The plurality of independent components are removed.

5. The method according to claim 1, characterized in that The multiple independent components have a unified material before being combined.

6. The method according to claim 1, characterized in that The steps of using an octree to divide the space of the BIM model into a plurality of subspaces and generating a plurality of nodes corresponding to the plurality of subspaces include: Initialize the global space of the BIM model as the root node of the octree; Starting from the global space, the space is recursively divided into eight subspaces according to the center point and eight child nodes corresponding to the eight subspaces are generated, until the number of independent components contained in the subspace is less than or equal to a predetermined number, the division of the subspace is stopped; wherein each octree node records: the boundary of the node itself, the identifier of its own parent node, the identifier of its own child node, the depth of the current node and the information of the components contained, and the information of the components includes: the component identifier and the coordinates of the component boundary box.

7. The method according to claim 1, characterized in that The step of converting the screen coordinates into the three-dimensional space coordinates of the click point in the BIM model comprises: Normalizing the screen coordinates to obtain normalized coordinates; Use the Raycaster class of Three.js to map the normalized coordinates into the camera cone to generate a ray, which extends along the direction from the camera to the three-dimensional space; The intersectObject or intersectObjects method of Raycaster is used to detect the intersection of the ray and the Mesh object, and the position coordinates of the intersection and the object information intersecting with the intersection are obtained; wherein the position coordinates of the intersection are determined as the three-dimensional space coordinates of the click point.

8. An electronic device, characterized in that: It includes a memory and a processor, the memory stores at least one program, and the at least one program is executed by the processor to implement the method for BIM model rendering and component positioning based on Three.js as described in any one of claims 1 to 7.

9. A computer-readable storage medium, characterized in that: At least one program is stored in the storage medium, and the at least one program is executed by the processor to implement the method for BIM model rendering and component positioning based on Three.js as described in any one of claims 1 to 7.

10. A computer program product, comprising a computer program, characterized in that When the computer program is executed by a processor, the steps of the method for BIM model rendering and component positioning based on Three.js are implemented as described in any one of claims 1 to 7.

Citation Information

Patent Citations

  • Three-dimensional model plane pickup method and system based on position coding octree

    CN116188685A

  • Method for calculating construction progress of each component based on surveying and mapping point cloud and BIM model

    CN117808866A

  • Tree structure of point cloud double-layer spatial index and multi-resolution point cloud dividing and conquering construction algorithm

    CN118298114A

  • Tile-based BIM model rendering method, apparatus and device, and readable storage medium

    CN118470167A

  • Spatial indexing method of three dimensional model for 3D map service based on octree structure and method and apparatus for providing 3D map service using the same

    KR102050169B1