Application method, system and readable storage medium of BIM and GIS model in WebGL game engine

Abstract

The application provides a BIM and GIS model application method, system and readable storage medium in a WebGL game engine, the application method comprises the following steps: S1: importing a bridge rvt original model file, and deleting elements invisible to users; S2: exporting the attributes of the rvt to a database; S3: exporting into gltf, and performing a same-material merging operation on the gltf and performing compression processing through a compression algorithm; S4: loading the gltf file and materials through threejs on the front end; S5: configurable compression of Nginx to reduce transmission time; S6: after an object loaded by threejs is clicked, the object is associated with the attribute data saved in the database through an id, and is used for display; and S7: loading threejs on cesium or other maps, the BIM model loading based on the game engine is improved in user experience, so that a first person and an immersive experience can be realized, and light and shadow effects can be added.

Description

TECHNICAL FIELD

[0001] The present application relates to the technical field of computer, in particular to a BIM and GIS model application method in WebGL game engine, system and readable storage medium. BACKGROUND

[0002] The present application is mainly based on the following aspects: first, the combination of visual BIM model and related business is the future trend; second, with the development of the Internet, it is urgent to solve the problem of displaying models or office on mobile clients.

[0003] In the current user or system, as shown in the figure, Figure 1 The client generally uses a web browser to browse or office approval, so the system is required to work well on the web browser, and the BIM model is an improvement part of the traffic management system, which is easier for users to understand the BIM components of the current business, and intuitively see the current overall and partial state, providing visual data basis for work and decision-making. And being able to load on the app is a breakthrough in the BIM field, greatly improving the usability of the system.

[0004] The existing model display on the market has the following problems.

[0005] Non-BIM, such as tilt photography and tile slicing, cannot accurately represent the overall and partial state of the current model, and cannot reflect the properties of the components and the current relevance.

[0006] The biggest problem of using BIM model is that the model is too large, and the memory supported by the web browser is limited, which can easily cause crashes or slow loading.

[0007] Using BIM model, the current similar products cannot provide good user experience in model display, and cannot achieve 3D all-around operation of first-person experience.

[0008] Therefore, it is necessary to study a BIM and GIS model application method in WebGL game engine, system and readable storage medium to overcome the deficiencies of the prior art and solve or alleviate one or more of the above problems. SUMMARY

[0009] Therefore, the present application provides a BIM and GIS model application method in WebGL game engine, system and readable storage medium, which is a software system, a server using a cloud server as a carrier for deployment, and a user using a PC computer, a mobile phone or a tablet computer to access and use the platform management system through a browser. The browser loads the user model and caches it to the user client for next use, while displaying it to the user on the front end.

[0010] In an aspect, the application provides a method for applying BIM and GIS models in a WebGL game engine, the method comprising the following steps:

[0011] S1: Import the bridge rvt original model file, and delete elements invisible to users;

[0012] S2: Export the properties of the rvt to a database;

[0013] S3: Export to gltf, and perform a same-material merging operation on the gltf through a compression algorithm to perform compression processing;

[0014] S4: The front end loads the gltf file and materials through threejs;

[0015] S5: Nginx can be configured to compress to reduce transmission time;

[0016] S6: After an object loaded by threejs is clicked, the object is associated with the saved attribute data in the database through an id, and is used for display;

[0017] S7: Load threejs on cesium or other maps.

[0018] According to the aspect and any possible implementation manner described above, further provided is an implementation manner, wherein the bridge rvt original model file import target in S1 is Revit 2020.

[0019] According to the aspect and any possible implementation manner described above, further provided is an implementation manner, wherein the invisible elements in S1 include small-area and large-quantity triangular faces and elements that are wrapped by other materials and cannot be operated by users.

[0020] According to the aspect and any possible implementation manner described above, further provided is an implementation manner, wherein the database import process in S2 is that the rvt file is directly exported to an excel and then imported to the database.

