3D camera control method and related device

Abstract

The invention discloses a 3D camera control method and a related device, and relates to the technical field of computer graphics, in response to an interactive operation on a 3D camera visualization indicator assembly, 3D camera rotation data corresponding to the interactive operation is determined, the indicator assembly is a 3D visualization cube, each cube surface represents a standard visual angle direction, and the 3D camera rotation data corresponds to the interactive operation. According to the method, a display form of a 3D visual cube is adopted, a visual visual effect is provided for a user, the rotation data of the 3D camera are sent to the 3D engine through the preset data interface under the message callback mechanism, the 3D engine determines the pose adjustment amount of the 3D camera based on the rotation data of the 3D camera, and the pose adjustment amount of the 3D camera is adjusted. And adjusting the 3D camera to the target angle. According to the method and the device, abundant space positioning points are provided in a visual 3D visual cube form, and a user can operate the 3D camera to reach the target angle only by clicking on the 3D visual cube, so that the interaction efficiency of camera control is greatly improved.

Description

Technical Field

[0001] This application relates to the field of computer graphics technology, and in particular to a 3D camera control method and related apparatus. Background Technology

[0002] In fields such as 3D graphics editing, game development, and virtual reality construction, 3D cameras are a core interactive tool for users to navigate, observe, and compose within a scene. The intuitiveness and efficiency of their orientation control directly affect the smoothness of the workflow for content creation, scene debugging, and spatial understanding.

[0003] Currently, mainstream 3D content creation engines all provide camera control functionality within the scene view. However, these traditional methods have significant limitations in terms of orientation feedback. Taking the Unity engine as an example, the camera orientation indicator provided in its scene view typically relies on the abstract X, Y, and Z axes arrows in a Cartesian coordinate system to represent the camera's rotational orientation. This representation essentially simplifies rotational changes in three-dimensional space to an axis projection on a two-dimensional plane, failing to provide a three-dimensional visual feedback that aligns with human spatial intuition regarding the actual direction the camera lens is pointing. Operators need to interpret the abstract axis symbols, perform secondary transformations and visualizations in their minds, before indirectly inferring the camera's actual pitch, yaw, and roll attitude in the current three-dimensional world. This process increases the user's cognitive load, requiring a considerable amount of learning and adaptation time to master camera control.

[0004] In summary, the existing methods for indicating the orientation of 3D cameras are not intuitive enough, resulting in low efficiency in camera control interaction. Summary of the Invention

[0005] In view of the above problems, this application provides a 3D camera control method and related apparatus to improve the efficiency of camera operation and interaction. The specific solution is as follows:

[0006] This application provides a 3D camera control method, applied to a Web component in a 3D camera control system, wherein the 3D camera control system further includes a 3D engine, and the method includes:

[0007] In response to the user's interactive operation on the pre-built 3D camera visualization indicator component, the first 3D camera rotation data corresponding to the interactive operation is determined; the 3D camera visualization indicator component is a 3D visualization cube, each cube face in the 3D visualization cube represents a standard viewing direction, and each vertex in the 3D visualization cube represents a preset angle viewing direction.

[0008] The first 3D camera rotation data is sent to the 3D engine using the preset data interface under the message callback mechanism. The 3D engine determines the 3D camera pose adjustment amount based on the first 3D camera rotation data and adjusts the 3D camera to the target angle based on the 3D camera pose adjustment amount.

[0009] One possible implementation also includes:

[0010] The system receives second 3D camera rotation data sent by the 3D engine. This second 3D camera rotation data is the data that the 3D engine sends to the Web component in response to the adjustment operation of the 3D camera. The Web component then determines the pose adjustment amount of the 3D camera visualization indicator component in the Web component based on the second 3D camera rotation data, and adjusts the 3D camera visualization indicator component to the target angle based on the pose adjustment amount.

[0011] In one possible implementation, the Web component determines the pose adjustment of the 3D camera visualization indicator component within the Web component based on the rotation data of the second 3D camera, including:

[0012] The Web component converts the rotation angle data in the second 3D camera rotation data into position information in the preset first coordinate system according to the preset transformation mapping relationship, and determines the pose adjustment amount of the 3D camera visualization indicator component based on the position information.

[0013] In one possible implementation, the construction process of the 3D camera visualization indicator component includes:

[0014] Build a semi-transparent 3D visualization cube in React components;

[0015] Each face of the semi-transparent 3D visualization cube is set as an interactive face representing the standard viewing direction;

[0016] Set an interactive element of a preset shape at each vertex of a semi-transparent 3D visualization cube, and set each interactive element as an interactive point representing a preset rotation angle.

[0017] In one possible implementation, in response to a user's interaction with a pre-built 3D camera visualization indicator component, first 3D camera rotation data corresponding to the interaction is determined, including:

[0018] Determine the type of interaction event corresponding to the interaction operation. Interaction event types include face interaction events and vertex interaction events.

[0019] When the interaction event type is a surface interaction event, determine the first position information of the first interaction point corresponding to the surface interaction event in the preset first coordinate system, and determine the first rotation angle data based on the first position information. The first rotation angle data is the first 3D camera rotation data.

[0020] When the interaction event type is a vertex interaction event, the second position information of the second interaction point corresponding to the vertex interaction event in the preset first coordinate system is determined, and the second rotation angle data is determined based on the second position information. The second rotation angle data is the first 3D camera rotation data.

[0021] One possible implementation also includes:

[0022] The 3D camera visualization indicator component supports operation in at least edit mode, preview mode, and run mode;

[0023] When the 3D camera visualization indicator component is running in edit mode, it is located in the lower right corner of the scene editing page.

