Three.js-based 3D scene low-code construction method and scene construction platform

Abstract

The invention relates to the technical field of 3D development, and discloses a Three.js-based 3D scene low-code construction method and scene construction platform, and the method comprises the steps: a client obtains the operation information of a user, and sends the operation information to a server; the server side is used for mapping the operation information into the structured JSON Schema, updating the JSON Schema on the basis of the operation information, and carrying out persistent storage on the JSON Schema; and the server sends the JSON Schema corresponding to the preview request to the client, so that the client performs real-time rendering. According to the method provided by the embodiment of the invention, the graphical operation interface is provided, so that non-professionals can easily construct the 3D scene without mastering complex programming or graphical knowledge, and therefore, the user-friendly degree of the development process is improved, and the 3D scene construction difficulty is reduced.

Description

Technical Field

[0001] The present disclosure relates to the field of 3D development technology, and in particular to a low-code construction method and scene construction platform for 3D scenes based on Three.js. Background Art

[0002] With the rapid development of network technology and the increasing demand of users for high-quality experience, the application scenarios of 3D content in web pages and mobile applications are becoming more and more extensive.

[0003] However, although the relevant technologies provide a visual operation interface in 3D development tools, the 3D development process still relies on complex graphics knowledge and programming skills, which is a high threshold for non-professionals. Therefore, in the 3D development scenario, how to improve the user-friendliness of the development process and reduce the development difficulty has become a problem that needs to be solved. Summary of the invention

[0004] In view of this, the present disclosure provides a low-code 3D scene construction method and scene construction platform based on Three.js to solve the problem of how to improve the user-friendliness of the development process and reduce the difficulty of development in 3D development scenarios.

[0005] On the one hand, the present disclosure provides a low-code construction method for 3D scenes based on Three.js, which is applied to a scene construction platform. The scene construction platform includes: a client and a server. The method includes: a client, obtaining user operation information based on a graphical operation interface, and sending the operation information to a server; wherein the operation information is used to construct a 3D scene; a server, mapping the operation information to a structured JSON Schema, updating the JSON Schema based on the operation information, and persisting the JSON Schema; a server, obtaining a user's preview request from the client, and sending the JSON Schema corresponding to the preview request to the client, so that the client performs real-time rendering based on the JSON Schema.

[0006] On the other hand, the present disclosure further provides a scene construction platform, which includes a client and a server, wherein: the client is used to obtain user operation information based on a graphical operation interface, and send the operation information to the server; wherein the operation information is used to build a 3D scene; the server is used to map the operation information to a structured JSON Schema, update the JSON Schema based on the operation information, and persist the JSON Schema; the server is used to obtain the user's preview request from the client, send the JSON Schema corresponding to the preview request to the client, and enable the client to perform real-time rendering based on the JSON Schema.

[0007] On the other hand, the present disclosure further provides a computer-readable storage medium, on which computer instructions are stored, and the computer instructions are used to enable a computer to implement the above-mentioned low-code construction method of 3D scenes based on Three.js.

[0008] On the other hand, the present disclosure also provides a computer program product, including computer instructions, which are used to enable a computer to execute the above-mentioned low-code construction method of 3D scenes based on Three.js.

[0009] Through the three.js-based 3D scene low-code construction method and scene construction platform of the above-mentioned embodiments of the present invention, by providing a graphical operation interface, non-professionals can easily build 3D scenes without mastering complex programming or graphics knowledge, thereby improving the user-friendliness of the development process and reducing the difficulty of 3D scene construction.

[0010] In addition, mapping user operations into structured JSON Schema not only unifies the storage format of 3D scene data, but also facilitates the persistence and subsequent operations of scene information. BRIEF DESCRIPTION OF THE DRAWINGS

[0011] In order to more clearly illustrate the specific embodiments of the present disclosure or the technical solutions in the related technologies, the drawings required for use in the specific embodiments or the related technical descriptions will be briefly introduced below. Obviously, the drawings described below are some embodiments of the present disclosure. For ordinary technicians in this field, other drawings can be obtained based on these drawings without paying any creative work.