[0021] According to the aspect and any possible implementation manner described above, further provided is an implementation manner, wherein the same material is loaded only once after the same-material merging in S3.

[0022] According to the aspect and any possible implementation manner described above, further provided is an implementation manner, wherein the front end in S4 includes but is not limited to a web end, a pc, ios, and android.

[0023] According to the aspect and any possible implementation manner thereof, further provided is an implementation manner, and the Nginx compression in S5 is specifically: storing the processed file in nginx to reduce transmission amount, and configuring compression.

[0024] According to the aspect and any possible implementation manner thereof, further provided is an application system of BIM and GIS models in a WebGL game engine, the application system comprising:

[0025] The original module imports an optimization module for importing a bridge rvt original model file and deleting elements invisible to users;

[0026] The attribute output module is configured to export attributes of the rvt to a database;

[0027] The merging and compression module is configured to export gltf, perform a same-material merging operation on the gltf, and perform compression processing on the gltf through a compression algorithm;

[0028] The front-end loading module is configured to load the gltf file and materials through threejs on the front end;

[0029] The configuration compression module is configured to perform configurable compression through Nginx to reduce transmission time;

[0030] The correlation display module is configured to correlate, through an id, attribute data saved in the database, objects loaded by threejs after being clicked, and is configured to display the correlated objects;

[0031] The GIS loading module is configured to load threejs on cesium or other maps.

[0032] According to the aspect and any possible implementation manner thereof, further provided is a readable storage medium having a computer program stored thereon, the computer program being executed by a processor to implement the application method.

[0033] According to the aspect and any possible implementation manner thereof, further provided is an electronic device, characterized in that comprising a processor, a memory, a communication interface, and one or more programs, the one or more programs being stored in the memory and configured to be executed by the processor, and the program comprising instructions for executing the application method.

[0034] Compared with the prior art, the application can obtain the following technical effects:

[0035] 1): the system of the application realizes the purpose of loading BIM model in web browser, users access the system by using PC computer, mobile phone or tablet computer, etc., because the model has been optimized, users can quickly show large BIM model. The purpose of quickly loading BIM model of transportation industry on the browser is realized;

[0036] 2): based on the game engine, the BIM model loading is improved in user experience, so that it can be first person and immersive experience, and light and shadow effect can be added, which cannot be achieved by directly loading BIM without game engine.

[0037] Of course, any product implementing the present application does not necessarily need to achieve all the technical effects described above at the same time. BRIEF DESCRIPTION OF DRAWINGS

[0038] In order to more clearly illustrate the technical solutions of the embodiments of the application, the drawings needed to be used in the embodiments will be briefly introduced below. Obviously, the drawings in the following description are only some embodiments of the application, and other drawings can be obtained by those skilled in the art without creative labor on the basis of these drawings.

[0039] Figure 1 is a processing method diagram of the prior art provided by an embodiment of the application;

[0040] Figure 2 is a flow chart of the application method provided by an embodiment of the application;

[0041] Figure 3 is a model import schematic diagram in the application method process provided by an embodiment of the application;

[0042] Figure 4 is a model adjustment schematic diagram in the application method process provided by an embodiment of the application;

[0043] Figure 5 is a model adjustment schematic diagram in the application method process provided by an embodiment of the application;

[0044] Figure 6 is a model adjustment schematic diagram in the application method process provided by an embodiment of the application;

[0045] Figure 7 is a model conversion output result diagram in the application method process provided by an embodiment of the application;

[0046] Figure 8It is an embodiment of the application to provide the application method process of the application. DETAILED DESCRIPTION

[0047] In order to better understand the technical scheme of the application, the embodiments of the application will be described in detail below with reference to the drawings.

[0048] It should be clear that the described embodiments are only a part of the embodiments of the application, not all the embodiments. Based on the embodiments in the application, all other embodiments obtained by those skilled in the art without creative labor belong to the scope of protection of the application.

