Commodity information display method and electronic equipment
Through the offline rendering technology of panoramic images based on ray tracing, background and foreground panoramic layers are generated and layered on the client, the problems of high rendering costs and lack of interactivity in the existing technology are solved, and high-quality product display and interactive experience are achieved.
Patent Information
- Application Number
- CN202411685475.9
- Authority / Receiving Office
- CN · China
- Patent Type
- Applications(China)
- Current Assignee / Owner
- Filing Date
- 2024-11-22
- Publication Date
- 2025-04-08
- Estimated Expiration
- 2044-11-22
AI Technical Summary
When displaying product matching effects, the prior art faces the problems of high rendering costs and lack of interactivity, and it is difficult to take into account both timeliness and quality.
Through the offline rendering technology of panoramic images based on ray tracing, background and foreground panoramic layers are generated, and layered overlays are generated on the client side to generate panoramic stereoscopic images to achieve high-quality product display and interactive experience.
It achieves high-quality rendering effects, while shortening loading time, providing a rich interactive experience, and improving user experience and browsing-purchase conversion rate.
Smart Images

Figure CN119784460A_ABST
Abstract
Description
Technical Field
[0001] The present application relates to the field of information processing technology, and in particular to a commodity information display method and an electronic device. Background Art
[0002] In the information service scenario of home furnishings and home appliances, users in the late stage of hard decoration and early stage of soft decoration have the pain point of "already knowing the style of the home space, but not knowing which products to buy and the matching effect of the products". For users, they hope to view the details and matching effects of single products through tools; for merchants, they hope to promote the purchase of single products and cross-category purchases so that consumers can buy more products. In response to the above pain points, product display applications based on indoor 3D scene data came into being. The so-called indoor 3D scene data refers to a data set representing a three-dimensional scene and objects in the scene generated by professional three-dimensional scene design software. It contains the geometric shape, position, texture, lighting and other attributes of three-dimensional objects in the scene of the three-dimensional scene. This data can be used to describe the objects and spatial relationships of interior design solutions in virtual environments or actual environments, so that users can more intuitively view the matching effects of specific products in specific space stations and obtain a "what you see is what you get" shopping experience.
[0003] However, when displaying the matching effect, it is usually necessary to place multiple product models of different categories into the space model separately to display the matching effect. There are a large number of products in the system or store, and there may be multiple different products under the same category. In principle, these multiple different products can be replaced with each other, which may result in a large number of combinations. Therefore, how to display these matching effects to users is a problem that needs to be considered.
[0004] In the prior art, there are two main implementation schemes. One is to render all possible matching situations offline in advance into photo-level images for display to users on the front end. This scheme has high rendering quality (offline rendering is not limited by time and computing power) and almost no performance issues (actually only images are displayed to users on the front end, and no complex processing such as real-time rendering of 3D models is involved). However, there are at least two problems: First, as the number of replaceable items in the scene increases, the required rendering cost will increase exponentially. For example, assuming that there are 5 replaceable pits in a 3D space scene model, and each pit has 10 replaceable items, it is necessary to render 10 to the power of 5, that is, 10,000 pictures. The extremely high rendering cost makes it almost impossible to use this scheme to make a large number of free matches. Secondly, the actual front end displays only pure graphic information, which does not have any interactivity. Although users can perform replacement operations on items at a certain position, the entire picture is actually updated, and interactive operations such as dragging, moving, and changing perspectives cannot be supported. However, data has verified that the browsing-to-purchase conversion rate of this type of graphic and text display is not as good as that of the more interactive "3D exhibition hall" format.
[0005] Another existing implementation scheme is to directly render the 3D model in real time on the end side. This method can achieve interactivity and is more suitable for scenarios where users interact with scenes (games, graphics editors, etc.). However, it is precisely because of the need for various interactions on the end side that more than 30 frames are often required to be rendered per second. However, in actual applications, due to the limitations of the computing power and memory on the end side, it is difficult to provide too high rendering quality in a very short time. For example, the relationship between the 3D model and the light and shadow cannot be calculated completely correctly, making the rendering effect look very "fake". In addition, the performance of the end-side rendering of the 3D model has high requirements on computing power and memory, which will cause the problem of long scene loading time. Summary of the invention
[0006] The present application provides a product information display method and an electronic device, which can improve rendering quality, shorten loading time, and provide users with an interactive experience.
[0007] This application provides the following solutions:
[0008] A method for displaying product information, comprising:
[0009] Determine a 3D space model and 3D product models of multiple products, wherein the 3D space model is preset with multiple target locations, and the target locations are associated with category information of where the products can be placed;
[0010] Performing offline panoramic rendering based on ray tracing on the 3D space model to obtain a background panoramic layer;
[0011] By placing a single 3D product model at a target position of a corresponding category in the 3D space model, and setting the material parameters of the 3D space model to be transparent while retaining light and shadow information, performing off-line panoramic rendering based on ray tracing, a foreground panoramic layer corresponding to each of the multiple 3D product models is obtained, and the foreground panoramic layer reflects the light and shadow information generated by the 3D product model under the action of light after being placed in the 3D space model;
[0012] Determine the stacking order between the layers corresponding to the multiple target positions;
[0013] After receiving the user's browsing request, the target product combination to be displayed is determined, and the background panoramic layer is superimposed with the foreground panoramic layers corresponding to multiple products in the target product combination according to the superposition order, and a panoramic stereogram is generated for displaying product information.
[0014] Among them, it also includes:
[0015] By deleting the data on the transparent channel in the background panoramic layer, the background panoramic layer is saved as image data containing only three primary color channels.
[0016] Among them, it also includes:
[0017] The image data of the shadow part with transparency higher than a threshold in the foreground panoramic layer is deleted.
[0018] The foreground panoramic layer includes 2D images corresponding to planes in multiple directions of the panoramic stereogram;
[0019] The method further comprises:
[0020] Determine the circumscribed rectangle of the valid image in the 2D picture as the local cropping area, delete the blank pixels outside the local cropping area, and record the position information of the local cropping area in the 2D picture, so as to complete the generation and superposition of the plane image in the corresponding direction according to the position information when layer superposition is performed.
[0021] The foreground panoramic layer includes 2D images corresponding to planes in multiple directions of the panoramic stereogram;
[0022] The method further comprises:
[0023] If there is no valid information in a plane in a certain direction or in part of the directions in the same foreground panoramic layer, all image data of the 2D picture corresponding to the plane will be deleted, and the direction information corresponding to the plane will be recorded so that the layer overlay operation in the corresponding direction can be skipped during layer overlay.
[0024] Among them, it also includes:
[0025] Compress the information of the transparent channel in the foreground panoramic layer.
[0026] Wherein, when obtaining the background panoramic layer and the foreground panoramic layer, 2D images corresponding to planes in multiple directions of the panoramic stereogram are respectively obtained;
[0027] When generating the panoramic stereogram, the 2D images corresponding to the background panoramic layer and the foreground panoramic layer are sequentially superimposed in the same direction according to the superposition order, and the superposition results in multiple directions are enclosed in the form of a stereogram to generate the panoramic stereogram.
[0028] The foreground panoramic layer includes 2D images corresponding to planes in multiple directions of the panoramic stereogram;
[0029] The method further comprises:
[0030] When generating the foreground panoramic image layer, the bounding rectangle of the valid image in the 2D image is determined as the local cropping area, the blank pixels outside the local cropping area are deleted, and the sub-area division is performed within the local cropping area;
[0031] The generating of the panoramic stereogram comprises:
[0032] At the initial moment of rendering the panoramic stereogram, each layer is replaced by a placeholder image;
[0033] In the process of displaying through placeholder images, images of the background panoramic layer and the foreground panoramic layer corresponding to multiple products are loaded, wherein in the process of loading images, only image data of some sub-areas in the image that are within the current field of view of the virtual camera are loaded, and in the process of moving the camera perspective, judgments are made inside and outside the field of view based on the divided sub-areas.
[0034] The sub-region division within the local cropping region includes:
[0035] Creating a canvas according to the size of the 2D image before cropping, and evenly gridding the canvas;
[0036] According to the position and size of the local cropping area in the canvas, determine whether each grid has an overlapping portion with the local cropping area; if so, reduce the grid to the size of the overlapping portion so that the reduced grid can be determined as a sub-area divided within the local cropping area.
[0037] If there is no overlapping portion between the grid and the local cropping area, the grid is reduced to zero width and height, so that the grid division result of the canvas can be reused when the local cropping area corresponding to different commodities is divided into sub-areas.
[0038] The generated background panorama layer and each foreground panorama layer include a high-resolution version and a low-resolution version respectively;
[0039] In the process of rendering the panoramic stereogram, the low-resolution version is rendered first, and then the high-resolution version is rendered; and when rendering the low-resolution version, the background part is rendered first, and then the foreground part is rendered from far to near; when rendering the high-resolution version, the foreground part is rendered first from near to far, and then the background part is rendered.
[0040] Among them, it also includes:
[0041] After the panoramic stereogram is generated, a virtual camera is placed at the center of the panoramic stereogram so as to simulate an interactive response process in a 3D scene through the panoramic stereogram.
[0042] The interactive response process includes:
[0043] Providing an operation option for switching the display of multiple products corresponding to the same target location;
[0044] After receiving a request to switch to the target product for display through the operation option, the layer corresponding to the target position is replaced with the foreground panoramic layer corresponding to the target product for display.
[0045] The interactive response process includes:
[0046] Provides an interactive response process that changes the virtual camera perspective by sliding the screen for multi-angle viewing.
[0047] A computer-readable storage medium stores a computer program, which, when executed by a processor, implements the steps of any of the methods described above.
[0048] An electronic device, comprising:
[0049] one or more processors; and
[0050] A memory associated with the one or more processors, the memory being used to store program instructions, wherein the program instructions, when read and executed by the one or more processors, execute the steps of any of the methods described above.
[0051] A computer program product comprises a computer program / computer executable instructions, wherein the computer program / computer executable instructions implement the steps of any of the aforementioned methods when executed by a processor in an electronic device.
[0052] According to the specific embodiments provided in this application, this application discloses the following technical effects:
[0053] Through the embodiment of the present application, a layered panoramic view method can be provided to realize the display of home furnishings, furniture and other categories of goods. In this scheme, since the rendering of the 3D model is completed offline in the preprocessing stage, the 3D model rendering process will not be limited by the length of time, computing power, etc., and the panoramic view rendering based on ray tracing can be performed to obtain a photo-level rendering result, and images in multiple directions can be obtained, not limited to the main viewing direction of the camera, so as to provide rich 3D space information. In addition, the rendering of the foreground image can be respectively placed in the 3D space model for rendering for a single 3D product model, and the 3D space model can be set to transparent, and then the panoramic view offline rendering based on ray tracing is performed, so that the foreground panoramic layer can reflect the light and shadow information generated by the 3D product model under the action of light after being placed in the 3D space model, so that the rendering effect and quality are guaranteed. In the real-time rendering stage, the client loads the 2D picture corresponding to the panoramic layer from the server. The client can superimpose the 2D pictures in the order of the layers, and after forming a panoramic stereogram, it can simulate the interactive effects such as multi-perspective browsing and product replacement in the 3D scene. Therefore, the client does not involve loading and rendering of 3D models, so the response speed is guaranteed, and the interactive effects in 3D scenes can be simulated through panoramic stereograms.
[0054] In addition, the rendering quality and performance can be further improved through a series of optimization processes in the preprocessing stage and the real-time rendering stage. For example, in the preprocessing stage, the data on the transparent channel in the background panoramic layer can be deleted, the image data of the shadow part with transparency higher than the threshold in the foreground panoramic layer can be deleted, the bounding rectangle of the valid image in the foreground panoramic layer can be used as the local cropping area, and the faces without valid images can be removed, etc.; in the real-time rendering stage, heuristic and progressive rendering can be performed to improve the first screen loading speed and user experience.
[0055] Of course, any product implementing the present application does not necessarily need to achieve all of the advantages described above at the same time. BRIEF DESCRIPTION OF THE DRAWINGS
[0056] In order to more clearly illustrate the embodiments of the present application or the technical solutions in the prior art, the drawings required for use in the embodiments will be briefly introduced below. Obviously, the drawings described below are only some embodiments of the present application. For ordinary technicians in this field, other drawings can be obtained based on these drawings without paying creative work.
[0057] Figure 1 It is a schematic diagram of the system architecture provided by the embodiment of the present application;
[0058] Figure 2 is a flow chart of the method provided in the embodiment of the present application;
[0059] Figure 3 is a schematic diagram of a background layer provided in an embodiment of the present application;
[0060] Figure 4 is a schematic diagram of a foreground layer provided in an embodiment of the present application;
[0061] Figure 5 is a schematic diagram related to shadow reduction provided in an embodiment of the present application;
[0062] Figure 6 is another schematic diagram related to shadow reduction provided by an embodiment of the present application;
[0063] Figure 7 It is a schematic diagram related to local cutting provided in an embodiment of the present application;
[0064] Figure 8 It is a schematic diagram related to layer overlay and panoramic stereo image generation provided by an embodiment of the present application;
[0065] Fig. 9 is a schematic diagram related to shadow reduction provided in an embodiment of the present application;
[0066] Fig.10 is a schematic diagram related to shadow reduction provided in an embodiment of the present application;
[0067] Fig.11 is a schematic diagram related to shadow reduction provided in an embodiment of the present application;
[0068] Fig.12 It is a schematic diagram related to shadow reduction provided in an embodiment of the present application;. DETAILED DESCRIPTION
[0069] The following will be combined with the drawings in the embodiments of the present application to clearly and completely describe the technical solutions in the embodiments of the present application. Obviously, the described embodiments are only part of the embodiments of the present application, not all of the embodiments. All other embodiments obtained by ordinary technicians in this field based on the embodiments in the present application belong to the scope of protection of this application.
[0070] In the embodiment of the present application, a method based on a "layered panoramic view" is adopted to realize the display of home furnishing and furniture products. In a preferred manner, a series of rendering quality optimization, performance optimization and other processing can also be performed.
[0071] Among them, the "layering" in the so-called "layered panorama" means that it can be divided into a background layer and multiple foreground layers, wherein the background layer can correspond to the 3D space scene model, and the foreground layer can correspond to each specific product. That is to say, assuming that there are 5 pits in a 3D space scene model, and each pit has 10 replaceable goods, then in the embodiment of the present application, only 5×10=50 foreground layers need to be generated. When the matching effect between different goods is displayed through the combination between different pits, it can be achieved by replacing the foreground layer. For example, assuming that a certain product combination is (A1, B1, C1, D1, E1), at this time, when specifically displayed at the front end, the background layer can be superimposed with the foreground layer corresponding to the above-mentioned five products A1, B1, C1, D1, E1; if it is necessary to replace the product A1 in the above combination with A2, that is, it is necessary to display the matching effect of (A2, B1, C1, D1, E1) in the current 3D space model, then the foreground layer corresponding to A1 is replaced with the foreground layer corresponding to A2.
[0072] The "panorama" in "layered panorama" means that the background layer and the foreground layer generated in the embodiment of the present application are panoramic layers, that is, when rendering, the camera's front, back, left, right, top, and bottom directions are rendered, not just the camera's main viewing direction.
[0073] The above-mentioned background panoramic layer and foreground panoramic layer can be generated offline, so that the rendering process of the 3D model will not be limited by time, computing power, etc., and the quality of layer generation is guaranteed. After obtaining the background panoramic layer and the foreground panoramic layer corresponding to each product, online real-time rendering can be performed. At this time, the specific background panoramic layer and the foreground panoramic layer corresponding to the product in the specific combination to be displayed can be loaded, and multiple layers can be superimposed and displayed. Among them, each panoramic layer can correspond to the 2D images corresponding to the planes in multiple directions in the panoramic stereogram, for example, it can be a 2D image on the six faces of the upper, lower, left, right, front, and back of the panoramic hexahedron, etc. During online real-time rendering, the planes in all directions can also be surrounded into a panoramic stereogram, and the virtual camera can be placed in the center of the stereogram to simulate the interactive effects such as the rotation of the perspective in the 3D exhibition hall scene. Among them, in the specific implementation, multiple optimizations can also be performed in the offline preprocessing, online real-time loading and other processes to further improve the picture quality and / or performance.
[0074] From the perspective of system architecture, see Figure 1 , the embodiment of the present application can provide a layered panoramic rendering solution with real-time rendering capabilities of photo-level indoor scenes and real-time preview capabilities of furniture matching effects in the commodity information service system. Specifically, a server and a client can be provided, wherein the server is mainly used to complete offline panoramic layer generation and storage, and the client can mainly be a client for consumer users, and an access portal for related functions can be provided in the relevant pages of the client. For example, the above-mentioned access portal can be provided in the store page of a certain merchant, or the above-mentioned access portal can also be provided in the channel pages such as the home improvement and home furnishing channel of the system, and so on. Among them, the above-mentioned store page or channel page can be a web page, that is, a 2D web page. After the user initiates an access request through the above-mentioned access portal, the corresponding background layer and foreground layer can be loaded from the server to assemble into a panoramic stereogram to simulate the display and interactive effects in the 3D scene.
[0075] The specific implementation scheme provided in the embodiments of the present application is described in detail below.
[0076] First, the present invention provides an information display method. Figure 2 , the method may include:
[0077] S201: Determine a 3D space model and 3D product models of multiple products, wherein the 3D space model is preset with multiple target locations, and the target locations are associated with category information where the products can be placed.
[0078] In the specific implementation, firstly, a 3D space model and a plurality of 3D commodity models can be determined, wherein the 3D space model can be a predefined "model room" model, or it can also correspond to certain actual house types, or even a 3D space model generated according to the house types of the consumer users' own homes uploaded, etc. Among them, multiple "pits" can be preset in the generated 3D space model, that is, the positions that can be used to place specific commodities, and each pit can specify specific commodity category information, for example, a pit is used to place sofa-type commodities, another pit is used to place coffee table-type commodities, and so on. Regarding multiple 3D commodity models, that is, 3D models corresponding to multiple commodities that can be placed in the above-mentioned 3D space model, the multiple commodities described here can have multiple selection methods. For example, assuming that a merchant needs to provide users with relevant functional modules in its own store page, the merchant can select specific commodities, which are usually commodities in the same store; or, if the platform needs to provide relevant functional modules in the home furnishing and other channel pages, the platform's operation staff can complete the selection operation, and at this time, cross-store commodity matching can be performed.
[0079] S202: Performing offline panoramic rendering based on ray tracing on the 3D space model to obtain a background panoramic layer.
[0080] After determining the 3D space model and multiple 3D product models, the offline layer generation process can be completed first, that is, in the embodiment of the present application, the specific "layered panorama" can be generated offline, and when it is specifically displayed to the user, multiple different layers are superimposed and displayed online. Among them, since the layers are generated offline, they will not be limited by time and computing power, and a better layer generation effect can be obtained. In the online state, only layer superposition and other processing need to be completed. Therefore, while ensuring good picture effects, the response speed can be guaranteed and the loading time can be shortened. In addition, since the generated layer is a panoramic layer, the 3D effect in the "3D exhibition hall" situation can be simulated in the form of a panoramic view, and interactions such as product replacement and perspective rotation can be supported.
[0081] Specifically, when generating layers offline, a background panoramic layer can be generated first. Specifically, the 3D space scene can be rendered. During rendering, the 3D space scene can be in an "empty" state, or some 3D product models can be placed in the 3D space model, but these 3D product models will not block the light of the 3D space model (for example, some cabinets placed close to the wall, etc.). In the above state, offline rendering of the panoramic image based on ray tracing can be performed. If the 3D space model is in an empty state, only the 3D space model can be rendered. If some 3D product models that will not block the light are placed therein, the 3D space model and these 3D product models can be rendered together in a panoramic image based on ray tracing.
[0082] The so-called ray tracing is a specific rendering technology that can accurately simulate light transmission in the process of rendering a 3D model, can track the trajectory of light to simulate real lighting and shadows, and generate or enhance highly realistic reflection, refraction, shadow and other effects. In the scenario of the embodiment of the present application, since it is necessary to show the matching effect of multiple different home furnishing products in the space, the simulation of light and shadow is very important, so that the user can observe whether a certain piece of furniture will cause light obstruction in the room, etc. Therefore, in the embodiment of the present application, a rendering method based on ray tracing can be used to achieve the rendering of the 3D model, so that the rendering result can simulate the reflection, refraction and shadow effects of such light.
[0083] When rendering a 3D space model using ray tracing-based technology, a panoramic image can be rendered. There is a concept of a virtual camera in the 3D rendering engine. In a general rendering process, usually only the image within the forward field of view facing the camera is rendered. However, in an embodiment of the present application, it is necessary to render the camera in six directions, namely, front, back, left, right, up, and down, to obtain a background panoramic layer. It should be noted here that the background panoramic image obtained in the initial state can be a whole image, from which views on the planes in six directions, namely, front, back, left, right, up, and down, can be cut out. For example, in a certain example, the images on the six surfaces corresponding to the obtained background panoramic layer can be as follows: Figure 3 shown.
[0084] It should be noted here that each pixel of the image is usually composed of four channels: RGBA (red, green, blue, and transparency). However, since the background layer does not need to consider the transparency of shadows, the transparency channel does not need to be considered when saving the data of the background layer. That is, in an optional manner, the background panoramic layer can be converted into image data containing only RGB primary color channels by deleting the data on the transparent channel in the background panoramic layer. For example, the specific image can be in a format such as JPG (Joint Photographic Experts Group, an image format). By deleting the data on the transparency channel, 25% of the storage space can be saved, effectively improving the end-side scene loading speed.
[0085] S203: By placing individual 3D product models at target positions of corresponding categories in the 3D space model respectively, and setting the material parameters of the 3D space model to be transparent while retaining light and shadow information, performing panoramic offline rendering based on ray tracing, the foreground panoramic layers corresponding to the multiple 3D product models are obtained, and the foreground panoramic layers reflect the light and shadow information generated by the 3D product models under the action of light after being placed in the 3D space model.
[0086] After the generation of the background panoramic layer is completed, the generation of the foreground panoramic layer can be performed. Among them, in the embodiment of the present application, the corresponding foreground panoramic layer can be generated for each commodity to be placed in the 3D space model, that is, to obtain the panoramic layer of each commodity in the 3D space model. Specifically, the 3D commodity models can be placed in the empty 3D space model one by one (that is, only one 3D commodity model is placed in the 3D space scene at a time, and the specific placement position can be determined according to the commodity category information corresponding to the pit position set in the 3D space scene, for example, sofa commodities are placed in the sofa pit position, etc.), and the material parameters of the empty 3D space model are set to transparent and retain the light and shadow information, and then the panoramic rendering of ray tracing is performed. In this way, the background image will not be displayed in the image of the rendering result, but the reflection, refraction, shadow and other light and shadow information generated by the specific 3D commodity model after being placed in the 3D space model under the action of light can still be reflected. As a result, the foreground panorama layer corresponding to each product rendered not only has photo-level texture features, but also includes the light and shadow information of the product in the "room", which can more accurately reflect the light interaction between the product and the room. In addition, since the background part has been made transparent, each foreground panorama only contains the product and its shadow, and the other areas are transparent.
[0087] It should be noted here that in the 3D renderer, the specific 3D model has material parameters. When it is implemented specifically, the material type of the 3D space model can be set to a material such as Vray with shadow catcher capability, and the material parameters such as "transparent and retain shadows" can be turned on. Among them, the "material" of the 3D space model is also briefly introduced as follows: In the embodiment of the present application, the process of offline 3D model rendering is essentially to do physical simulation, simulating ray tracing, that is, the reflection and refraction of light on the surfaces of different objects. Light starts from the light source, passes through many object surfaces, and enters the human eye, and people see the color; if the light is blocked during propagation, the light reaching the human eye will be reduced, and a shadow effect will be produced. Therefore, in the process of rendering a 3D model, a calculation is involved: for a point on the surface of an object, the incident light around is integrated and then reflected to the output direction. This calculation process is also called the "material" of the 3D model. Different materials will have different calculation parameters, and by setting these parameters, the visual "transparent" effect of the final rendering result will be achieved. However, since the light and shadow information is retained, the light and shadow effects of the 3D product model in the space station are retained. That is to say, after rendering is completed, although the background is transparent, the 3D product model has a shadow. The direction, size, shape, etc. of this shadow are related to the shape of the 3D product model itself and its position in the 3D space model.
[0088] The foreground panoramic layer corresponding to each product may also be divided into 2D images on planes in multiple directions, for example, images in six directions, such as front, back, left, right, up, down, and so on.
[0089] Since the light and shadow information is retained in the process of generating the foreground panoramic layer, there may be shadows in the foreground image. For example, the foreground layer with shadows can be Figure 4 As shown (from Figure 4It can be seen that, since the 3D space model is made transparent before rendering, there is no complex background in the foreground layer, and no processing such as cutout is required. Although this light and shadow information can improve the realism of rendering, the existence of shadows will inevitably increase the amount of data, and in general, it may not be necessary to retain too many shadows. Therefore, in an optional implementation method, the image data of the shadow part with opacity lower than the threshold in the foreground panoramic layer can be deleted to retain obvious shadows as much as possible, weaken lighter shadows, and thus reduce the range of shadows of objects in the image. In specific implementation, a nonlinear light and shadow estimator can be first introduced to weaken lighter shadows by recalculating the opacity (for example, square attenuation, etc.), which can be processed specifically by formula (1); then, a threshold denoising image operation can be performed to directly set pixels with opacity lower than the specified threshold to transparent, which can be processed specifically by formula (2).
[0090] α′=α F ,α∈[0,1],F∈(0+∞) (1)
[0091] α″=α′ifα′>t else 0,t∈[0,1] (2)
[0092] In the above two formulas, α represents opacity (i.e., α channel), and its value range is [0, 1], where 0 represents complete transparency and 1 represents complete opacity. α is processed by formula (1) to obtain α', and then processed by formula (2) to obtain α".
[0093] Formula (1) is the formula of the light and shadow estimator, which is used to recalculate the opacity, so that dark shadows are darker and light shadows are lighter. F is the parameter that controls the attenuation curve, and its value range is (0, +∞). When α and t remain unchanged, the larger F is, the more pixels whose opacity tends to 0, and the smaller the final shadow range.
[0094] Formula (2) is used to set the opacity of pixels with too low opacity to 0, where t is the opacity threshold, and its value range is [0, 1]. When the opacity of a pixel is less than t, the transparency of the pixel will be set to 0.
[0095] Among them, the different values of F and t will affect the final processing results. For example, Figure 5 (A) shows the function change curve when F is different values, Figure 5 (B) shows the rendering effect when F=1. Figure 5(C) shows the rendering effect when F = 2. In practical applications, when F is 2 and t is 10 / 255, a relatively ideal processing result can be obtained. Of course, the values of the above parameters can also be adjusted according to different actual needs.
[0096] To more clearly demonstrate the effect of t on shadow reduction, the image can be binarized: if a pixel is completely transparent, it is set to black, otherwise it is set to white. Figure 6 For the original image shown in (A), when the values of t are 0, 5 / 255, and 10 / 255, the corresponding images obtained after binarization processing can be respectively as follows Figure 6 As shown in (B), (C), and (D).
[0097] The essence of the shadow reduction step is to perform lossy compression of information while ensuring visual effects. This step will produce many unnecessary blank pixels. Therefore, in a preferred manner, further cropping or culling operations can be performed to truly delete these invalid information from the image. For example, assuming that the specific foreground panoramic layer includes 6 surfaces of the panorama, two types of cropping and culling may be involved here: if a surface is completely blank, that is, it does not include any valid information, then this surface can be directly eliminated; for the remaining surfaces, a minimum rectangle containing all valid information (which can be called a circumscribed rectangle) can be used to crop the image. For example, assuming that the original image on a certain surface is as follows Figure 7 As shown in (A), after cutting, it can be Figure 7 (B) As shown. In this way, the size of the image can be further reduced and storage space can be saved. Of course, in the specific implementation, for the case of cropping, the position of the above-mentioned circumscribed rectangle in the image can be recorded (it can be recorded according to the coordinates of the upper left corner of the rectangle and the width and height of the rectangle), so that when performing online real-time rendering later, the placement position of the cropped image can be determined according to the position information. For the case of culling the entire surface, information such as the direction of the culled surface can be recorded so that the superposition between layers can be correctly performed during the subsequent online real-time rendering.
[0098] In addition to shadow reduction and cropping, the foreground panoramic image can also be compressed using relevant image compression algorithms. Since the foreground layer contains data on the transparency channel, it can be compressed using the WebP (an image file format that provides both lossy and lossless compression (reversible compression)) format or the KTX2 (a texture compression algorithm that is mainly used to reduce the storage space occupied by texture images in computer graphics processing while maintaining or approaching the quality of the original image) algorithm that is more suitable for GPU (Graphics Processing Unit) rendering to increase loading speed, reduce memory usage, and reduce resource pre-pushing size.
[0099] S204: Determine the stacking order between the layers corresponding to the multiple target positions.
[0100] In addition to obtaining the specific image data of the background panoramic layer and multiple foreground panoramic layers, the superposition order between multiple different layers can also be determined. Among them, the background layer needs to be placed at the bottom layer, but the relative order of the foreground layer needs to be clearly specified. Among them, the order of the foreground layers described here has nothing to do with the specific objects, and the layer order can be determined by the angle of the target position (also known as the "pit") set in the 3D space model. Among them, for simple scenes, it can be calculated directly according to the distance of the pit from the camera in the 3D space model. For example, assuming that there are four pits such as A, B, C, and D, among which pit A is closest to the camera, C is second, and then D and B, then the order of these pits from top to bottom can be A, C, D, B. For complex scenes (the pit is a point, and the model is a body. Sometimes the relative position of the point cannot represent the relative position of the body. At this time, the layer sorting problem becomes complicated), a more complex method based on Mask (mask or mask) can be used to calculate the order between layers. The specific Mask method does not belong to the focus of protection of this application and will not be described in detail here.
[0101] S205: After receiving the browsing request from the user, determine the target product combination to be displayed, and superimpose the background panoramic layer with the foreground panoramic layers corresponding to the multiple products in the target product combination according to the superposition order, and generate a panoramic stereogram for displaying the product information.
[0102] The aforementioned S201 to S204 are all pre-processing steps performed offline. After completing the above pre-processing, the front-end access entrance can be provided to the user so that the user can initiate access. In an embodiment of the present application, the user can initiate a specific access request on the Web side, and the server side can return to the client a plurality of 2D pictures corresponding to the plurality of layers, as well as information such as the order between the layers. The client can superimpose the plurality of layers in sequence and render a panoramic stereogram. Among them, the panoramic stereogram can specifically be a panoramic polyhedron, for example, it can generally be a panoramic hexahedron, and so on. In addition, the virtual camera can also be placed at a position such as the center of the panoramic stereogram to simulate the interactive effect of a 3D scene. For example, the user can change the camera viewing angle by sliding the screen, etc., to view the specific matching effect from other perspectives, or can also choose to replace other products to a certain position for display, and so on.
[0103] Among them, since there may be multiple replaceable commodities in each pit of the same 3D space model, but only one commodity is usually displayed in the same pit at the same time, a default commodity combination can be provided in the specific implementation, which includes multiple commodities corresponding to multiple pits, and each pit can correspond to only one commodity. In this way, after the user initiates the visit, the foreground panoramic layer corresponding to which commodity needs to be displayed in each layer can be determined according to the default commodity combination. Of course, after displaying this default commodity combination, an operation option for replacing commodities in a specific pit can also be provided in the interface. Users can replace the commodities on the specific pit and view the corresponding matching effects.
[0104] As mentioned above, when obtaining the background panoramic layer and the foreground panoramic layer, the 2D images corresponding to the planes in multiple directions of the panoramic stereogram can be obtained respectively. In this way, when generating the panoramic stereogram, the 2D images corresponding to the background panoramic layer and the foreground panoramic layer can be superimposed in the same direction according to the superposition order, and the superposition results in multiple directions can be enclosed in the form of a stereogram to generate the panoramic stereogram. In other words, only one side of the panorama is looked at first. In this step, a background layer and the foreground layers corresponding to multiple commodities will be superimposed in the order determined before to form the superposition effect of the traditional 2D layered rendering scheme. When the layers of multiple sides are superimposed, the multiple sides are enclosed in the form of a polyhedral box. After that, the camera can be placed in the center of the box, etc., so that the superposition of the panorama is achieved. For example, the specific process of superposition and enclosing a hexahedral box can be as follows. Figure 8 As shown, each face can be composed of a background image and multiple foreground images superimposed, and then the six faces form a panoramic hexahedral box.
[0105] It should be noted here that for the cropped foreground layer, if the image on a certain surface is cropped out of the image within the minimum rectangular range containing valid information, then when superimposing, the specific superimposition processing can be completed according to the position information of the rectangle recorded during cropping. For example, in the process of superimposing multiple layers on a certain surface, the background layer of the surface is located at the bottom layer, and the size of the background image is also the size of the surface. Moreover, for each foreground layer on the surface, before cropping, its size is the same as the size of the background image. Therefore, after a rectangle is cropped out from the foreground layer on the surface, assuming that the rectangle is located at (x, y) of the image, when superimposing, the rectangle can be superimposed at the above (x, y) relative to the background layer. In addition, if a certain surface of a certain foreground layer is completely eliminated, then when superimposing, the foreground layer can skip the superimposition operation on this surface, and only the superimposition operation can be performed on other foreground layers.
[0106] In the specific implementation, since each layer corresponds to 2D images of planes in multiple directions, if multiple 2D images corresponding to each layer are directly loaded, it may take up more resources and a longer time. Considering that usually only the images within the current field of view of the camera can be displayed at the same time, only after the user performs the operation of changing the viewing angle, will the images within the field of view of other viewing angles be displayed. Therefore, in the preferred implementation method, a placeholder image can be first used to generate a panoramic stereogram, that is, in the initial stage, the image will not be actually loaded, and the actual loading logic of the image will be gradually carried out after the panoramic stereogram is constructed.
[0107] Specifically, when loading an image, the "tile segmentation" logic can be used to divide an image into multiple sub-areas, and load the image in units of a sub-area. For example, if some sub-areas are within the field of view, only these sub-areas can be loaded, and other sub-areas do not need to be loaded. In the traditional way, a complete image is usually directly tiled. However, in the embodiment of the present application, since some foreground layers are cropped and only the images within the circumscribed rectangular area of valid information are retained, sub-area segmentation can be performed within the circumscribed rectangular area, that is, "region tile segmentation" can be achieved. In this way, in the specific rendering process, at the initial moment of rendering the panoramic stereogram, each layer can first be replaced by a placeholder map, and then the background panoramic layer and the foreground panoramic layer corresponding to each product can be loaded in the process of displaying through the placeholder map. In the process of loading the image, only the image data of some sub-areas in the image within the current field of view of the virtual camera can be loaded, and in the process of moving the camera perspective, the divided sub-areas are used as units for update.
[0108] That is to say, unlike the tile segmentation logic of a general panorama, the embodiment of the present application can also consider the local cropping problem while segmenting the tiles. In specific implementation, in the embodiment of the present application, first, n×n tiles can be created through uniform grid division, and then each tile will be reduced according to the local cropping area. In other words, the tile size in the local cropping area can be determined based on the overlapping part between the tiles divided by the uniform grid and the local cropping area; assuming that a certain tile has no overlapping part with the local cropping area, it will be reduced to a tile with a width and height of 0. The reason why tiles with a width and height of 0 are still retained is that the position, size, etc. of the local cropping areas corresponding to different objects will change. When the above tiles are retained, there is no need to delete and re-create tile entities / textures when the local cropping area changes, which can bring performance improvements.
[0109] For example, Fig. 9 As shown, assuming that the relationship between the initial canvas and the local clipping area is as follows Fig. 9 (A) shows that 91 is the local cropping area. The result obtained after the canvas is divided into 3×3 uniform tiles is as follows Fig. 9 (B) As shown; after reducing the tiles, the result can be obtained as Fig. 9 (C) That is, only the 4 tiles in the upper left corner overlap with the local cropping area, so these 4 tiles are reduced to be equal to the overlapping part, and the other 5 tiles do not overlap with the local cropping area, so they are directly reduced to tiles with a width and height of 0.
[0110] It should be noted here that, first, since the grid division method of the canvas can be fixed, and the size and position of the local cropping area corresponding to different objects may be different, the tiles in the local cropping area may be unevenly divided. Fig. 9 As shown in (D), assuming that the local cropping area of an item is at the position shown in 92, the tiles divided by the local cropping area are uneven, but this does not affect the subsequent "visibility culling" processing. Second, each layer can consider the tile division during end-side rendering in the data preprocessing stage and prepare tile-level data in advance. Third, the granularity of tile division does not need to be too fine, otherwise it may put pressure on GPU resources and the speed at which the browser concurrently pulls resources.
[0111] In the case of local tile segmentation, visibility culling can be performed during online real-time rendering. Visibility culling is a common optimization method in game engines, and its core idea is "only load resources that are visible within the camera's field of view." Combined with the tile segmentation in the previous step, this step can speed up the first screen rendering speed. Specifically, initially, the algorithm will only load faces within the lens range; when the camera moves, it will load faces that newly appear in the field of view; when performing a replacement operation, tiles within the field of view will be updated immediately, and tiles that are not within the field of view will be delayed until the camera turns to that position. For example, Fig.10 As shown, red objects that are not within the frustum can be culled, which can increase the layer loading speed.
[0112] In addition, considering that there are many layers, in the preferred implementation mode, the logic of gradually improving the resolution of the layer data can also be used. Specifically, for each layer, two sets of data, high-resolution and low-resolution, can be prepared in the preprocessing stage. Specifically, when performing online real-time rendering, the low-resolution image can be loaded at a faster speed first, so that the user can have a general understanding of the appearance of the object, and then the high-resolution image can be loaded. Secondly, for multiple layers on the same surface, heuristic empirical rules can be set between the loading order of the layers. Specifically, when loading a low-resolution layer, the background can be loaded first to fill the canvas to give the user a feeling that the scene has been loaded, and then the foreground object can be loaded from near to far; when loading a high-resolution layer, the foreground object can be loaded from near to far based on the non-transparent object rendering logic, and then the background can be updated. This heuristic and progressive loading can give users a faster first screen loading speed and a better first screen loading experience.
[0113] After the online real-time rendering is completed, it also supports rich interactive capabilities. The two most basic capabilities are replacement and perspective rotation. Users can freely view the specified location in the room and replace it by clicking on the product in the switch panel. In addition, the solution also supports additional interactive capabilities such as undo and redo, and display model bounding box range. Among them, for replacement, an operation option can be provided to switch the display of multiple products corresponding to the same target location. After receiving a request to switch to the target product for display through this operation option, the layer corresponding to the target location can be replaced with the foreground panoramic layer corresponding to the target product for display. In other words, only the layer corresponding to the location needs to be replaced, and other layers can remain unchanged.
[0114] It should be noted that regarding the rotation of the viewing angle, the user can specifically operate by sliding the screen. Among them, in the embodiment of the present application, the camera position can be placed in the center of the cube box or other positions. During the rotation of the viewing angle, the camera position remains unchanged, and only the viewing angle changes. In other words, during the rotation of the viewing angle, the objects in the space do not rotate. In addition, in actual applications, the user can also be provided with the function of rotating 360 degrees to view the object. At this time, it involves the situation of obtaining pictures of the same object at multiple different angles. In specific implementation, AI and other methods can be used to generate pictures of the same object at multiple viewing angles to support the above functions.
[0115] The above describes in detail the specific implementation scheme provided by the embodiment of the present application. In summary, the embodiment of the present application can be divided into two stages: offline preprocessing and online real-time rendering. In addition to some basic processing, each stage can also perform a series of optimization processing. In order to better understand the scheme provided by the embodiment of the present application, the following is combined with Fig.11 The provided process diagram introduces a preferred solution in detail.
[0116] like Fig.11 As shown, in the preprocessing stage, 3D scene data can be produced on the production side, including a 3D space scene model and multiple 3D product models, and then enter the preprocessing stage. In this stage, background panoramic layer rendering and multiple foreground panoramic layer rendering can be performed, and layer sorting can also be performed. Among them, for the background panoramic layer, the data on the transparent channel can be deleted, and the output is an optimized background image on 6 surfaces; for the foreground panoramic layer, partial shadow weakening, local cropping, surface culling, texture compression and other processing can be performed, and n~n×6 optimized foreground images can be output, where n is the number of products. In the real-time rendering stage, the client can obtain 6 background panoramas, n~n×6 optimized foreground images and layer sorting information, and then perform panoramic layered overlay. During the overlay process, optimization processing such as local tile division, visibility culling, and heuristic progressive loading can also be performed. In the display process, interactive operations can also be supported, including users moving the camera perspective, or replacing products in a certain position, etc.
[0117] In summary, through the embodiment of the present application, a layered panoramic method can be provided to realize the display of home furnishings, furniture and other categories of goods. In this scheme, since the rendering of the 3D model is completed offline in the preprocessing stage, the 3D model rendering process will not be limited by the length of time, computing power, etc., and the panoramic rendering based on ray tracing can be performed to obtain a photo-level rendering result, and images in multiple directions can be obtained, not limited to the main viewing direction of the camera. In addition, the rendering of the foreground image can be performed by placing a single 3D product model into the 3D space model for rendering, and the material parameters of the 3D space model can be set to transparent and the light and shadow information can be retained, and then the panoramic offline rendering based on ray tracing can be performed, so that the foreground panoramic layer can reflect the light and shadow information generated by the 3D product model after being placed in the 3D space model under the action of light, so that the rendering effect and quality are guaranteed. In the real-time rendering stage, the client loads the 2D picture corresponding to the panoramic layer from the server. The client can superimpose the 2D pictures in the order of the layers, and after forming a panoramic stereogram, it can simulate the interactive effects such as multi-perspective browsing and product replacement in the 3D scene. Therefore, the client does not involve loading and rendering of 3D models, so the response speed is guaranteed, and the interactive effects in 3D scenes can be simulated through panoramic stereograms.
[0118] In addition, the rendering quality and performance can be further improved through a series of optimization processes in the preprocessing stage and the real-time rendering stage. For example, in the preprocessing stage, the data on the transparent channel in the background panoramic layer can be deleted, the image data of the shadow part with transparency higher than the threshold in the foreground panoramic layer can be deleted, the bounding rectangle of the valid image in the foreground panoramic layer can be used as the local cropping area, and the faces without valid images can be removed, etc.; in the real-time rendering stage, heuristic and progressive rendering can be performed to improve the first screen loading speed and user experience.
[0119] It should be noted that the embodiments of the present application may involve the use of user data. In actual applications, user-specific personal data can be used in the scheme described herein within the scope permitted by applicable laws and regulations, subject to the requirements of applicable laws and regulations of the country where the user is located (for example, with the user's explicit consent, effective notification to the user, etc.).
[0120] Corresponding to the aforementioned method embodiment, the embodiment of the present application further provides a commodity information display device, which may include:
[0121] A 3D model determination unit, used to determine a 3D space model and 3D commodity models of a plurality of commodities, wherein a plurality of target positions are preset in the 3D space model, and the target positions are associated with category information where commodities can be placed;
[0122] A first offline rendering unit, configured to perform offline panoramic rendering of the 3D space model based on ray tracing to obtain a background panoramic layer;
[0123] The second offline rendering unit is used to place a single 3D product model at a target position of a corresponding category in the 3D space model, set the material parameters of the 3D space model to be transparent and retain the light and shadow information, and then perform panoramic offline rendering based on ray tracing to obtain a foreground panoramic layer corresponding to the multiple 3D product models, and make the foreground panoramic layer reflect the light and shadow information generated by the 3D product model under the action of light after being placed in the 3D space model;
[0124] A stacking order determining unit, used to determine the stacking order between the layers corresponding to the multiple target positions;
[0125] The online rendering unit is used to determine the target product combination to be displayed after receiving the user's browsing request, and to superimpose the background panoramic layer with the foreground panoramic layers corresponding to multiple products in the target product combination according to the superposition order, and generate a panoramic stereogram for displaying the product information.
[0126] In a specific implementation, the device may further include:
[0127] The transparent channel data deleting unit is used to save the background panoramic layer as image data containing only three primary color channels by deleting the data on the transparent channel in the background panoramic layer.
[0128] The shadow weakening unit is used to delete the image data of the shadow part with transparency higher than a threshold in the foreground panoramic layer.
[0129] The foreground panoramic layer includes 2D images corresponding to planes in multiple directions of the panoramic stereogram. The device may also include:
[0130] The local cropping unit is used to determine the circumscribed rectangle of the valid image in the 2D picture as the local cropping area, delete the blank pixels outside the local cropping area, and record the position information of the local cropping area in the 2D picture, so as to complete the generation and superposition of the plane image in the corresponding direction according to the position information when layer superposition is performed.
[0131] It may also include:
[0132] The surface culling unit is used to delete all image data of the 2D picture corresponding to a plane in a certain direction or part of the directions in the same foreground panoramic layer if there is no valid information in the plane of the plane, and record the direction information corresponding to the plane, so as to skip the layer overlay operation in the corresponding direction when performing layer overlay.
[0133] The compression unit is used to compress the information of the transparent channel in the foreground panoramic layer.
[0134] In addition, since 2D images corresponding to the planes in multiple directions of the panoramic stereogram are obtained respectively when the background panoramic layer and the foreground panoramic layer are obtained, when generating the panoramic stereogram, the 2D images corresponding to the background panoramic layer and the foreground panoramic layer can be superimposed in sequence in the same direction according to the superposition order, and the superposition results in multiple directions are enclosed in the form of a stereogram to generate the panoramic stereogram.
[0135] Furthermore, the device also includes:
[0136] A local tile division unit, used for determining the circumscribed rectangle of the effective image in the 2D picture as the local cropping area, deleting the blank pixels outside the local cropping area, and performing sub-area division within the local cropping area when generating the foreground panoramic image layer;
[0137] The online rendering unit can be specifically used for:
[0138] At the initial moment of rendering the panoramic stereoscopic image, each layer is replaced by a placeholder image; in the process of displaying through the placeholder image, the background panoramic layer and the foreground panoramic layer corresponding to the multiple commodities are loaded, wherein, in the process of loading the image, only the image data of the partial sub-area in the image within the current field of view of the virtual camera is loaded, and in the process of moving the camera angle of view, the judgment inside and outside the field of view is performed based on the divided sub-area.
[0139] Specifically, when performing sub-region division within the local cropping area, a canvas can be created according to the size of the 2D image before cropping, and the canvas can be evenly gridded; then, based on the position and size of the local cropping area in the canvas, it is determined whether each grid has an overlapping part with the local cropping area. If so, the grid is reduced to the size of the overlapping part, so that the reduced grid can be determined as the sub-region divided within the local cropping area.
[0140] If there is no overlapping portion between the grid and the local cropping area, the grid is reduced to zero width and height, so that the grid division result of the canvas can be reused when the local cropping area corresponding to different commodities is divided into sub-areas.
[0141] In addition, the generated background panoramic layer and each foreground panoramic layer include a high-resolution version and a low-resolution version, respectively; in the process of rendering the panoramic stereogram, the low-resolution version can be rendered first, and then the high-resolution version can be rendered; and when rendering the low-resolution version, the background part is rendered first, and then the foreground part is rendered from far to near, and when rendering the high-resolution version, the foreground part is rendered first from near to far, and then the background part is rendered.
[0142] In addition, the device may also include:
[0143] The interactive response unit is used to place a virtual camera at the center of the panoramic stereogram after the panoramic stereogram is generated, so as to simulate the interactive response process in the 3D scene through the panoramic stereogram.
[0144] Specifically, the interactive response unit can be used to:
[0145] An operation option is provided for switching the display of multiple commodities corresponding to the same target position; after receiving a request to switch to the target commodity for display through the operation option, the layer corresponding to the target position is replaced with the foreground panoramic layer corresponding to the target commodity for display.
[0146] Alternatively, an interactive response process is provided by sliding the screen to change the virtual camera perspective for multi-angle viewing.
[0147] In addition, an embodiment of the present application further provides a computer-readable storage medium on which a computer program is stored, and when the program is executed by a processor, the steps of any one of the methods in the aforementioned method embodiments are implemented.
[0148] And an electronic device, comprising:
[0149] one or more processors; and
[0150] A memory associated with the one or more processors, the memory being used to store program instructions, wherein the program instructions, when read and executed by the one or more processors, execute the steps of the method described in any one of the aforementioned method embodiments.
[0151] A computer program product includes a computer program / computer executable instructions, which, when executed by a processor in an electronic device, implement the steps of the method described in the aforementioned method embodiment.
[0152] in, Fig.12 The architecture of the electronic device is shown as an example, which may include a processor 1210, a video display adapter 1211, a disk drive 1212, an input / output interface 1213, a network interface 1214, and a memory 1220. The processor 1210, the video display adapter 1211, the disk drive 1212, the input / output interface 1213, the network interface 1214, and the memory 1220 may be communicatively connected via a communication bus 1230.
[0153] Among them, the processor 1210 can be implemented by a general-purpose CPU (Central Processing Unit, processor), a microprocessor, an application specific integrated circuit (Application Specific Integrated Circuit, ASIC), or one or more integrated circuits, etc., to execute relevant programs to implement the technical solution provided in this application.
[0154] The memory 1220 can be implemented in the form of ROM (Read Only Memory), RAM (Random Access Memory), static storage device, dynamic storage device, etc. The memory 1220 can store an operating system 1221 for controlling the operation of the electronic device 1200, and a basic input and output system (BIOS) for controlling the low-level operation of the electronic device 1200. In addition, a web browser 1223, a data storage management system 1224, and a commodity information display processing system 1225, etc. can also be stored. The above-mentioned commodity information display processing system 1225 can be an application program that specifically implements the aforementioned steps in the embodiment of the present application. In short, when the technical solution provided by the present application is implemented by software or firmware, the relevant program code is stored in the memory 1220 and is called and executed by the processor 1210.
[0155] The input / output interface 1213 is used to connect the input / output module to realize information input and output. The input / output module can be configured in the device as a component (not shown in the figure), or it can be externally connected to the device to provide corresponding functions. The input device may include a keyboard, a mouse, a touch screen, a microphone, various sensors, etc., and the output device may include a display, a speaker, a vibrator, an indicator light, etc.
[0156] The network interface 1214 is used to connect to a communication module (not shown) to realize communication interaction between the device and other devices. The communication module can realize communication through a wired mode (such as USB, network cable, etc.) or a wireless mode (such as mobile network, WIFI, Bluetooth, etc.).
[0157] The bus 1230 comprises a pathway for transmitting information between the various components of the device (eg, the processor 1210 , the video display adapter 1211 , the disk drive 1212 , the input / output interface 1213 , the network interface 1214 , and the memory 1220 ).
[0158] It should be noted that, although the above device only shows a processor 1210, a video display adapter 1211, a disk drive 1212, an input / output interface 1213, a network interface 1214, a memory 1220, a bus 1230, etc., in the specific implementation process, the device may also include other components necessary for normal operation. In addition, it can be understood by those skilled in the art that the above device may also only include components necessary for implementing the solution of the present application, and does not necessarily include all the components shown in the figure.
[0159] It can be known from the description of the above implementation methods that those skilled in the art can clearly understand that the present application can be implemented by means of software plus a necessary general hardware platform. Based on such an understanding, the technical solution of the present application can be essentially or partly contributed to the prior art in the form of a software product, which can be stored in a storage medium such as ROM / RAM, a magnetic disk, an optical disk, etc., and includes several instructions for enabling a computer device (which can be a personal computer, a server, or a network device, etc.) to execute the methods described in the various embodiments of the present application or certain parts of the embodiments.
[0160] Each embodiment in this specification is described in a progressive manner, and the same or similar parts between the embodiments can refer to each other, and each embodiment focuses on the differences from other embodiments. In particular, for the system or system embodiment, since it is basically similar to the method embodiment, the description is relatively simple, and the relevant parts can refer to the partial description of the method embodiment. The system and system embodiments described above are merely schematic, wherein the units described as separate components may or may not be physically separated, and the components displayed as units may or may not be physical units, that is, they may be located in one place, or they may be distributed on multiple network units. Some or all of the modules may be selected according to actual needs to achieve the purpose of the scheme of this embodiment. Ordinary technicians in this field can understand and implement it without creative work.
[0161] The above is a detailed introduction to the commodity information display method and electronic device provided by the present application. The principles and implementation methods of the present application are described in detail using specific examples. The description of the above embodiments is only used to help understand the method and core ideas of the present application. At the same time, for those skilled in the art, according to the ideas of the present application, there will be changes in the specific implementation methods and application scopes. In summary, the content of this specification should not be understood as limiting the present application.
Claims
1. A method for displaying commodity information, characterized in that: include: Determine a 3D space model and 3D product models of multiple products, wherein the 3D space model is preset with multiple target locations, and the target locations are associated with category information of where the products can be placed; Performing offline panoramic rendering based on ray tracing on the 3D space model to obtain a background panoramic layer; By placing a single 3D product model at a target position of a corresponding category in the 3D space model, and setting the material parameters of the 3D space model to be transparent while retaining light and shadow information, performing off-line panoramic rendering based on ray tracing, a foreground panoramic layer corresponding to each of the multiple 3D product models is obtained, and the foreground panoramic layer reflects the light and shadow information generated by the 3D product model under the action of light after being placed in the 3D space model; Determine the stacking order between the layers corresponding to the multiple target positions; After receiving the user's browsing request, the target product combination to be displayed is determined, and the background panoramic layer is superimposed with the foreground panoramic layers corresponding to multiple products in the target product combination according to the superposition order, and a panoramic stereogram is generated for displaying product information.
2. The method according to claim 1, characterized in that Also includes: By deleting the data on the transparent channel in the background panoramic layer, the background panoramic layer is saved as image data containing only three primary color channels.
3. The method according to claim 1, characterized in that Also includes: The image data of the shadow part with transparency higher than a threshold in the foreground panoramic layer is deleted.
4. The method according to claim 1, characterized in that: The foreground panoramic layer includes 2D images corresponding to planes in multiple directions of the panoramic stereogram; The method further comprises: Determine the circumscribed rectangle of the valid image in the 2D picture as the local cropping area, delete the blank pixels outside the local cropping area, and record the position information of the local cropping area in the 2D picture, so as to complete the generation and superposition of the plane image in the corresponding direction according to the position information when layer superposition is performed.
5. The method according to claim 1, characterized in that The foreground panoramic layer includes 2D images corresponding to planes in multiple directions of the panoramic stereogram; The method further comprises: If there is no valid information in a plane in a certain direction or in part of the directions in the same foreground panoramic layer, all image data of the 2D picture corresponding to the plane will be deleted, and the direction information corresponding to the plane will be recorded so that the layer overlay operation in the corresponding direction can be skipped during layer overlay.
6. The method according to claim 1, characterized in that Also includes: Compress the information of the transparent channel in the foreground panoramic layer.
7. The method according to claim 1, characterized in that When obtaining the background panoramic layer and the foreground panoramic layer, 2D images corresponding to planes in multiple directions of the panoramic stereogram are obtained respectively; When generating the panoramic stereogram, the 2D images corresponding to the background panoramic layer and the foreground panoramic layer are sequentially superimposed in the same direction according to the superposition order, and the superposition results in multiple directions are enclosed in the form of a stereogram to generate the panoramic stereogram.
8. The method according to claim 1, characterized in that: The foreground panoramic layer includes 2D images corresponding to planes in multiple directions of the panoramic stereogram; The method further comprises: When generating the foreground panoramic image layer, the bounding rectangle of the valid image in the 2D image is determined as the local cropping area, the blank pixels outside the local cropping area are deleted, and the sub-area division is performed within the local cropping area; The generating of the panoramic stereogram comprises: At the initial moment of rendering the panoramic stereogram, each layer is replaced by a placeholder image; In the process of displaying through placeholder images, images of the background panoramic layer and the foreground panoramic layer corresponding to multiple products are loaded, wherein in the process of loading images, only image data of some sub-areas in the image that are within the current field of view of the virtual camera are loaded, and in the process of moving the camera perspective, judgments are made inside and outside the field of view based on the divided sub-areas.
9. The method according to claim 8, characterized in that The sub-region division within the local cropping region includes: Creating a canvas according to the size of the 2D image before cropping, and evenly gridding the canvas; According to the position and size of the local cropping area in the canvas, determine whether each grid has an overlapping portion with the local cropping area; if so, reduce the grid to the size of the overlapping portion so that the reduced grid can be determined as a sub-area divided within the local cropping area.
10. The method according to claim 9, characterized in that If there is no overlapping portion between the grid and the local cropping area, the grid is reduced to zero width and height, so that the grid division result of the canvas can be reused when the local cropping area corresponding to different commodities is divided into sub-areas.
11. The method according to claim 1, characterized in that: The generated background panorama layer and each foreground panorama layer include a high-resolution version and a low-resolution version respectively; In the process of rendering the panoramic stereogram, the low-resolution version is rendered first, and then the high-resolution version is rendered; and when rendering the low-resolution version, the background part is rendered first, and then the foreground part is rendered from far to near; when rendering the high-resolution version, the foreground part is rendered first from near to far, and then the background part is rendered.
12. The method according to any one of claims 1 to 11, characterized in that: Also includes: After the panoramic stereogram is generated, a virtual camera is placed at the center of the panoramic stereogram so as to simulate an interactive response process in a 3D scene through the panoramic stereogram.
13. A computer-readable storage medium having a computer program stored thereon, characterized in that: When the program is executed by a processor, the steps of the method described in any one of claims 1 to 12 are implemented.
14. An electronic device, characterized in that: include: one or more processors; as well as A memory associated with the one or more processors, the memory being used to store program instructions, wherein the program instructions, when read and executed by the one or more processors, execute the steps of the method described in any one of claims 1 to 12.
15. A computer program product comprising a computer program / computer executable instructions, characterized in that: When the computer program / computer executable instructions are executed by a processor in an electronic device, the steps of the method according to any one of claims 1 to 12 are implemented.
Citation Information
Patent Citations
Real 3D real-time mixed rendering method
CN107256574A
Page information and advertisement information display method and device, equipment and storage medium
CN115562782A
Display graph generation method and device, equipment and storage medium
CN117788304A
Real-Time 2D / 3D Object Image Composition System and Method
US20130265306A1
A method for generating and displaying panorama images based on rendering engine and a display apparatus
US20210409669A1
Cited By
Page loading method, system and device, storage medium and electronic equipment
CN122450574A