[0012] Figure 1a An exemplary schematic diagram of the architecture of a scene construction platform applied by a 3D scene low-code construction method based on Three.js according to an embodiment of the present disclosure is shown;

[0013] Figure 1b It is a flowchart of a low-code construction method for a 3D scene based on Three.js provided in an embodiment of the present disclosure;

[0014] Figure 2 A schematic diagram of preset switch configuration in an SDN-based multicast network automation testing method according to an embodiment of the present disclosure is shown;

[0015] Figure 3 is a structural diagram of another scene construction platform provided by an embodiment of the present disclosure;

[0016] Figure 4 It is a structural diagram of another scene construction platform provided in an embodiment of the present disclosure. DETAILED DESCRIPTION

[0017] With the rapid development of Internet technology and the continuous improvement of user experience requirements, the importance of 3D content in web pages and mobile applications has become increasingly prominent. For online shopping, virtual reality, augmented reality, architectural visualization and other fields, 3D content has become an important means to enhance user interaction experience and improve visual effects. Compared with traditional 2D interfaces, 3D scenes can more realistically restore the real world and provide a more immersive experience. However, the current development process of 3D content faces many challenges, which restricts its application in a wider range of scenarios.

[0018] Developers need to master basic knowledge such as 3D coordinate system, light and shadow calculation, geometric transformation, material mapping, etc., which constitutes a significant technical barrier for non-professional developers. Existing professional tools are powerful, but it takes a long time to learn and master them. For short-term projects or temporary needs, the cost of using these tools is too high. This requires developers to have high professional capabilities in the traditional 3D scene development process.

[0019] In order to lower the threshold of traditional 3D development, related technical tools provide a visual operation interface to help users develop in a more intuitive way. However, these tools still have the following problems in practical applications:

[0020] 1. Many tools are still oriented towards professional developers, with complex functional designs and overly complicated interfaces, making it difficult for non-professional users to quickly get started.

[0021] 2. The relevant technology lacks online collaboration and data synchronization functions, which is not conducive to multi-person team collaboration or cross-device editing.

[0022] 3. The relevant technology cannot view the rendering effect in real time during the operation process, resulting in low development efficiency and users cannot verify the design results immediately.

[0023] To solve the above problems, various embodiments of the present disclosure provide a low-code construction method for 3D scenes based on Three.js, which is applied to a scene construction platform. The scene construction platform includes: a client and a server. The method includes: a client, obtaining user operation information based on a graphical operation interface, and sending the operation information to the server; wherein the operation information is used to build a 3D scene; the server, mapping the operation information to a structured JSON Schema, updating the JSON Schema based on the operation information, and persisting the JSON Schema; the server, obtaining the user's preview request from the client, sending the JSON Schema corresponding to the preview request to the client, so that the client performs real-time rendering based on the JSON Schema.

[0024] In order to make the purpose, technical solution and advantages of the embodiments of the present disclosure clearer, the technical solution in the embodiments of the present disclosure will be clearly and completely described below in conjunction with the drawings in the embodiments of the present disclosure. Obviously, the described embodiments are part of the embodiments of the present disclosure, rather than all the embodiments. Based on the embodiments in the present disclosure, all other embodiments obtained by those skilled in the art without creative work are within the scope of protection of the present disclosure.

[0025] Please refer to Figure 1a , Figure 1a An exemplary schematic diagram of the architecture of a scene construction platform applied by a 3D scene low-code construction method based on Three.js in an embodiment of the present disclosure is shown. Figure 1a As shown, the scene construction platform may include: a client and a server.

[0026] The scene construction platform can be a comprehensive system that can be responsible for the process management of the entire 3D scene construction, including tasks such as user interaction, scene data processing, rendering and storage. The platform consists of two main parts: the client and the server, which work together to complete various functions from user input to 3D scene rendering.

[0027] The client can be the front-end part of the interaction between the user and the scene construction platform, which usually runs on the user's device. By providing a graphical user interface, it allows users to build, edit and adjust 3D scenes through simple graphical operations. The server can be the back-end part of the scene construction platform, responsible for data storage, processing and rendering. It is connected to the client through the network, receives the operation information sent by the client, and updates the data of the 3D scene based on this information.