[0049] The terms used in the embodiments of the application are only for the purpose of describing the specific embodiments, and are not intended to limit the application. The singular forms "a", "said" and "the" used in the embodiments of the application and the appended claims are also intended to include the plural forms, unless the context clearly indicates otherwise.

[0050] The application provides a BIM and GIS model application method in a WebGL game engine, the application method comprising the following steps:

[0051] S1: Import the bridge rvt original model file, and delete the elements invisible to the user;

[0052] S2: Export the properties of rvt to the database;

[0053] S3: Export gltf, and perform the same material merging operation on gltf through compression algorithm for compression processing;

[0054] S4: The front end loads the gltf file and materials through threejs;

[0055] S5: Nginx can be configured to compress to reduce transmission time;

[0056] S6, the objects loaded by threejs are associated with the attribute data saved in the database through id after clicking, for display;

[0057] S7: Load threejs on cesium or other maps.

[0058] The target of the bridge rvt original model file import in S1 is Revit 2020. The invisible elements in S1 include small area and large number of triangular faces, and elements that are wrapped by other materials and cannot be operated by the user.

[0059] The database import process in S2 is specifically: directly export the Rvt file to excel and then import it into the database.

[0060] The same material is loaded only once after the same material is combined in S3.

[0061] The front end in S4 includes but is not limited to: web, pc, ios and android.

[0062] The Nginx compression in S5 is specifically: storing the processed file in nginx to reduce transmission amount, and configuring compression.

[0063] The application further provides a BIM and GIS model application system in a WebGL game engine, and the application system comprises:

[0064] The original module imports an optimization module, which is used for importing a bridge rvt original model file and deleting elements invisible to users;

[0065] The attribute output module is used for exporting attributes of the rvt to a database;

[0066] The merging and compression module is used for exporting into gltf, and performing a same material merging operation on the gltf through a compression algorithm for compression processing;

[0067] The front end loading module is used for loading the gltf file and materials through threejs by the front end;

[0068] The configuration compression module is used for configurable compression through Nginx to reduce transmission time;

[0069] The correlation display module is used for correlating, through an id and attribute data saved in the database, objects loaded by Threejs after being clicked, and is used for display;

[0070] The GIS loading module is used for loading threejs on cesium or other maps.

[0071] The application further provides a readable storage medium, which has a computer program stored thereon, and the computer program is executed by a processor to realize the application method.

[0072] The application further provides an electronic device, which comprises a processor, a memory, a communication interface, and one or more programs, the one or more programs are stored in the memory and are configured to be executed by the processor, and the program comprises a program for executing the application method.

[0073] Embodiment 1:

[0074] The embodiment provides a BIM and GIS model application method in a WebGL game engine, which comprises the following steps:

[0075] 1, rvt import BIM model, size is 62868kb, as shown in Figure 3

[0076] 2, the model is composed of multiple layers of models, delete the middle invisible elements, and change the visibility of internal graphics to invisible, and use "manage" -> "clear unused items", the detail level is changed to "medium". As shown in Figures 4-6 , after execution, the remaining 47816kb.

[0077] 3, the model is converted into a BIM three-dimensional model generated by modeling into a gltf format model.

[0078] 4, as shown in Figure 7 , export gltf using rvt plug-in, this process will merge gltf with the same material and compress using Google Draco algorithm, plug-in available: bimangle.

[0079] 5, as shown in Figure 8 , the model is displayed as a lightweight gltf model loaded into the threejs game engine on the web or app.

[0080] The above describes in detail the application method, system and readable storage medium provided by the embodiment of the application, which is a BIM and GIS model in the WebGL game engine. The above description of the embodiments is only used to help understand the method of the application and its core idea; at the same time, for those skilled in the art, according to the idea of the application, the specific implementation and application range will be changed, and the above description should not be understood as limiting the application.