[0024] A second aspect of this application provides a computer storage medium for use as a Web component in a 3D camera control system. The storage medium carries one or more computer programs that, when executed by an electronic device, enable the electronic device to implement the 3D camera control method described in the first aspect or any implementation thereof.

[0025] A third aspect of this application provides a 3D camera control device, a Web component applied in a 3D camera control system, the device comprising:

[0026] The determining unit is used to determine the first 3D camera rotation data corresponding to the interaction operation in response to the user's interactive operation on the pre-built 3D camera visualization indicator component; the 3D camera visualization indicator component is a 3D visualization cube, each cube face in the 3D visualization cube represents a standard viewing direction, and each vertex in the 3D visualization cube represents a preset angle viewing direction.

[0027] The sending unit is used to send the rotation data of the first 3D camera to the 3D engine using a preset data interface under the message callback mechanism. The 3D engine determines the pose adjustment amount of the 3D camera based on the rotation data of the first 3D camera, and adjusts the 3D camera to the target angle based on the pose adjustment amount.

[0028] A fourth aspect of this application provides a 3D camera control device, a Web component applied in a 3D camera control system, comprising at least one processor and a memory connected to the processor, wherein:

[0029] Memory is used to store computer programs;

[0030] The processor is used to execute computer programs to enable the 3D camera control device to implement the 3D camera control method of the first aspect or any implementation thereof.

[0031] The fifth aspect of this application provides a computer program product including computer-readable instructions that, when executed on an electronic device, cause the electronic device to implement the 3D camera control method of the first aspect or any implementation thereof.

[0032] A sixth aspect of this application provides a 3D camera control method applied to a 3D engine in a 3D camera control system, wherein the 3D camera control system further includes a Web component, and the method includes:

[0033] The first 3D camera rotation data is received from the Web component. The first 3D camera rotation data is determined by the Web component in response to the user's interactive operation on the pre-built 3D camera visualization indicator component. The 3D camera visualization indicator component is a 3D visualization cube. Each face of the 3D visualization cube represents a standard viewing direction, and each vertex of the 3D visualization cube represents a preset angle viewing direction.

[0034] The 3D camera pose adjustment amount is determined based on the rotation data of the first 3D camera, and the 3D camera is adjusted to the target angle based on the 3D camera pose adjustment amount.

[0035] One possible implementation also includes:

[0036] The 3D engine converts the rotation angle data in the first 3D camera rotation data into position information in a preset second coordinate system based on a preset transformation mapping relationship, and determines the 3D camera pose adjustment amount based on the position information.

[0037] The seventh aspect of this application provides a computer storage medium for a 3D engine in a 3D camera control system. The storage medium carries one or more computer programs, which, when executed by an electronic device, enable the electronic device to implement the 3D camera control method described in the first aspect or any implementation thereof.

[0038] An eighth aspect of this application provides a 3D camera control device for use in a 3D engine within a 3D camera control system, the device comprising:

[0039] The receiving unit is used to receive the first 3D camera rotation data sent by the Web component. The first 3D camera rotation data is determined by the Web component in response to the user's interactive operation on the pre-built 3D camera visualization indicator component. The 3D camera visualization indicator component is a 3D visualization cube. Each face of the 3D visualization cube represents a standard viewing direction, and each vertex of the 3D visualization cube represents a preset angle viewing direction.

[0040] The adjustment unit is used to determine the 3D camera pose adjustment amount based on the first 3D camera rotation data, and adjust the 3D camera to the target angle based on the 3D camera pose adjustment amount.

[0041] The ninth aspect of this application provides a 3D camera control device, a 3D engine applied in a 3D camera control system, including at least one processor and a memory connected to the processor, wherein:

[0042] Memory is used to store computer programs;

[0043] The processor is used to execute computer programs to enable the 3D camera control device to implement the 3D camera control method of the first aspect or any implementation thereof.

[0044] The tenth aspect of this application provides a computer program product, applied to a 3D engine in a 3D camera control system, including computer-readable instructions. When the computer-readable instructions are executed on an electronic device, the electronic device causes the electronic device to implement the 3D camera control method of the first aspect or any implementation thereof.

[0045] By employing the above technical solution, the 3D camera control method and related apparatus provided in this application, in which the Web component of the 3D camera control system responds to user interaction with its included 3D camera visualization indicator component, determines the first 3D camera rotation data corresponding to the interaction, and the 3D camera visualization indicator component is a 3D visualized cube, where each cube face represents a standard viewing direction and each vertex represents a preset angle viewing angle. This application uses a 3D visualized cube display format to provide users with an intuitive visualization effect, as well as rich viewing directions and angle viewing angles. Then, using a preset data interface under the message callback mechanism, the 3D camera rotation data is sent to the 3D engine, which determines the 3D camera pose adjustment amount based on the 3D camera rotation data and adjusts the 3D camera to the target angle. In the above process, this application provides rich spatial positioning points in the form of an intuitive 3D visualized cube. Users only need to click on the 3D visualized cube according to their operational intention to manipulate the 3D camera to reach the target angle, greatly improving the interactive efficiency of camera control. Attached Figure Description

[0046] The above and other features, advantages, and aspects of the embodiments of this disclosure will become more apparent from the accompanying drawings and the following detailed description. Throughout the drawings, the same or similar reference numerals denote the same or similar elements. It should be understood that the drawings are schematic, and the originals and elements are not necessarily drawn to scale.

[0047] Figure 1 A flowchart illustrating a 3D camera control method for a Web component applied in a 3D camera control system, as provided in this application;

[0048] Figure 2 Example diagram of the 3D camera visualization indicator component provided in this application;