[0028] Further references Figure 1b , Figure 1b This is a flowchart of a method for constructing a 3D scene with low code based on Three.js provided by the present disclosure, which is applied to the above Figure 1a The scene construction platform shown in the figure can include the following steps:

[0029] Step S101: The client obtains the user's operation information based on the graphical operation interface and sends the operation information to the server.

[0030] In this embodiment, the operation information is used to construct a 3D scene.

[0031] A graphical user interface (GUI) may refer to an interface for user interaction through graphic elements, and may simplify scene construction during 3D scene creation through intuitive graphic elements and interaction methods.

[0032] The client side, based on the graphical operation interface, may obtain operation information including at least one of the following: dragging, property adjustment, element selection, element addition, and element deletion.

[0033] The client may obtain the user's operation information by monitoring the user's interactive events in the graphical operation interface, such as mouse clicks, drags, and slides.

[0034] After obtaining the user's operation information, the client can format the operation information and convert the operation information into structured data, for example, into JavaScript Object Notation (JSON) format.

[0035] As an example, the operation information converted into the JSON format may include at least one of the following: operation type, object identifier, and attribute change.

[0036] After the client formats the operation information, it may send it to the server in a preset transmission mode. For example, the preset transmission mode may include but is not limited to: HyperText Transfer Protocol (HTTP) and WebSocket communication.

[0037] Step S102: the server maps the operation information into a structured JSON Schema, updates the JSON Schema based on the operation information, and persists the JSON Schema.

[0038] In this embodiment, JSON Schema can be a specification for describing data structure based on JSON format. It defines the format, type, structure, and relationship and constraint rules between JSON data, and can be used to verify and describe JSON data.

[0039] The server receives the operation information from the client, parses the operation information, obtains the user's operation type and the specific data to be updated in the operation information, and maps the operation information to a predefined JSON Schema.

[0040] Specifically, when the operation information represents adding a model, the server adds a new model object to JSONSchema; when the operation information represents updating a model attribute, the server modifies the corresponding attribute of the model in JSONSchema according to the object identifier of the model.

[0041] The server side saves the JSON Schema persistently, which may include: after the JSON Schema is updated, the server side saves the updated JSON Schema to the storage system to ensure data persistence.

[0042] In a possible implementation, after updating and saving the JSON Schema, the server may send an operation result to the client to prompt the client that the operation has been successfully executed.

[0043] Step S103: the server obtains the user's preview request from the client, and sends the JSON Schema corresponding to the preview request to the client, so that the client performs real-time rendering based on the JSON Schema.

[0044] In this embodiment, the content of the preview request may include, but is not limited to: a scene identifier and preview parameters, wherein the scene identifier identifies a specific scene, and the preview parameters are used to determine specific rendering settings.

[0045] The server obtains the user's preview request from the client and parses it. It searches for and loads the corresponding JSON Schema data according to the scene identifier in the parsed result, parses the JSON Schema data, and converts the parsed data into the data format required for Three.js rendering. The data format is sent to the client so that the client uses the rendering engine to render the data.

[0046] As an example, the JSON Schema data may include at least one of the following: model, position, material, geometric shape. The rendering step may include at least one of the following: setting camera position and viewing angle, loading model and material, configuring light source and shadow.

[0047] Furthermore, after generating the rendering result, the client displays the rendering result to the user in a graphical operation interface.

[0048] In the low-code 3D scene construction method and scene construction platform based on Three.js of the above-mentioned embodiment of the present disclosure, by providing a graphical operation interface, non-professionals can easily build 3D scenes without having to master complex programming or graphics knowledge, thereby improving the user-friendliness of the development process and reducing the difficulty of 3D scene construction. In addition, mapping the user's operations to the structured JSON Schema not only unifies the storage format of 3D scene data, but also facilitates the persistence and subsequent operations of scene information.