[0081] As some terms are used in the description and claims to refer to certain components. Those skilled in the art should understand that hardware manufacturers may use different names to refer to the same component. The description and claims of this specification do not distinguish components by name, but by the difference in function. As mentioned throughout the specification and claims, "including" and "including" are open terms, which should be interpreted as "including / including but not limited to". "Approximately" means within an acceptable error range, and those skilled in the art can solve the technical problem within a certain error range, basically achieve the technical effect. The subsequent description of the specification is the preferred embodiment of the application, which is for the purpose of illustrating the general principles of the application, and is not intended to limit the scope of the application. The scope of protection of the application is defined by the appended claims.

[0082] ​It should also be noted that the terms "comprising," "including," and any other variation thereof, are intended to cover a non-exclusive inclusion, such that a process, method, article, or apparatus that comprises a list of elements does not include only those elements but can also include other elements not expressly listed or inherent to such process, method, article, or apparatus. An element proceeded by "comprises a... " does not, without more constraints, exclude the existence of additional identical elements in the process, method, article, or apparatus that comprises the recited element.

[0083] It should be understood that the term "and / or" as used herein merely describes associated objects, and can exist in three forms: A and / or B can mean: A alone, both A and B, and B alone. In addition, the character " / " generally represents an "or" relationship between the front and rear associated objects.

[0084] The above description illustrates and describes several preferred embodiments of the present application, but as previously discussed, it is understood that the present application is not limited to the forms disclosed herein, but is to be accorded the broadest scope of the application as set forth in the claims, and that changes can be made in the form without departing from the spirit or scope of the application. Any changes made in the form should not depart from the spirit and scope of the application, and should be within the scope of the claims.

Claims

1. A method for applying BIM and GIS models in a WebGL game engine, characterized in that, The application method comprises the following steps: S1: importing the bridge rvt original model file into Revit 2020, and deleting small-area and large-quantity triangular surfaces and elements that cannot be operated by users due to being wrapped by other materials; S2: exporting the properties of the rvt into an excel file and then importing them into a database; S3: exporting into gltf, performing same-material merging on the gltf, wherein the same material is loaded only once after the same-material merging, and performing compression processing through a Google Draco algorithm; S4: loading the gltf file and materials through threejs on the front end, and using browser-side caching when repeatedly loading the model through a time-sharing loading strategy; S5: storing the processed files in nginx to reduce transmission volume, and configuring compression to reduce transmission time; S6: associating the objects loaded by threejs through id and the saved attribute data in the database for display; S7: loading threejs on a cesium or other map, and realizing first-person immersive experience and adding light and shadow effects based on the BIM model loaded by the game engine.

2. The method of claim 1, wherein, The front end in S4 comprises a web end, a pc, ios and android.

3. A system for applying BIM and GIS models in a WebGL game engine, characterized by, The application system comprises: An original module importing optimization module for importing the bridge rvt original model file into Revit 2020, and deleting small-area and large-quantity triangular surfaces and elements that cannot be operated by users due to being wrapped by other materials; An attribute output module for exporting the properties of the rvt into an excel file and then importing them into a database; A merging and compression module for exporting into gltf, performing same-material merging on the gltf, wherein the same material is loaded only once after the same-material merging, and performing compression processing through a Google Draco algorithm; A front end loading module for loading the gltf file and materials through threejs on the front end, and using browser-side caching when repeatedly loading the model through a time-sharing loading strategy; A configuration compression module for storing the processed files in nginx to reduce transmission volume, and configuring compression to reduce transmission time; An association display module for associating the objects loaded by threejs through id and the saved attribute data in the database for display; A GIS loading module for loading threejs on a cesium or other map, and realizing first-person immersive experience and adding light and shadow effects based on the BIM model loaded by the game engine.

4. A readable storage medium, having stored thereon a computer program, characterized in that, The computer program is executed by a processor to realize the application method of any one of claims 1-2.

5. An electronic device, comprising: The computer program is executed by a processor to realize the application method of any one of claims 1-2. The computer program is executed by a processor to realize the application method of any one of claims 1-2.

Images