[0049] Figure 3 Another schematic flowchart of the 3D camera control method for a Web component applied in a 3D camera control system provided in this application;

[0050] Figure 4 This application provides a schematic diagram of the structure of a 3D camera control device for a Web component applied in a 3D camera control system, as shown in the embodiments of this application.

[0051] Figure 5 A flowchart illustrating a 3D camera control method for a 3D engine in a 3D camera control system provided in this application;

[0052] Figure 6 A schematic diagram of the structure of a 3D camera control device applied to a 3D engine in a 3D camera control system, provided in an embodiment of this application;

[0053] Figure 7 A schematic diagram illustrating the interaction process between the Web component and the 3D engine in the 3D camera control system provided in this application. Detailed Implementation

[0054] The embodiments of this application are described below with reference to the accompanying drawings. The terminology used in the implementation section of this application is for explaining specific embodiments only and is not intended to limit the scope of this application.

[0055] The embodiments of this application will now be described with reference to the accompanying drawings. Those skilled in the art will recognize that, with technological advancements and the emergence of new scenarios, the technical solutions provided in the embodiments of this application are equally applicable to similar technical problems.

[0056] The terms "first," "second," etc., used in the specification, claims, and accompanying drawings of this application are used to distinguish similar objects and are not necessarily used to describe a specific order or sequence. It should be understood that such terms are interchangeable where appropriate; this is merely a way of distinguishing objects with the same attributes in the embodiments of this application. Furthermore, the terms "comprising" and "having," and any variations thereof, are intended to cover non-exclusive inclusion, so that a process, method, system, product, or apparatus that comprises a series of elements is not necessarily limited to those elements, but may include other elements not explicitly listed or inherent to those processes, methods, products, or apparatuses.

[0057] In 3D scene editing, intuitive and efficient camera control is crucial for improving creative efficiency. Currently, mainstream 3D engines, such as Unity, rely mainly on axis indicators in the scene view for camera orientation control. These indicators typically represent rotation using only abstract X, Y, and Z axis symbols, lacking intuitive visual feedback that aligns with spatial intuition. Users need to mentally convert abstract symbols into actual perspectives, resulting in high learning costs and a high risk of misjudgment.

[0058] Furthermore, the functions of existing 3D camera control methods are relatively limited. For example, the quick viewpoint alignment function usually only supports six standard viewpoints aligned with the positive and negative directions of the coordinate axes, and cannot directly and quickly switch to the commonly used viewpoint. In order to switch to the commonly used viewpoint, users have to manually rotate and adjust it multiple times.

[0059] In summary, existing technologies for 3D camera viewpoint indication lack intuitiveness and flexibility in rapid positioning, resulting in cumbersome user operation steps, low efficiency in orientation judgment, and overall low interaction efficiency.

[0060] To address the aforementioned problems, this application provides a 3D camera control method and related apparatus.

[0061] Optional, see Figure 1 This application provides a flowchart illustrating a 3D camera control method for a Web component used in a 3D camera control system.

[0062] It should be noted that the specific embodiments of this application are applied to the Web component in a 3D camera control system, which mainly includes two independent components: the Web component and the 3D engine. Specifically, the Web component can be an independent component running on the browser's main thread; the 3D engine can be the Unity engine, specifically running in the 3D engine subsystem within the WebAssembly sandbox.

[0063] In a physically independent 3D camera control system, these two components primarily communicate through a pre-defined data interface.

[0064] like Figure 1 As shown, the 3D camera control method includes the following steps:

[0065] Step 101: In response to the user's interactive operation on the pre-built 3D camera visualization indicator component, determine the first 3D camera rotation data corresponding to the interactive operation; the 3D camera visualization indicator component is a 3D visualization cube, each cube face in the 3D visualization cube represents a standard viewing direction, and each vertex in the 3D visualization cube represents a preset angle viewing direction.

[0066] It should be noted that the Web component includes a 3D camera visualization indicator component, which is a 3D visualization cube, specifically a semi-transparent 3D visualization cube. Each face of the cube represents a standard viewing direction, and each vertex of the cube represents a preset angle viewing direction.

[0067] Specifically, the 3D camera visualization indicator component visually displays the 3D camera's position and orientation in three-dimensional space in the form of a 3D cube on the web page. Each face of the 3D cube represents a standard viewing direction, including front, back, left, right, up, and down. The eight vertices of the 3D cube represent eight preset viewing angles, specifically 45-degree viewing angles.

[0068] In summary, the 3D camera visualization indicator component provided in this application embodiment has a visualization display function. Furthermore, compared to the existing Unity engine's built-in indicator which only supports six standard direction switching, the 3D camera visualization indicator provided in this application embodiment also supports rapid adjustment at a 45-degree angle. For example, in isometric side views, it is often necessary to adjust the 3D camera to a 45-degree angle. That is, the 3D camera visualization indicator component provided in this application embodiment also has the function of quickly adjusting the camera angle, supporting one-click switching to commonly used perspectives, such as front view, top view, and side view, etc. Specifically, it can switch to 14 preset perspectives with one click: 6 standard perspectives plus 8 45-degree perspectives, which can greatly improve editing efficiency.

[0069] The creation process for the 3D camera visualization indicator component can be as follows:

[0070] 1> Build a semi-transparent 3D visualization cube in React components.

[0071] Specifically, CSS 3D (Cascading Style Sheets 3D) transformation technology can be used to construct 3D cubes in web pages. Visualizing 3D cubes based on CSS 3D transformation technology is achieved without relying on a 3D engine or WebGL, resulting in lightweight performance and easy integration. Furthermore, CSS 3D transformation technology is natively supported by browsers, requiring no additional libraries and incurring minimal performance overhead. The application of this technology achieves lightweight 3D effects, solving the problem of difficult web front-end integration.