[0049] In a possible implementation manner of the above embodiment, the graphical operation interface includes at least one of the following: a scene editor, a model library, a material library, and a toolbar.

[0050] In this embodiment, the scene editor can be the core interface for users to interact and edit 3D scenes. Based on the scene editor, users can directly operate objects in the scene, including adding, deleting, moving, rotating, and scaling 3D models.

[0051] The model library can be a resource library for storing and managing 3D models. Based on the model library, users can select preset 3D models and drag and drop them into the scene editor for use. The model library can contain various types of 3D models, such as people, animals, buildings, furniture, plants, etc.

[0052] A material library can be a resource library for managing and applying 3D materials. Based on the resource library, users can select different material styles, such as metal, wood, glass, cloth, etc., and apply different material styles to models in the scene.

[0053] The toolbar may include a series of tool buttons for performing common operations and functions to improve user operation efficiency. For example, tool buttons may include but are not limited to: "New", "Save", "Import", and "Undo".

[0054] In the above graphical operation interface, you can perform the following operations: scene editing, property adjustment, object management, and real-time preview.

[0055] In the Three.js-based 3D scene low-code construction method and scene construction platform of the above-mentioned embodiments of the present invention, a simple and easy-to-use graphical operation interface is used to enable users to build and edit 3D scenes more flexibly and efficiently, thereby improving their operating experience and lowering the operational threshold for 3D scene creation.

[0056] In a possible implementation of the above step S101, the client obtains the user's operation information based on the graphical operation interface and sends the operation information to the server, which is implemented based on the following steps:

[0057] The client obtains the user's scene construction action information based on the scene editor in the graphical operation interface;

[0058] The client obtains the user's scene construction resource information based on the model library, material library and toolbar in the graphical operation interface.

[0059] In this embodiment, the client captures the user's operation actions in the scene editor in real time through the event listener, converts the operation information corresponding to the operation actions into JSON format, and saves it in a temporary state object in preparation for sending it to the server.

[0060] The client captures the operation events of the model in the model library, records the name, type, and preset properties of the selected model, and stores the relevant information in the operation information in JSON format.

[0061] The client captures material operation events in the material library, records the color, type, texture and other information of the selected material, and stores the relevant information in the operation information in JSON format.

[0062] The client captures the selection event of the tool in the toolbar and stores the relevant information in the operation information in JSON format.

[0063] The client integrates and packages the operation information from different sources and sends it to the server.

[0064] In a possible implementation, the operation information sent by the client to the server may also come from other components in the graphical operation interface, which is not specifically limited here.

[0065] In the low-code construction method and scene construction platform of 3D scenes based on Three.js in the above-mentioned embodiments of the present disclosure, users can complete tasks through intuitive interface operations, capture and record each user's operation, ensure the simplicity and efficiency of the operation process, and do not need to frequently switch contexts or enter complex parameters, reduce the user's technical requirements, and enable non-professional users to participate in 3D scene creation. Allowing the client to capture user operations according to different components in the graphical interface allows the system to be flexibly expanded to adapt to different business needs and functional modules.

[0066] In a possible implementation of step S102, the server maps the operation information to a structured JSON Schema, updates the JSON Schema based on the operation information, and persists the JSON Schema, including:

[0067] The server, when getting an operation information from the client, determines the part corresponding to the operation information in the JSON Schema, and updates the part based on the operation information;

[0068] The server side stores the JSON Schema in the backend database as a preset file, or uploads the JSON Schema to a cloud server.

[0069] In this embodiment, the server module obtains operation information including operation type and object identifier from the client, loads the existing JSON Schema, locates the corresponding field in the JSON Schema based on the operation type and object identifier, and updates it.

[0070] As an example, if the operation information describes "adding a model", the server locates the "model" part in the Schema and updates the model list or adds a new model object.

[0071] Furthermore, the server stores the updated JSON Schema in the form of .json in the backend database or the cloud server.

[0072] Here, uploading the JSON Schema to the cloud server allows cross-platform and cross-region access or sharing, while ensuring data security, redundant backup, and high availability.