[0072] 2> Set each face of the semi-transparent 3D visualization cube as an interactive face in the standard viewing direction, set an interactive element of a preset shape on each vertex of the semi-transparent 3D visualization cube, and set each interactive element as an interactive point representing a preset rotation angle.

[0073] Specifically, the semi-transparent 3D visualization cube has six clickable faces, corresponding to six standard viewing angles: front, back, left, right, top, and bottom. Each vertex has eight clickable vertices, corresponding to eight 45-degree viewing angles. The interactive elements on the vertices can be flat discs. This shape doesn't obscure the cube, resulting in greater visual clarity. The flat discs form an angle with the cube's faces, enhancing 3D spatial perception. As the element rotates, it becomes an ellipse or circle, providing better visual feedback. Furthermore, the flat design makes it easier to recognize and click. Of course, these interactive elements can also be designed in other shapes that facilitate intuitive presentation.

[0074] By clicking on the interactive surfaces or elements mentioned above, the corresponding camera rotation angle can be quickly calculated and set. Specifically, the X-axis can be set to control the vertical rotation of the semi-transparent 3D visualization cube, the Y-axis to control its horizontal rotation, and the Z-axis to control its front-back position. These three axes can be combined to achieve spatial positioning of the 6 faces and 8 vertices.

[0075] For example, the component code layer defines elements and event handling in the React component, while the style layer uses CSS3D transformation technology for positioning.

[0076] For example, in a React component, initialization is performed, setting the initial rotation angles of the 3D visualization cube and coordinate axes, applying CSS 3D transformation technology, and rendering the 3D visualization cube and coordinate axes. The rendering process can be as follows:

[0077] Create 6 div elements as the 6 faces of the 3D visualization cube, and set different background colors and directional text for each face. Use CSS 3D transformation technology to position the 6 faces to their respective positions on the cube. Create 8 div elements as the 8 vertices of the 3D visualization cube, and use CSS 3D transformation technology to position the 8 vertices to the 8 corners of the cube. Apply the rotation transformation of the parent container to make the entire 3D visualization cube rotate with the camera.

[0078] Furthermore, the 3D camera visualization indicator component provided in this application embodiment supports operation in at least editing mode, preview mode, and running mode.

[0079] Taking edit mode as an example, the 3D camera visualization indicator component can be run in the lower right corner of the scene editing page.

[0080] In summary, the 3D camera visualization indicator component provided in this application embodiment can be used across modes and is not limited by the running state of the 3D engine.

[0081] For example, see Figure 2 Example diagram of the 3D camera visualization indicator component provided in this application.

[0082] like Figure 2 As shown, the 3D camera visualization indicator component is a semi-transparent 3D visualization cube. Each face of the cube is labeled with directional text: front, back, left, right, up, and down, and each face corresponds to a standard viewing angle. Flat, disc-shaped interactive elements are placed at the vertices of the cube, and each vertex corresponds to a 45-degree viewing angle. Clicking a vertex calculates the corresponding rotation angle, for example, X=-45°, Y=45°, Z=0°. Therefore, users can quickly switch between 45-degree viewing angles by clicking the semi-transparent 3D visualization cube, solving the problem of existing technologies not supporting 45-degree angle adjustment.

[0083] Compared to abstract axes, the semi-transparent 3D visualization cube provided in the specific embodiments of this application is more intuitive, allowing users to understand the camera's orientation at a glance.

[0084] Users will interact with the 3D camera visualization indicator component. These interactions correspond to different event types, primarily two: face interaction events and point interaction events. Specific interaction actions include clicking on a face, clicking on a vertex, mouse dragging, keyboard input, and so on.

[0085] First, it determines the specific type of user interaction event.

[0086] Optionally, when the user's interaction operation is detected as a surface interaction event, the first position information of the first interaction point corresponding to the surface interaction event in the preset first coordinate system is determined, and the first rotation angle data is determined based on the first position information. The first rotation angle data is the first 3D camera rotation data.

[0087] Optionally, when the user's interaction operation is detected as a vertex interaction event, the second position information of the second interaction point corresponding to the vertex interaction event in the preset first coordinate system is determined, and the second rotation angle data is determined based on the second position information. The second rotation angle data is the first 3D camera rotation data.

[0088] Specifically, the first preset coordinate system can be the CSS 3D coordinate system.

[0089] For example, when a user clicks on a face or vertex of the 3D camera visualization indicator component, the rotation angle in the corresponding standard view is calculated based on the clicked face. For example, front view = {X:0, Y:0, Z:0}, top view = {X:-90, Y:0, Z:0}. Then, the internal state of the 3D camera visualization indicator component is updated, triggering a CSS animation to transition to the new angle. Finally, the new angle is passed to the external 3D engine via the onChange callback.

[0090] When a user drags the 3D camera visualization indicator component, the system listens for mouse press events, records the initial mouse position, listens for mouse movement events, calculates the mouse movement offset (deltaX, deltaY), and calculates the rotation angle increment based on the offset: X-axis rotation = -deltaY × sensitivity, Y-axis rotation = deltaX × sensitivity. Then, the internal state of the 3D camera visualization indicator component is updated in real time to achieve the drag-and-rotate effect. Finally, the final angle is passed to the external 3D engine via the onChange callback.

[0091] When a keyboard interaction event is detected with the 3D camera visualization indicator component, the system listens for keyboard presses, identifies the arrow keys and WASD keys, and adjusts the rotation angle of the corresponding axis in fixed steps based on the key press. Then, the internal state of the 3D camera visualization indicator component is updated in real time. When the key is released, the angle is passed to the external 3D engine via the onChange callback.