[0073] In the Three.js-based 3D scene low-code construction method and scene construction platform of the above-mentioned embodiment of the present disclosure, each element in the 3D scene is stored in a unified structure through JSON Schema, ensuring the consistency of the data, so that each scene element and operation follows the same format, which is easy to manage and update. Through the unified JSON format, the server can efficiently store and manage 3D scene data. In the back-end database or cloud storage, the JSON file has good scalability and query performance, especially when the amount of scene data is large, it can be quickly retrieved and modified.

[0074] In a possible implementation of the above embodiment, the method further includes:

[0075] The server obtains the user's reload instruction from the client, obtains the corresponding historical JSON Schema based on the reload instruction, sends the historical JSON Schema to the client, and enables the client to re-render based on the historical JSON Schema.

[0076] As an example, the server may obtain a reload instruction from the client including an object identifier of the historical JSON Schema, and the server may match the corresponding historical JSON Schema in the backend database or cloud server based on the object identifier.

[0077] In a possible implementation, the server may support multi-version management, and locate and obtain accurate historical JSON Schema versions based on a database version control system.

[0078] Furthermore, after the server obtains the historical JSON Schema, it sends it to the client, so that the client uses a rendering tool such as Three.js to re-render the scene based on the data in the historical JSON Schema.

[0079] In the three.js-based 3D scene low-code construction method and scene construction platform of the above-mentioned embodiment of the present disclosure, it is supported to load the specified version of JSON Schema according to instructions, which can accurately restore the historical state of the 3D scene and avoid data loss caused by misoperation. By managing and querying the historical JSON Schema, it is ensured that the data after each modification is traceable, which improves the controllability and reliability of the data. Users can quickly return to the historical version, modify or adjust the scene, and avoid the repetitive work caused by building the scene from scratch.

[0080] In a specific embodiment, Figure 2 A schematic diagram of a preset switch configuration in an SDN-based multicast network automation test method according to an embodiment of the present disclosure is shown, wherein:

[0081] The client obtains the user's operation information based on the 3D element selection area (i.e., model library, material library, and toolbar) in the graphical operation interface, and renders the operation information in real time in the scene rendering area (i.e., scene editor). The server generates a JSON Schema based on each user's operation information and updates it in real time, and transmits the generated JSON Schema to the backend (i.e., backend database or cloud storage). On the scene rendering page, the user can request the backend JSON Schema by calling the interface. The server returns the JSON Schema specified in the backend to the client, allowing the client to re-render the scene based on the Schema.

[0082] In one embodiment, a scene construction platform 30 is provided, which corresponds one-to-one to the 3D scene low-code construction method based on Three.js in the above embodiment. Figure 3 As shown, the scene construction platform 30 includes a client 301 and a server 302, wherein each functional module is described in detail as follows:

[0083] The client 301 is used to obtain the user's operation information based on the graphical operation interface and send the operation information to the server 302; wherein the operation information is used to construct the 3D scene;

[0084] The server 302 is used to map the operation information into a structured JSON Schema, update the JSON Schema based on the operation information, and persist the JSON Schema;

[0085] The server 302 is used to obtain the user's preview request from the client 301, and send the JSON Schema corresponding to the preview request to the client 301, so that the client 301 performs real-time rendering based on the JSON Schema.

[0086] In one embodiment, the graphical operation interface includes at least one of the following: a scene editor, a model library, a material library, and a toolbar.

[0087] In one embodiment, the client 301 is used to obtain the scene construction action information of the user based on the scene editor in the graphical operation interface;

[0088] The client 301 is used to obtain the scene construction resource information of the user based on the model library, material library and toolbar in the graphical operation interface.

[0089] In one embodiment, the server 302 is used to, when obtaining an operation information from the client, determine the portion corresponding to the operation information in the JSONSchema, and update the portion based on the operation information;

[0090] The server 302 is used to store the JSON Schema in a backend database in the form of a preset file, or upload the JSON Schema to a cloud server.

[0091] In one embodiment, the server 302 is further used to obtain a user's reload instruction from the client 301, obtain a corresponding historical JSON Schema based on the reload instruction, and send the historical JSON Schema to the client 301, so that the client 301 re-renders based on the historical JSON Schema.