[0092] In summary, the 3D camera visualization indicator component provided in this application supports multiple interaction methods, such as clicking faces, clicking vertices, mouse dragging, and keyboard control, which can meet the operating habits of different users. This 3D camera visualization indicator component has interactive control functionality.

[0093] Step 102: Use the preset data interface under the message callback mechanism to send the rotation data of the first 3D camera to the 3D engine. The 3D engine determines the 3D camera pose adjustment amount based on the first 3D camera rotation data, and adjusts the 3D camera to the target angle based on the 3D camera pose adjustment amount.

[0094] It's important to note that the Web component and the 3D engine in the 3D camera control system communicate via a message callback mechanism. This mechanism can be implemented using callback functions. Specifically, a pre-defined data interface is established between the Web component and the 3D engine. Through this interface, the two components can communicate 3D camera rotation data according to a pre-agreed input / output method and format. For example, the function or parameter convention for passing the camera rotation angle {X, Y, Z} to Unity will ensure that the other module can correctly receive and process the data as long as it is passed in according to the pre-agreed data format.

[0095] Specifically, a message callback is a mechanism where, after an event occurs in either the Web component or the 3D engine, the result or data is "reverse-engineered" back by calling a pre-provided function of the other. For example, after the Unity camera completes its rotation, it calls a callback function registered in the browser to send the latest camera angle back to the Web component; this calling process is a "message callback." Message callbacks can be performed via JavaScript interfaces.

[0096] For example, the 3D camera visualization indicator component and the Unity camera achieve bidirectional real-time synchronization through a JavaScript message callback mechanism. When the Unity camera rotates, the rotation data is passed to the indicator component to update the display via a callback function; when the user interacts with the indicator component, the new rotation angle is passed to Unity via a callback function to update the camera pose.

[0097] In summary, the 3D camera visualization indicator component features real-time synchronization.

[0098] Optionally, the rotation data of the first 3D camera is sent to the 3D engine through a preset data interface. The 3D engine will determine the 3D camera pose adjustment amount based on the 3D camera rotation data, and adjust the 3D camera to the target angle based on the 3D camera pose adjustment amount.

[0099] In summary, the 3D camera control method provided in this application is applied to a Web component in a 3D camera control system. Responding to user interaction with a 3D camera visualization indicator component within the Web component, it determines the first 3D camera rotation data corresponding to the interaction. This 3D camera visualization indicator component is a 3D visualized cube, where each face represents a standard viewing direction and each vertex represents a preset angle. This application uses a 3D visualized cube display format to provide users with an intuitive visualization effect and a rich variety of viewing directions and angles. Then, using a preset data interface under a message callback mechanism, the 3D camera rotation data is sent to the 3D engine. The 3D engine determines the 3D camera pose adjustment amount based on the 3D camera rotation data and adjusts the 3D camera to the target angle. In this process, this application provides a wealth of spatial positioning points in the form of an intuitive 3D visualized cube. Users only need to click on the 3D visualized cube according to their operational intention to manipulate the 3D camera to reach the target angle, greatly improving the interactive efficiency of camera control.

[0100] Reference Figure 3 , Figure 3 Another flowchart illustrating the 3D camera control method for a Web component applied in a 3D camera control system provided in this application is shown below. Figure 3 As shown in the figure, a 3D camera control method provided in this application embodiment may include step 201, which will be described in detail below.

[0101] Step 201: Receive the second 3D camera rotation data sent by the 3D engine. The second 3D camera rotation data is the data sent by the 3D engine to the Web component in response to the adjustment operation of the 3D camera. The Web component determines the pose adjustment amount of the 3D camera visualization indicator component in the Web component based on the second 3D camera rotation data, and adjusts the 3D camera visualization indicator component to the target angle based on the pose adjustment amount of the 3D camera visualization indicator component.

[0102] It should be noted that the 3D engine and Web component in the 3D camera control system can achieve bidirectional data synchronization. The specific embodiment of this application is to synchronize the rotation data of the second 3D camera in the 3D engine to the Web component, thereby adjusting the pose of the 3D camera visualization indicator component accordingly.

[0103] The 3D camera rotation data sent by the 3D engine is the second 3D camera rotation data corresponding to the adjustment operation of the 3D camera, which is determined by the 3D engine in response to the adjustment operation of the 3D camera, and then sent through the preset data interface under the message callback mechanism.

[0104] After receiving the rotation data from the second 3D camera, the Web component uses a container component to convert the operation point data in the second 3D camera rotation data from the Unity coordinate system to the position data in the CSS 3D coordinate system. Then, based on the position data, it determines the pose adjustment amount of the 3D camera visualization indicator component and adjusts the 3D camera visualization indicator component to the target angle based on the pose adjustment amount.

[0105] This application also provides a computer storage medium for use as a Web component in a 3D camera control system. The 3D camera control system further includes a 3D engine. The storage medium carries one or more computer programs. When the one or more computer programs are executed by an electronic device, they enable the electronic device to implement the 3D camera control method described in the first aspect or any implementation thereof.

[0106] The above describes a 3D camera control method for a Web component in a 3D camera control system, provided by an embodiment of this application. The following describes the apparatus for performing the above-described 3D camera control method.

[0107] Please see Figure 4 , Figure 4 This is a schematic diagram of the structure of a 3D camera control device for a Web component applied in a 3D camera control system, as provided in an embodiment of this application. Figure 4 As shown, the device includes a determining unit 10 and a transmitting unit 20; wherein:

[0108] The determining unit 10 is used to determine the first 3D camera rotation data corresponding to the interaction operation in response to the user's interactive operation on the pre-built 3D camera visualization indicator component; the 3D camera visualization indicator component is a 3D visualization cube, each cube face in the 3D visualization cube represents a standard viewing direction, and each vertex in the 3D visualization cube represents a preset angle viewing direction.

[0109] The sending unit 20 is used to send the first 3D camera rotation data to the 3D engine using a preset data interface under the message callback mechanism. The 3D engine determines the 3D camera pose adjustment amount based on the first 3D camera rotation data and adjusts the 3D camera to the target angle based on the 3D camera pose adjustment amount.

[0110] In one embodiment, the 3D camera control device for the Web component applied in the 3D camera control system further includes a receiving unit;

[0111] This receiving unit is specifically used for:

[0112] The system receives second 3D camera rotation data sent by the 3D engine. This second 3D camera rotation data is the data that the 3D engine sends to the Web component in response to the adjustment operation of the 3D camera. The Web component then determines the pose adjustment amount of the 3D camera visualization indicator component in the Web component based on the second 3D camera rotation data, and adjusts the 3D camera visualization indicator component to the target angle based on the pose adjustment amount.

[0113] In one embodiment, the receiving unit is specifically used for:

[0114] The Web component converts the rotation angle data in the second 3D camera rotation data into position information in the preset first coordinate system according to the preset transformation mapping relationship, and determines the pose adjustment amount of the 3D camera visualization indicator component based on the position information.

[0115] In one embodiment, the process of constructing the 3D camera visualization indicator component in unit 10 includes:

[0116] Build a semi-transparent 3D visualization cube in React components;

[0117] Each face of the semi-transparent 3D visualization cube is set as an interactive face representing the standard viewing direction;

[0118] Set an interactive element of a preset shape at each vertex of a semi-transparent 3D visualization cube, and set each interactive element as an interactive point representing a preset rotation angle.

[0119] In one embodiment, the determining unit 10 is specifically used for:

[0120] Determine the type of interaction event corresponding to the interaction operation. Interaction event types include face interaction events and vertex interaction events.

[0121] When the interaction event type is a surface interaction event, determine the first position information of the first interaction point corresponding to the surface interaction event in the preset first coordinate system, and determine the first rotation angle data based on the first position information. The first rotation angle data is the first 3D camera rotation data.

[0122] When the interaction event type is a vertex interaction event, the second position information of the second interaction point corresponding to the vertex interaction event in the preset first coordinate system is determined, and the second rotation angle data is determined based on the second position information. The second rotation angle data is the first 3D camera rotation data.

[0123] In one embodiment, the 3D camera control device for the Web component applied in the 3D camera control system further includes a scene running unit;

[0124] The scene unit is designed to support operation in at least edit, preview, and run modes for the 3D camera visualization indicator component.

[0125] When the 3D camera visualization indicator component is running in edit mode, it is located in the lower right corner of the scene editing page.

[0126] This application also provides a 3D camera control device for a Web component applied in a 3D camera control system. The Web component applied in the 3D camera control system further includes a 3D engine, comprising at least one processor and a memory connected to the processor, wherein:

[0127] Memory is used to store computer programs;

[0128] The processor is used to execute computer programs to enable the 3D camera control device to implement the 3D camera control method of the first aspect or any implementation thereof.

[0129] This application also provides a computer program product, including computer-readable instructions, which, when executed on an electronic device, cause the electronic device to implement the 3D camera control method of the first aspect or any implementation thereof.

[0130] Optionally, the above describes the 3D camera control method of the Web component in the 3D camera control system. Next, we will introduce the 3D camera control method applied to the 3D engine in the 3D camera control system.

[0131] like Figure 5 The diagram shown is a flowchart of a 3D camera control method for a 3D engine in a 3D camera control system provided in this application.

[0132] like Figure 5 As shown, the 3D camera control method includes the following steps:

[0133] Step 301: Receive the first 3D camera rotation data sent by the Web component. The first 3D camera rotation data is determined by the Web component in response to the user's interactive operation on the pre-built 3D camera visualization indicator component. The 3D camera visualization indicator component is a 3D visualization cube. Each face of the 3D visualization cube represents a standard viewing direction, and each vertex of the 3D visualization cube represents a preset angle viewing direction.

[0134] Step 302: Determine the 3D camera pose adjustment amount based on the first 3D camera rotation data, and adjust the 3D camera to the target angle based on the 3D camera pose adjustment amount.

[0135] Specifically, the 3D engine converts the rotation angle data in the first 3D camera rotation data into position information in the Unity coordinate system according to the preset transformation mapping relationship, and determines the pose adjustment amount of the 3D camera based on the position information.

[0136] The first 3D camera rotation data received by the 3D engine is in the CSS 3D coordinate system. This camera rotation data needs to be converted to position information in the Unity coordinate system. The default conversion mapping relationship can be:

[0137] CSS_X = Unity_X;

[0138] CSS_Y = Unity_Y;

[0139] CSS_Z = Unity_Z.

[0140] In Unity, the coordinate system can be pre-set with the Y-axis pointing upwards and the Z-axis pointing towards the back of the screen; in CSS 3D, the coordinate system can be pre-set with the Y-axis pointing downwards and the Z-axis pointing towards the front of the screen.

[0141] In summary, the 3D camera control method provided in this application involves the 3D engine receiving first 3D camera rotation data sent by a Web component, determining the pose adjustment amount of the 3D camera based on the 3D camera rotation data, and adjusting the 3D camera to the target angle based on the pose adjustment amount.