[0092] It should be noted that: the scene construction platform provided in the above embodiment only uses the division of the above program modules as an example to implement the corresponding 3D scene low-code construction method based on Three.js. In actual applications, the above processing can be assigned to different program modules as needed, that is, the internal structure of the above system can be divided into different program modules to complete all or part of the above-described processing. Figure 1b The embodiments of the method shown belong to the same concept, and the specific implementation process is detailed in the method embodiments, which will not be repeated here.

[0093] The present disclosure also provides a computer device having the above Figure 3 The scene building platform shown.

[0094] See also Figure 4 , Figure 4 is a structural diagram of another scenario construction platform provided by an embodiment of the present disclosure, such as Figure 4As shown, the computer device includes: one or more processors 10, a memory 20, and interfaces for connecting various components, including high-speed interfaces and low-speed interfaces. Various components are connected to each other using different buses for communication, and can be installed on a common mainboard or installed in other ways as needed. The processor can process the instructions executed in the computer device, including instructions stored in or on the memory to display the graphical information of the GUI on an external input / output device (such as, a display device coupled to the interface). In some optional embodiments, if necessary, multiple processors and / or multiple buses can be used together with multiple memories and multiple memories. Similarly, multiple computer devices can be connected, and each device provides some necessary operations (for example, as a server array, a group of blade servers, or a multi-processor system). Figure 4 A processor 10 is taken as an example.

[0095] The processor 10 may be a central processing unit, a network processor or a combination thereof. The processor 10 may further include a hardware chip. The hardware chip may be a dedicated integrated circuit, a programmable logic device or a combination thereof. The programmable logic device may be a complex programmable logic device, a field programmable gate array, a general purpose array logic or any combination thereof.

[0096] The memory 20 stores instructions executable by at least one processor 10, so that at least one processor 10 executes the method shown in the above embodiment.

[0097] The memory 20 may include a program storage area and a data storage area, wherein the program storage area may store an operating system, an application required for at least one function; the data storage area may store data created according to the use of the computer device, etc. In addition, the memory 20 may include a high-speed random access memory, and may also include a non-transient memory, such as at least one disk storage device, a flash memory device, or other non-transient solid-state storage device. In some optional embodiments, the memory 20 may optionally include a memory remotely arranged relative to the processor 10, and these remote memories may be connected to the computer device via a network. Examples of the above-mentioned network include, but are not limited to, the Internet, an intranet, a local area network, a mobile communication network, and combinations thereof.

[0098] The memory 20 may include a volatile memory, such as a random access memory; the memory may also include a non-volatile memory, such as a flash memory, a hard disk or a solid state drive; the memory 20 may also include a combination of the above types of memory.

[0099] The computer device also includes an input device 30 and an output device 40. The processor 10, the memory 20, the input device 30 and the output device 40 may be connected via a bus or other means. Figure 4 The example of connecting through bus is taken in the following.

[0100] The input device 30 can receive input digital or character information, and generate key signal input related to the user settings and function control of the computer device, such as a touch screen, a keypad, a mouse, a track pad, a touch pad, an indicator bar, one or more mouse buttons, a trackball, a joystick, etc. The output device 40 may include a display device, an auxiliary lighting device (e.g., an LED) and a tactile feedback device (e.g., a vibration motor), etc. The above-mentioned display device includes but is not limited to a liquid crystal display, a light emitting diode, a display and a plasma display. In some optional embodiments, the display device can be a touch screen.

[0101] The computer device further comprises a communication interface 30 for the computer device to communicate with other devices or a communication network.