[0142] This application also provides a computer storage medium for a 3D engine in a 3D camera control system. The 3D camera control system further includes a Web component. The storage medium carries one or more computer programs. When one or more computer programs are executed by an electronic device, the electronic device can implement any of the 3D camera control methods provided in this application.

[0143] The above describes a 3D camera control method for a 3D engine applied in a 3D camera control system, provided by an embodiment of this application. The following describes the apparatus for executing the above-described 3D camera control method.

[0144] Please see Figure 6 This is a schematic diagram of the structure of a 3D camera control device applied to a 3D engine in a 3D camera control system, provided in an embodiment of this application. Figure 6 As shown, the device includes a receiving unit 100 and an adjustment unit 200; wherein:

[0145] The receiving unit 100 is used to receive the first 3D camera rotation data sent by the Web component. The first 3D camera rotation data is determined by the Web component in response to the user's interactive operation on the pre-built 3D camera visualization indicator component. The 3D camera visualization indicator component is a 3D visualization cube. Each face of the 3D visualization cube represents a standard viewing direction, and each vertex of the 3D visualization cube represents a preset angle viewing direction.

[0146] The adjustment unit 200 is used to determine the 3D camera pose adjustment amount based on the first 3D camera rotation data, and adjust the 3D camera to the target angle based on the 3D camera pose adjustment amount.

[0147] In one embodiment, the 3D camera control device for the 3D engine applied in the 3D camera control system further includes a conversion unit;

[0148] This conversion unit is specifically used by the 3D engine to convert the rotation angle data in the first 3D camera rotation data into position information in a preset second coordinate system according to a preset conversion mapping relationship, and to determine the 3D camera pose adjustment amount based on the position information.

[0149] This application also provides a 3D camera control device with a 3D engine applied in a 3D camera control system, and a Web component applied in the 3D camera control system. The 3D camera control system further includes a 3D engine, comprising at least one processor and a memory connected to the processor, wherein:

[0150] Memory is used to store computer programs;

[0151] The processor is used to execute computer programs to enable the 3D camera control device to implement the 3D camera control method of the first aspect or any implementation thereof.

[0152] This application also provides a computer program product, a 3D engine applied in a 3D camera control system, including computer-readable instructions, which, when executed on an electronic device, cause the electronic device to implement the 3D camera control method of the first aspect or any implementation thereof described above.

[0153] For example, see Figure 7 This application provides a schematic diagram of the interaction process between Web components and the 3D engine in a 3D camera control system.

[0154] The UI (User Interface) interaction layer consists of Web components built within React components, which include a camera indicator component; the engine rendering layer is a Unity WebGL 3D engine.

[0155] When the user interacts with the camera indicator using the mouse, keyboard, or by dragging, rotation parameters are generated in the UI interaction layer. These rotation parameters are then sent to the engine rendering layer via a data synchronization mechanism. Upon receiving the rotation parameters, the engine rendering layer updates the parameters of the 3D camera and renders the 3D scene.

[0156] Correspondingly, when the parameters of the 3D camera in the engine rendering layer change, the changed camera parameters will be sent to the UI interaction layer through a data synchronization mechanism, and the UI interaction layer will update the indicator based on the changed camera parameters.

[0157] For example, when a user interacts with a 3D camera visualization indicator component, the Web component calculates a new rotation angle and passes it to the container component within the Web component via the onChange callback. The container component converts the angle to a Unity coordinate system and sends the new angle to the Unity engine via a data interface or message callback. The Unity engine automatically updates the camera rotation, and the scene view is updated.

[0158] Correspondingly, when the camera rotation in the Unity engine changes, the Unity engine sends the new rotation data to the Web component, which is a front-end component. After receiving the new rotation data, the container component in the front-end component converts it into position data in the CSS 3D coordinate system and passes the converted position data as rotation:{X,Y,Z} to the 3D camera visualization indicator component, controlling the indicator component to update to the target angle.

[0159] In summary, the 3D engine and the Web component achieve bidirectional real-time synchronization. That is, when the camera in the 3D engine rotates, the 3D camera visualization indicator component will also be automatically updated. When the user operates on the 3D camera visualization indicator component, the camera in the 3D engine will also be updated accordingly.

[0160] It should also be noted that the device embodiments described above are merely illustrative. The units described as separate components may or may not be physically separate, and the components shown as units may or may not be physical units; that is, they may be located in one place or distributed across multiple network units. Some or all of the modules can be selected to achieve the purpose of this embodiment according to actual needs. In addition, in the device embodiment drawings provided in this application, the connection relationship between modules indicates that they have a communication connection, which can be implemented as one or more communication buses or signal lines.

[0161] Through the above description of the embodiments, those skilled in the art can clearly understand that this application can be implemented by means of software plus necessary general-purpose hardware, or it can be implemented by special-purpose hardware including application-specific integrated circuits, special-purpose CPUs, special-purpose memory, special-purpose components, etc. Generally, any function performed by a computer program can be easily implemented by corresponding hardware, and the specific hardware structure used to implement the same function can also be diverse, such as analog circuits, digital circuits, or special-purpose circuits. However, for this application, software program implementation is more often the preferred implementation method. Based on this understanding, the technical solution of this application, in essence, or the part that contributes to the prior art, can be embodied in the form of a software product. This computer software product is stored in a readable storage medium, such as a computer floppy disk, USB flash drive, mobile hard disk, ROM, RAM, magnetic disk, or optical disk, etc., and includes several instructions to cause a computer device (which may be a personal computer, training equipment, or network device, etc.) to execute the methods described in the various embodiments of this application.