[0102] The embodiments of the present disclosure also provide a computer-readable storage medium. The above-mentioned method according to the embodiments of the present disclosure can be implemented in hardware, firmware, or can be implemented as a computer code that can be recorded in a storage medium, or can be implemented as a computer code that is originally stored in a remote storage medium or a non-temporary machine-readable storage medium and will be stored in a local storage medium and downloaded through a network, so that the method described herein can be stored in such software processing on a storage medium using a general-purpose computer, a dedicated processor, or programmable or dedicated hardware. Among them, the storage medium can be a magnetic disk, an optical disk, a read-only storage memory, a random access memory, a flash memory, a hard disk or a solid-state drive, etc.; further, the storage medium can also include a combination of the above-mentioned types of memory. It can be understood that a computer, a processor, a microprocessor controller, or programmable hardware includes a storage component that can store or receive software or computer code. When the software or computer code is accessed and executed by a computer, a processor, or hardware, the method shown in the above embodiment is implemented.

[0103] A part of the present disclosure may be applied as a computer program product, such as a computer program instruction, which, when executed by a computer, can call or provide the method and / or technical solution according to the present disclosure through the operation of the computer. Those skilled in the art should understand that the existence of computer program instructions in computer-readable media includes, but is not limited to, source files, executable files, installation package files, etc., and accordingly, the way in which computer program instructions are executed by a computer includes, but is not limited to: the computer directly executes the instruction, or the computer compiles the instruction and then executes the corresponding compiled program, or the computer reads and executes the instruction, or the computer reads and installs the instruction and then executes the corresponding installed program. Here, the computer-readable medium can be any available computer-readable storage medium or communication medium accessible to the computer.

[0104] Although the embodiments of the present disclosure have been described in conjunction with the accompanying drawings, those skilled in the art may make various modifications and variations without departing from the spirit and scope of the present disclosure, and such modifications and variations are all within the scope defined by the appended claims.

Claims

1. A low-code construction method for 3D scenes based on Three.js, characterized in that: Applied to a scene construction platform, the scene construction platform includes: a client and a server, the method includes: The client obtains user operation information based on a graphical operation interface and sends the operation information to the server; wherein the operation information is used to construct a 3D scene; The server maps the operation information into a structured JSON Schema, updates the JSON Schema based on the operation information, and persists the JSON Schema; The server obtains a preview request from the client, and sends a JSON Schema corresponding to the preview request to the client, so that the client performs real-time rendering based on the JSON Schema.

2. The method according to claim 1, characterized in that The graphical operation interface includes at least one of the following: a scene editor, a model library, a material library, and a tool bar.

3. The method according to claim 2, characterized in that The client obtains the user's operation information based on the graphical operation interface and sends the operation information to the server, based on the following steps: The client obtains the scene construction action information of the user based on the scene editor in the graphical operation interface; The client obtains the scene construction resource information of the user based on the model library, material library and toolbar in the graphical operation interface.

4. The method according to claim 1, characterized in that The server maps the operation information into a structured JSON Schema, updates the JSON Schema based on the operation information, and persists the JSON Schema, including: The server, when obtaining an operation information from the client, determines a portion corresponding to the operation information in the JSON Schema, and updates the portion based on the operation information; The server stores the JSON Schema in a backend database in the form of a preset file, or uploads the JSON Schema to a cloud server.

5. The method according to claim 4, characterized in that The method further comprises: The server obtains a reload instruction from the user from the client, obtains a corresponding historical JSON Schema based on the reload instruction, sends the historical JSON Schema to the client, and enables the client to re-render based on the historical JSON Schema.

6. A scene construction platform, characterized in that: The scenario construction platform includes a client and a server, wherein: The client is used to obtain user operation information based on a graphical operation interface and send the operation information to the server; wherein the operation information is used to construct a 3D scene; The server is used to map the operation information into a structured JSON Schema, update the JSON Schema based on the operation information, and persist the JSON Schema; The server is used to obtain a preview request from the client, send a JSON Schema corresponding to the preview request to the client, and enable the client to perform real-time rendering based on the JSON Schema.

7. A computer-readable storage medium, characterized in that: The computer-readable storage medium stores computer instructions, and the computer instructions are used to enable a computer to execute the low-code construction method for 3D scenes based on Three.js described in any one of claims 1-5.

8. A computer program product, characterized in that It includes computer instructions, which are used to enable a computer to execute the low-code construction method of 3D scenes based on Three.js as described in any one of claims 1-5.

Images