[0162] In the above embodiments, implementation can be achieved, in whole or in part, through software, hardware, firmware, or any combination thereof. When implemented in software, it can be implemented, in whole or in part, as a computer program product.

[0163] The computer program product includes one or more computer instructions. When the computer program instructions are loaded and executed on a computer, all or part of the processes or functions described in the embodiments of this application are generated. The computer may be a general-purpose computer, a special-purpose computer, a computer network, or other programmable device. The computer instructions may be stored in a computer-readable storage medium or transmitted from one computer-readable storage medium to another. For example, the computer instructions may be transmitted from one website, computer, training device, or data center to another website, computer, training device, or data center via wired (e.g., coaxial cable, fiber optic, digital subscriber line (DSL)) or wireless (e.g., infrared, wireless, microwave, etc.) means. The computer-readable storage medium may be any available medium that a computer can store or a data storage device such as a training device or data center that integrates one or more available media. The available media may be magnetic media (e.g., floppy disks, hard disks, magnetic tapes), optical media (e.g., DVDs), or semiconductor media (e.g., solid-state drives (SSDs)).

Claims

1. A 3D camera control method, characterized in that, A web component applied in a 3D camera control system, the 3D camera control system further including a 3D engine, the method comprising: In response to a user's interactive operation on a pre-built 3D camera visualization indicator component, first 3D camera rotation data corresponding to the interactive operation is determined; the 3D camera visualization indicator component is a 3D visualization cube, each face of the 3D visualization cube represents a standard viewing direction, and each vertex of the 3D visualization cube represents a preset angle viewing direction. The first 3D camera rotation data is sent to the 3D engine using a preset data interface under the message callback mechanism. The 3D engine determines the 3D camera pose adjustment amount based on the first 3D camera rotation data and adjusts the 3D camera to the target angle based on the 3D camera pose adjustment amount.

2. The 3D camera control method according to claim 1, characterized in that, Also includes: The system receives second 3D camera rotation data sent by the 3D engine. This second 3D camera rotation data is generated by the 3D engine in response to an adjustment operation on the 3D camera. The engine sends the second 3D camera rotation data to the Web component using a preset data interface under a message callback mechanism. The Web component then determines the pose adjustment amount of the 3D camera visualization indicator component in the Web component based on the second 3D camera rotation data, and adjusts the 3D camera visualization indicator component to the target angle based on the pose adjustment amount.

3. The 3D camera control method according to claim 2, characterized in that, The Web component determines the pose adjustment amount of the 3D camera visualization indicator component in the Web component based on the rotation data of the second 3D camera, including: The Web component converts the rotation angle data in the second 3D camera rotation data into position information in a preset first coordinate system according to a preset transformation mapping relationship, and determines the pose adjustment amount of the 3D camera visualization indicator component based on the position information.

4. The 3D camera control method according to claim 1, characterized in that, The construction process of the 3D camera visualization indicator component includes: Build a semi-transparent 3D visualization cube in React components; Each face of the semi-transparent 3D visualization cube is set as an interactive face representing the standard viewing direction; An interactive element of a preset shape is set on each vertex of the semi-transparent 3D visualization cube, and each interactive element is set as an interactive point representing a preset rotation angle.

5. The 3D camera control method according to claim 1, characterized in that, The step of determining first 3D camera rotation data corresponding to the user's interactive operation on a pre-built 3D camera visualization indicator component includes: Determine the type of interaction event corresponding to the interaction operation, wherein the interaction event type includes face interaction events and vertex interaction events; When the interaction event type is the surface interaction event, the first position information of the first interaction point corresponding to the surface interaction event in the preset first coordinate system is determined, and the first rotation angle data is determined based on the first position information. The first rotation angle data is the first 3D camera rotation data. When the interaction event type is the vertex interaction event, the second position information of the second interaction point corresponding to the vertex interaction event in the preset first coordinate system is determined, and the second rotation angle data is determined based on the second position information. The second rotation angle data is the first 3D camera rotation data.

6. The 3D camera control method according to claim 1, characterized in that, Also includes: The 3D camera visualization indicator component supports operation in at least edit mode, preview mode, and run mode; When the 3D camera visualization indicator component is running in the edit mode, it is located in the lower right corner of the scene editing page.

7. A computer storage medium, characterized in that, A Web component for use in a 3D camera control system, wherein the storage medium carries one or more computer programs that, when executed by an electronic device, enable the electronic device to implement the 3D camera control method as described in any one of claims 1 to 6.

8. A 3D camera control method, characterized in that, A 3D engine is applied in a 3D camera control system, which also includes a web component. The method includes: The Web component receives first 3D camera rotation data sent by the Web component. The first 3D camera rotation data is determined by the Web component in response to the user's interactive operation on a pre-built 3D camera visualization indicator component. The 3D camera visualization indicator component is a 3D visualization cube. Each face of the 3D visualization cube represents a standard viewing direction, and each vertex of the 3D visualization cube represents a preset angle viewing direction. The 3D camera pose adjustment amount is determined based on the first 3D camera rotation data, and the 3D camera is adjusted to the target angle based on the 3D camera pose adjustment amount.

9. The 3D camera control method according to claim 8, characterized in that, Also includes: The 3D engine converts the rotation angle data in the first 3D camera rotation data into position information in a preset second coordinate system according to a preset transformation mapping relationship, and determines the 3D camera pose adjustment amount based on the position information.

10. A computer storage medium, characterized in that, A 3D engine applied in a 3D camera control system, wherein the storage medium carries one or more computer programs that, when executed by an electronic device, enable the electronic device to implement the 3D camera control method as described in any one of claims 8 to 9.

Images