基于webgl的珠宝渲染方法、装置、终端设备及存储介质
技术领域
1.本发明涉及计算机图形学技术领域，尤其是涉及一种基于webgl的珠宝渲染方法、装置、终端设备及存储介质。
背景技术：2.目前钻石珠宝渲染基本以客户端为主，基于unity或者ue4实现钻石珠宝渲染和交互展示。如果用户需要体验3d珠宝展示则必须要下载应用程序(application,app)，体验过程繁琐，每次需要体验app新功能必须更新之后才能体验，不利于商家快速传播自己的商品，无法达到快速引流的目的；并且app推广过程缓慢，频繁的更新也会导致用户卸载app，而非刚需用户不会主动下载app体验3d珠宝产品展示，导致商家无法快速出售自己的货物。
3.随着webgl(web graphics library,3d绘图协议)的快速发展，和各类型的webgl引擎的开源，web(world wide web,全球广域网)端(又称网页端)可以实现钻石珠宝渲染和展示。但是，web端作为信息传播最快的途径，缺少珠宝钻石等奢饰品的渲染和展示解决方案，例如现有的web端珠宝展示主要以环境球贴图为主，对于钻石细节渲染难以实现，导致3d珠宝产品展示效果不佳，很难达到用户和商家的预期效果，并且商家难以快速推广珠宝产品。
技术实现要素：4.本发明实施例的目的是提供一种基于webgl的珠宝渲染方法、装置、终端设备及存储介质，其能够解决现有技术中存在web端难以实现钻石细节渲染，导致3d珠宝产品展示效果不佳，很难达到用户和商家的预期效果，并且商家难以快速推广珠宝产品的问题。
5.为了解决上述技术问题，本发明实施例提供了一种基于webgl的珠宝渲染方法，包括：
6.通过webgl构建目标珠宝模型的三维场景；
7.在所述三维场景下，加载所述目标珠宝模型并提取所述目标珠宝模型的法线信息；其中，所述法线信息包括法线向量；
8.基于所述目标珠宝模型中当前点的反射向量，对所述目标珠宝模型的反射环境球进行采样，获得所述当前点的反射颜色；
9.基于所述当前点的法线向量和预设折射采样次数，确定所述当前点的每次折射采样方向和每次折射采样点；其中，所述当前点的首次折射采样方向由所述当前点的法线向量确定，每次所述折射采样点由对应的上一次折射采样方向确定；
10.基于每次所述折射采样点，对所述目标珠宝模型的折射环境球进行循环采样，获得所述当前点每次的折射颜色，并累加所述当前点每次的折射颜色，以获得所述当前点的最终折射颜色；
11.基于所述当前点的反射颜色和最终折射颜色，对所述目标珠宝模型进行渲染。
12.在某一个实施例中，所述在所述基于所述当前点的法线向量和预设折射采样次
数，确定所述当前点的每次折射采样方向和每次折射采样点之前，所述方法还包括：
13.将所述当前点在所述目标珠宝模型坐标系下的局部空间顶点坐标，转换到所述三维场景坐标系下的世界空间顶点坐标；
14.则所述基于所述当前点的法线向量和预设折射采样次数，确定所述当前点的每次折射采样方向和每次折射采样点，包括：
15.基于所述当前点的法线向量和视角向量，确定所述当前点的首次折射采样方向；
16.基于所述世界空间顶点坐标和所述当前点的首次折射采样方向，获得所述目标珠宝模型的首次折射采样点；
17.基于所述首次折射采样点的法线向量和视角向量，确定所述当前点的下一次折射采样方向；
18.基于所述世界空间顶点坐标和所述当前点的下一次折射采样方向，获取所述目标珠宝模型的下一次折射采样点；
19.判断所述目标珠宝模型采样点的总数量是否超过所述预设折射采样次数；
20.若否，则循环上述获取所述目标珠宝模型的每次折射采样点的步骤，直至判断所述目标珠宝模型采样点的总数量超过所述预设折射采样次数。
21.在某一个实施例中，在所述在所述三维场景下，加载所述目标珠宝模型并提取所述目标珠宝模型的法线信息之后，所述方法还包括：
22.将所述法线信息存于纹理贴图之中，以获得法线贴图；
23.则所述基于所述世界空间顶点坐标和所述当前点的首次折射采样方向，获得所述目标珠宝模型的首次折射采样点，包括：
24.基于所述世界空间顶点坐标和所述当前点的首次折射采样方向，对所述法线贴图进行采样，获得所述目标珠宝模型的首次折射采样点；
25.所述基于所述世界空间顶点坐标和所述当前点的下一次折射采样方向，获取所述目标珠宝模型的下一次折射采样点，包括：
26.基于所述世界空间顶点坐标和所述当前点的下一次折射采样方向，对所述法线贴图进行采样，获取所述目标珠宝模型的下一次折射采样点。
27.在某一个实施例中，所述基于每次所述折射采样点，对所述目标珠宝模型的折射环境球进行循环采样，获得所述当前点每次的折射颜色，包括：
28.基于每次所述折射采样点的法线向量，对所述目标珠宝模型的折射环境球进行采样，获得所述当前点每次的折射采样颜色；
29.基于所述当前点每次的折射采样颜色，获得所述当前点每次的折射颜色。
30.在某一个实施例中，在所述基于每次所述折射采样点的法线向量，对所述目标珠宝模型的折射环境球进行采样，获得所述当前点每次的折射采样颜色之前，所述方法还包括：
31.计算所述目标珠宝模型中当前点在折射环境球中的折射采样率；
32.则所述基于所述当前点每次的折射采样颜色，获得所述当前点每次的折射颜色，包括：
33.基于所述当前点每次的折射采样颜色和所述折射采样率，获得所述当前点每次的折射颜色。
34.在某一个实施例中，在所述基于所述目标珠宝模型中当前点的反射向量，对所述目标珠宝模型的反射环境球进行采样，获得所述当前点的反射颜色之前，所述方法还包括：
35.计算所述目标珠宝模型中当前点在所述反射环境球中的反射采样率；
36.则所述基于所述目标珠宝模型中当前点的反射向量，对所述目标珠宝模型的反射环境球进行采样，获得所述当前点的反射颜色，包括：
37.基于所述目标珠宝模型当前点的反射向量对所述反射环境球进行采样，获得所述当前点的反射采样颜色；
38.基于所述当前点的反射采样颜色和所述反射采样率，获得所述当前点的反射颜色。
39.本发明再一实施例提供了一种基于webgl的珠宝渲染装置，包括：
40.构建模块，用于通过webgl构建目标珠宝模型的三维场景；
41.提取模块，用于在所述三维场景下，加载所述目标珠宝模型并提取所述目标珠宝模型的法线信息；其中，所述法线信息包括法线向量；
42.反射颜色获取模块，用于基于所述目标珠宝模型中当前点的反射向量，对所述目标珠宝模型的反射环境球进行采样，获得所述当前点的反射颜色；
43.确定模块，用于基于所述当前点的法线向量和预设折射采样次数，确定所述当前点的每次折射采样方向和每次折射采样点；其中，所述当前点的首次折射采样方向由所述当前点的法线向量确定，每次所述折射采样点由对应的上一次折射采样方向确定；
44.折射颜色获取模块，用于基于每次所述折射采样点，对所述目标珠宝模型的折射环境球进行循环采样，获得所述当前点每次的折射颜色，并累加所述当前点每次的折射颜色，以获得所述当前点的最终折射颜色；
45.渲染模块，用于基于所述当前点的反射颜色和最终折射颜色，对所述目标珠宝模型进行渲染。
46.在某一个实施例中，还包括转换模块和判断模块；
47.所述转换模块，用于将所述当前点在所述目标珠宝模型坐标系下的局部空间顶点坐标，转换到所述三维场景坐标系下的世界空间顶点坐标；
48.所述确定模块，包括：
49.折射采样方向确定模块，用于基于所述当前点的法线向量和视角向量，确定所述当前点的首次折射采样方向；
50.采样点确定模块，用于基于所述世界空间顶点坐标和所述当前点的首次折射采样方向，获得所述目标珠宝模型的首次折射采样点；
51.所述折射采样方向确定模块，还用于基于所述首次折射采样点的法线向量和视角向量，确定所述当前点的下一次折射采样方向；
52.所述采样点确定模块，还用于基于所述世界空间顶点坐标和所述当前点的下一次折射采样方向，获取所述目标珠宝模型的下一次折射采样点；
53.所述判断模块，用于判断所述目标珠宝模型采样点的总数量是否超过所述预设折射采样次数；
54.若否，则由所述折射采样方向确定模块和所述采样点确定模块循环上述获取所述目标珠宝模型的每次折射采样点的步骤，直至所述判断模块判断所述目标珠宝模型采样点
的总数量超过所述预设折射采样次数。
55.本发明再一实施例提供了一种终端设备，包括处理器、存储器和存储在存储器中且被配置为由处理器执行的计算机程序，处理器执行计算机程序时实现如上的基于webgl的珠宝渲染方法。
56.本发明又一实施例提供了一种计算机可读存储介质，计算机可读存储介质包括存储的计算机程序，其中，在计算机程序运行时控制计算机可读存储介质所在设备执行如上的基于webgl的珠宝渲染方法。
57.相比于现有技术，本发明实施例的有益效果在于以下中的至少一点：
58.本发明基于webgl的珠宝渲染方法，通过webgl构建目标珠宝模型的三维场景；在所述三维场景下，加载所述目标珠宝模型并提取所述目标珠宝模型的法线信息；其中，所述法线信息包括法线向量；基于所述目标珠宝模型中当前点的反射向量，对所述目标珠宝模型的反射环境球进行采样，获得所述当前点的反射颜色；基于所述当前点的法线向量和预设折射采样次数，确定所述当前点的每次折射采样方向和每次折射采样点；其中，所述当前点的首次折射采样方向由所述当前点的法线向量确定，每次所述折射采样点由对应的上一次折射采样方向确定；基于每次所述折射采样点，对所述目标珠宝模型的折射环境球进行循环采样，获得所述当前点每次的折射颜色，并累加所述当前点每次的折射颜色，以获得所述当前点的最终折射颜色；基于所述当前点的反射颜色和最终折射颜色，对所述目标珠宝模型进行渲染。本发明通过对目标珠宝模型的折射环境球进行循环采样，以获得多次折射颜色，极大提高了webgl的目标珠宝模型渲染效果；另外，本发明基于webgl可以在任何浏览器快速打开，同时也可以嵌入小程序，用户点击链接即可体验逼真的3d珠宝产品效果，实现了跨端的3d珠宝产品快速展示，解决了商家快速引流、用户快速体验3d珠宝商品的问题。相应地，本发明还提供基于webgl的珠宝渲染装置、终端设备及存储介质。
附图说明
59.为了更清楚地说明本发明的技术方案，下面将对实施方式中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本发明的一些实施方式，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。
60.图1是本发明某一个实施例中的基于webgl的珠宝渲染方法的流程示意图；
61.图2是本发明某一个实施例中的基于webgl的珠宝渲染装置的结构示意图；
62.图3是本发明某一个实施例中的终端设备的结构示意图。
具体实施方式
63.下面将结合本发明实施例中的附图，对本发明实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅仅是本发明一部分实施例，而不是全部的实施例。基于本发明中的实施例，本领域普通技术人员在没有作出创造性劳动前提下所获得的所有其他实施例，都属于本发明保护的范围。
64.在本发明描述中，术语“第一”、“第二”、“第三”等仅用于描述目的，而不能理解为指示或暗示相对重要性或者隐含指明所指示的技术特征的数量。由此，限定有“第一”、“第二”、“第三”等的特征可以明示或者隐含地包括一个或者更多个该特征。在本发明的描述
中，除非另有说明，“多个”的含义是两个或两个以上。
65.在本发明的描述中，需要说明的是，除非另有明确的规定和限定，术语“安装”、“相连”、“连接”应做广义理解，例如，可以是固定连接，也可以是可拆卸连接，或一体地连接；可以是机械连接，也可以是电连接；可以是直接相连，也可以通过中间媒介间接相连，可以是两个元件内部的连通。对于本领域的普通技术人员而言，可以具体情况理解上述术语在本发明中的具体含义。
66.在本发明的描述中，需要说明的是，除非另有定义，本发明所使用的所有的技术和科学术语与属于本的技术领域的技术人员通常理解的含义相同。本发明中说明书中所使用的术语只是为了描述具体的实施例的目的，不是旨在于限制本发明，对于本领域的普通技术人员而言，可以具体情况理解上述术语在本发明中的具体含义。
67.首先，在对本技术实施例进行描述的过程中出现的部分名词或者术语作如下解释：
68.webgl(web graphics library)：是一种3d绘图协议，这种绘图技术标准允许把javascript和opengl es 2.0结合在一起，通过增加opengl es 2.0的一个javascript绑定，webgl可以为html5 canvas提供硬件3d加速渲染，这样web开发人员就可以借助系统显卡来在浏览器里更流畅地展示3d场景和模型，还能创建复杂的导航和数据视觉化。显然，webgl技术标准免去了开发网页专用渲染插件的麻烦，可被用于创建具有复杂3d结构的网站页面，甚至可以用来设计3d网页游戏等。
69.图形处理器(graphics processing unit，简称gpu)，又称显示核心、视觉处理器、显示芯片，是一种专门在个人电脑、工作站、游戏机和一些移动设备(如平板电脑、智能手机等)上图像运算工作的微处理器。
70.着色器(shader)：是一段能够针对三维(3dimensions，简称3d)对象进行操作、并被gpu所执行的程序，通过这些程序，能够获得绝大部分所需的3d图形效果。
71.法线：法线是始终垂直于某平面的虚线，3d建模中对一个或一组平面生成的法线经运算在二维(2dimensions，简称2d)屏幕上显示物理现实中所具有的表面曲率和受光情况，模拟模型体积感的一种手段。
72.几何形状(geometry)和材质(material)：在创建物体时，需要传入两个参数，一个是几何形状，另一个是材质。几何形状最主要的功能是储存了一个物体的顶点信息。webgl需要人为指定每个顶点的位置，而在three.js中，可以通过指定一些特征来创建几何形状，例如使用半径创建一个球体(sphere geometry)，从而省去人为一个个指定顶点的工作量。材质，是独立于物体顶点信息之外的与渲染效果相关的属性，通过设置材质可以改变物体颜色、纹理贴图、光照模式等。
73.贴图：在3d软件中，会将图片按照一定数学方式包裹在3d模型表面，形成纹理和色彩变化，这种用于模拟真实物体表面信息的图片，称为贴图。
74.环境球(env ball)：在环境(真实世界或计算机生成的环境)中，使用高反射的铬球图像可以重新创建该环境。由于该球中的反射可提供(将近)360度的环境视图，因此可以重新创建。与程序纹理背景或使用曲面建模的背景相比，“环境球”纹理背景的渲染速度更快捷。因此，可以将复杂的背景替换“环境球”纹理替换(通过渲染该环境中该球的图像即可)，以缩短渲染时间。
75.渲染：是计算机动画(computer animation)的最后一道工序，目的是通过摄像机，将3d软件中构建的虚拟内容从3d空间转换为人脑可以识别的2d图片的计算过程。
76.本发明实施例提供了一种基于webgl的珠宝渲染方法，请参阅图1，图1是本发明基于webgl的珠宝渲染方法一实施例的流程示意图，在本实施例中，基于webgl的珠宝渲染方法可以包括步骤s110～s160，各步骤具体如下：
77.s110、通过webgl构建目标珠宝模型的三维场景。
78.目标珠宝模型可以包括天然宝石和人工宝石，例如钻石、红宝石、翡翠等。三维场景包括相机、灯光、场景、背景、渲染器等基础组件。在本发明实施例中，可以以钻石为例，详细说明本发明的基于webgl的珠宝渲染方法。
79.在一个实施例中，可采用webgl开源引擎three.js来搭建web端3d基础场景，实现对目标珠宝的渲染。
80.其中，three.js是一个跨浏览器的脚本，使用javascript函数库或api来在网页浏览器中创建和展示动画的三维计算机图形。three.js使用webgl时，源代码托管在github。three.js允许使用javascript创建网页中的gpu加速的3d动画元素，而不是使用特定的浏览器插件。
81.s120、在所述三维场景下，加载所述目标珠宝模型并提取所述目标珠宝模型的法线信息；其中，所述法线信息包括法线向量。
82.在该三维场景中加载目标珠宝模型，例如使用three.js加载建模工具导出gltf格式的目标珠宝模型文件。然后提取目标珠宝模型的法线信息，例如法线向量，将该法线向量存于纹理贴图之中，用于法线信息保存。
83.然后使用three.js创建目标珠宝的shader(着色器)材质，创建顶点着色器和片元着色器。顶点着色器用于顶点的几何关系等的运算，以计算目标珠宝的基础架构，使用基本材质(basic material)的物体，渲染后物体的颜色，始终为该材质的颜色，不会由于光照产生明暗、阴影效果。片元着色器用于片源颜色等的计算，以实现目标珠宝的渲染流程。
84.s130、基于所述目标珠宝模型中当前点的反射向量，对所述目标珠宝模型的反射环境球进行采样，获得所述当前点的反射颜色。
85.选定所述目标珠宝模型中任一当前点，利用该当前点基于法线向量与视角向量获得的反射向量，对所述目标珠宝模型当前点的反射环境球进行采样，从而获得当前点的反射颜色。
86.在一个具体实施例中，在所述步骤s130之前，所述方法还包括以下步骤：
87.s170、计算所述目标珠宝模型中当前点在所述反射环境球中的反射采样率；
88.具体地，在片元着色器中使用brdf方程利用法线向量与视角向量的反射向量，求取目标珠宝模型当前点的反射采样率。其中，brdf方程为双向反射分布函数(bidirectional reflectance distribution function)，它描述了光线如何在物体表面进行反射，可以用来描述材质属性。brdf方程的输入参数是入射光的仰角、方位角、出射光的仰角、方位角，还与入射光的波长相关；输出结果是一个数值，表示在给定的入射条件下，出射方向上反射的相对能量。
89.则所述步骤s130基于所述目标珠宝模型中当前点的反射向量，对所述目标珠宝模型的反射环境球进行采样，获得所述当前点的反射颜色，包括以下子步骤：
90.s131、基于所述目标珠宝模型当前点的反射向量对所述反射环境球进行采样，获得所述当前点的反射采样颜色；
91.s132、基于所述当前点的反射采样颜色和所述反射采样率，获得所述当前点的反射颜色。
92.在本实施例中，通过上述实施例中的反射向量对反射环境球进行采样，获得当前点的反射采样颜色，然后将当前点的反射采样颜色与当前点的反射采样率相乘，计算得到当前点的反射颜色。
93.s140、基于所述当前点的法线向量和预设折射采样次数，确定所述当前点的每次折射采样方向和每次折射采样点；其中，所述当前点的首次折射采样方向由所述当前点的法线向量确定，每次所述折射采样点由对应的上一次折射采样方向确定。
94.在本发明实施例中，通过对目标珠宝模型的折射环境球进行循环采样，以获得多次折射颜色，极大提高了基于webgl的目标珠宝模型渲染效果。
95.在一个具体实施例中，在所述步骤s140之前，所述方法还包括以下步骤：
96.s190、将所述当前点在所述目标珠宝模型坐标系下的局部空间顶点坐标，转换到所述三维场景坐标系下的世界空间顶点坐标。
97.在three.js中使用的是右手坐标系，右手坐标系的3个方向分别为：x轴水平向右，y轴垂直向上，z轴的方向就是屏幕由里往外的方向。在本实施例中，三维场景坐标系为three.js中的右手坐标系。
98.在本实施例中，顶点坐标用于表示当前点转换前后的坐标。当前点在三维场景坐标系下的世界空间顶点坐标可用于确定采样点的折射采样方向。具体地，通过获取片元着色器当前点在目标珠宝模型坐标系下的局部空间顶点坐标，利用当前目标珠宝模型的世界空间矩阵，将局部空间顶点坐标转换到在三维场景坐标系下的世界空间顶点坐标。可选地，当前点在三维场景坐标系下的世界空间顶点坐标，可通过世界空间矩阵与当前点的局部空间顶点坐标相乘得到。
99.则所述步骤s140基于所述当前点的法线向量和预设折射采样次数，确定所述当前点的每次折射采样方向和每次折射采样点，包括以下子步骤：
100.s141、基于所述当前点的法线向量和视角向量，确定所述当前点的首次折射采样方向。
101.通过当前点的顶点法线以及当前点的视角向量，计算当前点的首次折射采样方向向量，首次折射采样方向向量可确定首次折射采样方向，首次折射采样方向用于后续步骤的目标珠宝模型折射采样。
102.s142、基于所述世界空间顶点坐标和所述当前点的首次折射采样方向，获得所述目标珠宝模型的首次折射采样点。
103.利用步骤s190获取到的世界空间顶点坐标以及当前点的首次折射采样方向，得到首次折射采样点，从而也可确定首次采样点的法线向量。
104.可以理解，在获得首次采样点之后，就可基于首次采样点的法线向量，对所述目标珠宝模型的折射环境球进行采样，获得所述当前点首次的折射颜色。
105.s143、基于所述首次折射采样点的法线向量和视角向量，确定所述当前点的下一次折射采样方向。
106.通过当首次折射采样点的法线向量以及当前点的视角向量，计算当前点的下一次折射采样方向向量，下一次折射采样方向向量可确定首次折射采样方向，首次折射采样方向用于后续步骤的目标珠宝模型折射采样。
107.s144、基于所述世界空间顶点坐标和所述当前点的下一次折射采样方向，获取所述目标珠宝模型的下一次折射采样点。
108.利用步骤s190获取到的世界空间顶点坐标以及当前点的下一次折射采样方向，得到下一次折射采样点，从而也可确定下一次采样点的法线向量。
109.可以理解，在获得下一次采样点之后，就可基于下一次采样点的法线向量，对所述目标珠宝模型的折射环境球进行采样，获得所述当前点下一次的折射颜色。
110.s145、判断所述目标珠宝模型采样点的总数量是否超过所述预设折射采样次数；
111.s146、若否，则循环上述获取所述目标珠宝模型的每次折射采样点的步骤，直至判断所述目标珠宝模型采样点的总数量超过所述预设折射采样次数。
112.在本发明实施例中，每循环一次获取目标珠宝模型的每次折射采样点的步骤，就需判断所述目标珠宝模型采样点的总数量是否超过所述预设折射采样次数。
113.其中，本发明实施例的预设折射采样次数大于等于2。目标珠宝模型(例如钻石模型)的渲染细节是通过不断的折射光线采样得到，折射采样次数越多则目标珠宝模型细节越丰富，目标珠宝模型渲染效果越好，但性能开销越大。为更好地平衡目标珠宝模型的渲染效果与性能开销，可根据实际需求自定义预设折射采样次数，例如4次、5次、6次等，以使渲染效果和性能开销能够达到相对平衡。
114.循环上述获取所述目标珠宝模型的每次折射采样点的步骤，直至判断所述目标珠宝模型采样点的总数量超过所述预设折射采样次数，则停止循环。
115.在一个具体实施例中，在所述步骤s120在所述三维场景下，加载所述目标珠宝模型并提取所述目标珠宝模型的法线信息之后，所述方法还包括以下步骤：
116.s210、将所述法线信息存于纹理贴图之中，以获得法线贴图；
117.则所述步骤s142基于所述世界空间顶点坐标和所述当前点的首次折射采样方向，获得所述目标珠宝模型的首次折射采样点，包括以下子步骤：
118.s1421、基于所述世界空间顶点坐标和所述当前点的首次折射采样方向，对所述法线贴图进行采样，获得所述目标珠宝模型的首次折射采样点；
119.利用步骤s190获取到的世界空间顶点坐标以及当前点的首次折射采样方向，通过对步骤s210获取到的法线贴图进行采样，得到首次折射采样点，从而也可确定首次采样点的法线向量。
120.所述步骤s144基于所述世界空间顶点坐标和所述当前点的下一次折射采样方向，获取所述目标珠宝模型的下一次折射采样点，包括以下子步骤：
121.s1441、基于所述世界空间顶点坐标和所述当前点的下一次折射采样方向，对所述法线贴图进行采样，获取所述目标珠宝模型的下一次折射采样点。
122.利用步骤s190获取到的世界空间顶点坐标以及当前点的下一次折射采样方向，通过对步骤s210获取到的法线贴图进行采样，得到下一次折射采样点，从而也可确定下一次采样点的法线向量。
123.s150、基于每次所述折射采样点，对所述目标珠宝模型的折射环境球进行循环采
样，获得所述当前点每次的折射颜色，并累加所述当前点每次的折射颜色，以获得所述当前点的最终折射颜色。
124.在本实施例中，每次折射采样点由对应的上一次折射采样方向确定，每次折射采样点可能不同。基于每次折射采样点，对目标珠宝模型的折射环境球进行循环采样，获得当前点每次的折射颜色，例如循环次数在不超过预设折射采样次数的情况下，基于首次折射采样点，对目标珠宝模型的折射环境球进行循环采样，获得当前点首次的折射颜色；基于第一次折射采样点，对目标珠宝模型的折射环境球进行循环采样，获得当前点第一次的折射颜色；基于第二次折射采样点，对目标珠宝模型的折射环境球进行循环采样，获得当前点第二次的折射颜色。然后累加当前点每次的折射颜色，则可以获得当前点的最终折射颜色。
125.在一个具体实施例中，所述步骤s150中基于每次所述折射采样点，对所述目标珠宝模型的折射环境球进行循环采样，获得所述当前点每次的折射颜色，包括以下子步骤：
126.s151、基于每次所述折射采样点的法线向量，对所述目标珠宝模型的折射环境球进行采样，获得所述当前点每次的折射采样颜色；
127.s152、基于所述当前点每次的折射采样颜色，获得所述当前点每次的折射颜色。
128.在本实施例中，在确定每次折射采样点后，利用该折射采样点的法线向量，对目标珠宝模型当前点的折射环境球进行采样，从而获得当前点每次的折射采样颜色，然后通过当前点每次的折射采样颜色，获得当前点每次的折射颜色。
129.具体地，完整的循环折射采样流程为：
130.基于所述世界空间顶点坐标和所述当前点的首次折射采样方向，对所述法线贴图进行采样，获得所述目标珠宝模型预设折射采样次数中的首次折射采样点；
131.基于所述首次折射采样点的法线向量，对所述折射环境球进行采样，获得所述当前点的首次折射颜色；
132.基于所述首次折射采样点的法线向量和视角向量，计算所述当前点的下一次折射采样方向；
133.基于所述世界空间顶点坐标和所述当前点的下一次折射采样方向，对所述法线贴图进行采样，获取所述目标珠宝模型的下一次折射采样点；
134.基于所述下一次折射采样点的法线向量，对所述折射环境球进行采样，获得所述当前点下一次的折射颜色；
135.判断当前循环采样的次数(与目标珠宝模型采样点的总数量一一对应)是否达到所述预设折射采样次数；
136.若是，则停止循环。若否，则基于所述下一次折射采样点的法线向量和视角向量，计算所述当前点的下下一次折射采样方向；基于所述世界空间顶点坐标和所述当前点的下下一次折射采样方向，对所述法线贴图进行采样，获取所述目标珠宝模型的下下一次折射采样点；基于所述下下一次折射采样点的法线向量，对所述折射环境球进行采样，获得所述当前点下下一次的折射颜色；重复上述步骤，直至当前循环采样的次数达到所述预设折射采样次数。
137.在一个具体实施例中，在所述步骤s151基于每次所述折射采样点的法线向量，对所述目标珠宝模型的折射环境球进行采样，获得所述当前点每次的折射采样颜色之前，所述方法还包括以下步骤：
138.s180、计算所述目标珠宝模型中当前点在折射环境球中的折射采样率；
139.具体地，在片元着色器中使用brdf方程利用法线向量与视角向量的折射向量，求取目标珠宝模型当前点的折射采样率。在循环步骤过程中，折射采样率保持不变。
140.则所述步骤s151基于所述当前点每次的折射采样颜色，获得所述当前点每次的折射颜色，包括以下子步骤：
141.s1511、基于所述当前点每次的折射采样颜色和所述折射采样率，获得所述当前点每次的折射颜色。
142.在本实施例中，通过上述实施例中的法线向量对折射环境球进行采样，获得当前点每次的折射采样颜色，然后将当前点每次的折射采样颜色与当前点的折射采样率相乘，计算得到当前点每次的折射颜色。
143.s160、基于所述当前点的反射颜色和最终折射颜色，对所述目标珠宝模型进行渲染。
144.在结束循环步骤后，输出当前点的反射颜色和累加后的最终折射颜色，并基于反射颜色和最终折射颜色对目标珠宝模型进行渲染，输出渲染后的目标珠宝模型图像。
145.为更好地理解本发明实施例的基于webgl的珠宝渲染方法，现以目标珠宝模型为钻石模型为例，结合具体实施例来进行说明：
146.1.通过three.js搭建web端三维基础场景，包含相机、灯光、场景、背景、渲染器基础组件。
147.2.使用three.js加载建模工具导出的gltf格式钻石模型文件。
148.3.使用three.js提取钻石模型的法线信息存于纹理贴图，用于法线信息保存。
149.4.使用three.js创建shader材质，创建顶点着色器和片元着色器，顶点着色器使用基础材质。
150.5.自定义片元着色器，实现钻石渲染功能。
151.6.在片元着色器中使用brdf方程利用视角与法线的反射向量，求取钻石当前点的反射采样率。
152.7.在片元着色器中使用brdf方程利用视角与法线的折射向量，求取钻石当前点的折射采样率。
153.8.通过第6步中的反射向量进行反射环境球采样，计算当前点反射环境球的反射采样颜色，将反射采样颜色与当前点的反射采样率相乘，求取当前点的反射颜色。
154.9.通过当前点的顶点法线向量和当前点的视角向量计算当前点的首次折射采样向量，以确定首次折射采样方向，首次折射采样方向用于后续步骤的钻石折射采样。
155.10.获取片元着色器当前点的世界空间顶点坐标，该世界空间顶点坐标通过世界空间矩阵与当前点的局部空间顶点坐标相乘得到。
156.11.预设钻石折射采样次数，钻石的渲染细节是通过不断的折射光线采样得到，折射采样次数越多则钻石细节越丰富，钻石效果越好，当然带来的性能开销越大，可以取合适的钻石折射采样次数，以使渲染效果和性能开销能够达到相对平衡。
157.12.利用第10步获取到的世界空间顶点坐标，以及当前点的折射采样方向，通过对第3步获取到的法线贴图进行采样，得到新采样点的法线。
158.13.利用第12步得到新采样点的法线向量对折射环境球采样，获取新的折射采样
颜色，与第7步的折射采样率相乘，得到当前点每次的折射颜色。
159.14.累加第13步中获取到的折射颜色值，得到当前点的最终折射颜色。
160.15.利用新采样点计算钻石模型下一次的折射采样方向，用于第12步计算下一次采样点。判断当前循环次数是否达到上限，如果未达到上限则返回第12步继续计算下一次采样点，如果达到上限则退出循环，输出所有的钻石折射颜色和反射颜色，并对钻石模型进行渲染，输出渲染后的钻石模型。
161.通过执行上述步骤，实现对目标珠宝模型的折射环境球进行循环采样，以获得多次折射颜色，极大提高了webgl的目标珠宝模型渲染效果；另外，本发明基于webgl可以在任何浏览器快速打开，同时也可以嵌入小程序，用户点击链接即可体验逼真的3d珠宝产品效果，实现了跨端的3d珠宝产品快速展示，解决了商家快速引流、用户快速体验3d珠宝商品的问题。
162.本发明另一实施例提供了一种基于webgl的珠宝渲染装置100。请参阅图2，图2是本发明基于webgl的珠宝渲染装置100一实施例的结构示意图，在本实施例中，基于webgl的珠宝渲染装置100可以包括：
163.构建模块101，用于通过webgl构建目标珠宝模型的三维场景；
164.提取模块102，用于在所述三维场景下，加载所述目标珠宝模型并提取所述目标珠宝模型的法线信息；其中，所述法线信息包括法线向量；
165.反射颜色获取模块103，用于基于所述目标珠宝模型中当前点的反射向量，对所述目标珠宝模型的反射环境球进行采样，获得所述当前点的反射颜色；
166.确定模块104，用于基于所述当前点的法线向量和预设折射采样次数，确定所述当前点的每次折射采样方向和每次折射采样点；其中，所述当前点的首次折射采样方向由所述当前点的法线向量确定，每次所述折射采样点由对应的上一次折射采样方向确定；
167.折射颜色获取模块105，用于基于每次所述折射采样点，对所述目标珠宝模型的折射环境球进行循环采样，获得所述当前点每次的折射颜色，并累加所述当前点每次的折射颜色，以获得所述当前点的最终折射颜色；
168.渲染模块106，用于基于所述当前点的反射颜色和最终折射颜色，对所述目标珠宝模型进行渲染。
169.在某一个实施例中，基于webgl的珠宝渲染装置100还可以包括转换模块和判断模块；
170.所述转换模块，用于将所述当前点在所述目标珠宝模型坐标系下的局部空间顶点坐标，转换到所述三维场景坐标系下的世界空间顶点坐标；
171.所述确定模块104，包括：
172.折射采样方向确定模块，用于基于所述当前点的法线向量和视角向量，确定所述当前点的首次折射采样方向；
173.采样点确定模块，用于基于所述世界空间顶点坐标和所述当前点的首次折射采样方向，获得所述目标珠宝模型的首次折射采样点；
174.所述折射采样方向确定模块，还用于基于所述首次折射采样点的法线向量和视角向量，确定所述当前点的下一次折射采样方向；
175.所述采样点确定模块，还用于基于所述世界空间顶点坐标和所述当前点的下一次
折射采样方向，获取所述目标珠宝模型的下一次折射采样点；
176.所述判断模块，用于判断所述目标珠宝模型采样点的总数量是否超过所述预设折射采样次数；
177.若否，则由所述折射采样方向确定模块和所述采样点确定模块循环上述获取所述目标珠宝模型的每次折射采样点的步骤，直至所述判断模块判断所述目标珠宝模型采样点的总数量超过所述预设折射采样次数。
178.关于基于webgl的珠宝渲染装置100的具体限定可以参见上文中对于基于webgl的珠宝渲染方法的限定，在此不再赘述。上述基于图像识别技术的基于webgl的珠宝渲染装置100中的各个模块可全部或部分通过软件、硬件及其组合来实现。上述各模块可以硬件形式内嵌于或独立于计算机设备中的处理器中，也可以以软件形式存储于计算机设备中的存储器中，以便于处理器调用执行以上各个模块对应的操作。
179.相比于现有技术，本发明的有益效果在于：
180.本发明基于webgl的珠宝渲染方法，通过webgl构建目标珠宝模型的三维场景；在所述三维场景下，加载所述目标珠宝模型并提取所述目标珠宝模型的法线信息；其中，所述法线信息包括法线向量；基于所述目标珠宝模型中当前点的反射向量，对所述目标珠宝模型的反射环境球进行采样，获得所述当前点的反射颜色；基于所述当前点的法线向量和预设折射采样次数，确定所述当前点的每次折射采样方向和每次折射采样点；其中，所述当前点的首次折射采样方向由所述当前点的法线向量确定，每次所述折射采样点由对应的上一次折射采样方向确定；基于每次所述折射采样点，对所述目标珠宝模型的折射环境球进行循环采样，获得所述当前点每次的折射颜色，并累加所述当前点每次的折射颜色，以获得所述当前点的最终折射颜色；基于所述当前点的反射颜色和最终折射颜色，对所述目标珠宝模型进行渲染。本发明通过对目标珠宝模型的折射环境球进行循环采样，以获得多次折射颜色，极大提高了webgl的目标珠宝模型渲染效果；另外，本发明基于webgl可以在任何浏览器快速打开，同时也可以嵌入小程序，用户点击链接即可体验逼真的3d珠宝产品效果，实现了跨端的3d珠宝产品快速展示，解决了商家快速引流、用户快速体验3d珠宝商品的问题。相应地，本发明还提供基于webgl的珠宝渲染装置、终端设备及存储介质。
181.请参见图3，图3是本发明终端设备一实施例的结构框图，本发明实施例提供的终端设备20，包括处理器21、存储器22和存储在存储器22中且被配置为由处理器21执行的计算机程序，处理器21执行计算机程序时实现如上述基于webgl的珠宝渲染方法实施例中的步骤，例如图1中的步骤s110～s160；或者，处理器21执行计算机程序时实现上述各装置实施例中各模块的功能，例如构建模块101。
182.示例性的，计算机程序可以被分割成一个或多个模块，一个或者多个模块被存储在存储器22中，并由处理器21执行，以完成本发明。一个或多个模块可以是能够完成特定功能的一系列计算机程序指令段，该指令段用于描述计算机程序在终端设备20中的执行过程。例如，计算机程序可以被分割成构建模块101、提取模块102、反射颜色获取模块103、确定模块104、折射颜色获取模块105和渲染模块106，各模块具体功能如下：
183.构建模块101，用于通过webgl构建目标珠宝模型的三维场景；
184.提取模块102，用于在所述三维场景下，加载所述目标珠宝模型并提取所述目标珠宝模型的法线信息；其中，所述法线信息包括法线向量；
185.反射颜色获取模块103，用于基于所述目标珠宝模型中当前点的反射向量，对所述目标珠宝模型的反射环境球进行采样，获得所述当前点的反射颜色；
186.确定模块104，用于基于所述当前点的法线向量和预设折射采样次数，确定所述当前点的每次折射采样方向和每次折射采样点；其中，所述当前点的首次折射采样方向由所述当前点的法线向量确定，每次所述折射采样点由对应的上一次折射采样方向确定；
187.折射颜色获取模块105，用于基于每次所述折射采样点，对所述目标珠宝模型的折射环境球进行循环采样，获得所述当前点每次的折射颜色，并累加所述当前点每次的折射颜色，以获得所述当前点的最终折射颜色；
188.渲染模块106，用于基于所述当前点的反射颜色和最终折射颜色，对所述目标珠宝模型进行渲染。
189.终端设备20可以是桌上型计算机、笔记本、掌上电脑及云端服务器等计算设备。终端设备20可包括，但不仅限于，处理器21、存储器22。本领域技术人员可以理解，示意图仅仅是终端设备的示例，并不构成对终端设备20的限定，可以包括比图示更多或更少的部件，或者组合某些部件，或者不同的部件，例如终端设备20还可以包括输入输出设备、网络接入设备、总线等。
190.处理器21可以是中央处理单元(central processing unit，cpu)，还可以是其他通用处理器、数字信号处理器(digital signal processor，dsp)、专用集成电路(application specific integrated circuit，asic)、现成可编程门阵列(field-programmable gate array，fpga)或者其他可编程逻辑器件、分立门或者晶体管逻辑器件、分立硬件组件等。通用处理器可以是微处理器或者该处理器也可以是任何常规的处理器等，处理器21是终端设备20的控制中心，利用各种接口和线路连接整个终端设备20的各个部分。
191.存储器22可用于存储计算机程序和/或模块，处理器21通过运行或执行存储在存储器22内的计算机程序和/或模块，以及调用存储在存储器22内的数据，实现终端设备20的各种功能。存储器22可主要包括存储程序区和存储数据区，其中，存储程序区可存储操作系统、至少一个功能所需的应用程序(比如声音播放功能、图像播放功能等)等；存储数据区可存储根据手机的使用所创建的数据(比如音频数据、电话本等)等。此外，存储器22可以包括高速随机存取存储器，还可以包括非易失性存储器，例如硬盘、内存、插接式硬盘，智能存储卡(smart media card,smc)，安全数字(secure digital,sd)卡，闪存卡(flash card)、至少一个磁盘存储器件、闪存器件、或其他易失性固态存储器件。
192.其中，终端设备20集成的模块如果以软件功能单元的形式实现并作为独立的产品销售或使用时，可以存储在一个计算机可读取存储介质中。基于这样的理解，本发明实现上述实施例方法中的全部或部分流程，也可以通过计算机程序来指令相关的硬件来完成，的计算机程序可存储于一计算机可读存储介质中，该计算机程序在被处理器执行时，可实现上述各个方法实施例的步骤。其中，计算机程序包括计算机程序代码，计算机程序代码可以为源代码形式、对象代码形式、可执行文件或某些中间形式等。计算机可读介质可以包括：能够携带计算机程序代码的任何实体或装置、记录介质、u盘、移动硬盘、磁碟、光盘、计算机存储器、只读存储器(rom，read-only memory)、随机存取存储器(ram，random access memory)、电载波信号、电信信号以及软件分发介质等。
193.本领域普通技术人员可以理解实现上述实施例方法中的全部或部分流程，是可以通过计算机程序来指令相关的硬件来完成，的程序可存储于一计算机可读取存储介质中，该程序在执行时，可包括如上述各方法的实施例的流程。其中，的存储介质可为磁碟、光盘、只读存储记忆体(read-only memory，rom)或随机存储记忆体(random access memory，ram)等。
194.相应地，本发明实施例提供一种计算机可读存储介质，计算机可读存储介质包括存储的计算机程序，其中，在计算机程序运行时控制计算机可读存储介质所在设备执行如上述实施例的基于webgl的珠宝渲染方法中的步骤，例如图1中的步骤s110～s160。
195.以上所述是本发明的优选实施方式，应当指出，对于本技术领域的普通技术人员来说，在不脱离本发明原理的前提下，还可以做出若干改进和润饰，这些改进和润饰也视为本发明的保护范围。
技术特征：1.一种基于webgl的珠宝渲染方法，其特征在于，包括：通过webgl构建目标珠宝模型的三维场景；在所述三维场景下，加载所述目标珠宝模型并提取所述目标珠宝模型的法线信息；其中，所述法线信息包括法线向量；基于所述目标珠宝模型中当前点的反射向量，对所述目标珠宝模型的反射环境球进行采样，获得所述当前点的反射颜色；基于所述当前点的法线向量和预设折射采样次数，确定所述当前点的每次折射采样方向和每次折射采样点；其中，所述当前点的首次折射采样方向由所述当前点的法线向量确定，每次所述折射采样点由对应的上一次折射采样方向确定；基于每次所述折射采样点，对所述目标珠宝模型的折射环境球进行循环采样，获得所述当前点每次的折射颜色，并累加所述当前点每次的折射颜色，以获得所述当前点的最终折射颜色；基于所述当前点的反射颜色和最终折射颜色，对所述目标珠宝模型进行渲染。2.根据权利要求1所述的基于webgl的珠宝渲染方法，其特征在于，所述在所述基于所述当前点的法线向量和预设折射采样次数，确定所述当前点的每次折射采样方向和每次折射采样点之前，所述方法还包括：将所述当前点在所述目标珠宝模型坐标系下的局部空间顶点坐标，转换到所述三维场景坐标系下的世界空间顶点坐标；则所述基于所述当前点的法线向量和预设折射采样次数，确定所述当前点的每次折射采样方向和每次折射采样点，包括：基于所述当前点的法线向量和视角向量，确定所述当前点的首次折射采样方向；基于所述世界空间顶点坐标和所述当前点的首次折射采样方向，获得所述目标珠宝模型的首次折射采样点；基于所述首次折射采样点的法线向量和视角向量，确定所述当前点的下一次折射采样方向；基于所述世界空间顶点坐标和所述当前点的下一次折射采样方向，获取所述目标珠宝模型的下一次折射采样点；判断所述目标珠宝模型采样点的总数量是否超过所述预设折射采样次数；若否，则循环上述获取所述目标珠宝模型的每次折射采样点的步骤，直至判断所述目标珠宝模型采样点的总数量超过所述预设折射采样次数。3.根据权利要求2所述的基于webgl的珠宝渲染方法，其特征在于，在所述在所述三维场景下，加载所述目标珠宝模型并提取所述目标珠宝模型的法线信息之后，所述方法还包括：将所述法线信息存于纹理贴图之中，以获得法线贴图；则所述基于所述世界空间顶点坐标和所述当前点的首次折射采样方向，获得所述目标珠宝模型的首次折射采样点，包括：基于所述世界空间顶点坐标和所述当前点的首次折射采样方向，对所述法线贴图进行采样，获得所述目标珠宝模型的首次折射采样点；所述基于所述世界空间顶点坐标和所述当前点的下一次折射采样方向，获取所述目标
珠宝模型的下一次折射采样点，包括：基于所述世界空间顶点坐标和所述当前点的下一次折射采样方向，对所述法线贴图进行采样，获取所述目标珠宝模型的下一次折射采样点。4.根据权利要求2所述的基于webgl的珠宝渲染方法，其特征在于，所述基于每次所述折射采样点，对所述目标珠宝模型的折射环境球进行循环采样，获得所述当前点每次的折射颜色，包括：基于每次所述折射采样点的法线向量，对所述目标珠宝模型的折射环境球进行采样，获得所述当前点每次的折射采样颜色；基于所述当前点每次的折射采样颜色，获得所述当前点每次的折射颜色。5.根据权利要求4所述的基于webgl的珠宝渲染方法，其特征在于，在所述基于每次所述折射采样点的法线向量，对所述目标珠宝模型的折射环境球进行采样，获得所述当前点每次的折射采样颜色之前，所述方法还包括：计算所述目标珠宝模型中当前点在折射环境球中的折射采样率；则所述基于所述当前点每次的折射采样颜色，获得所述当前点每次的折射颜色，包括：基于所述当前点每次的折射采样颜色和所述折射采样率，获得所述当前点每次的折射颜色。6.根据权利要求1所述的基于webgl的珠宝渲染方法，其特征在于，在所述基于所述目标珠宝模型中当前点的反射向量，对所述目标珠宝模型的反射环境球进行采样，获得所述当前点的反射颜色之前，所述方法还包括：计算所述目标珠宝模型中当前点在所述反射环境球中的反射采样率；则所述基于所述目标珠宝模型中当前点的反射向量，对所述目标珠宝模型的反射环境球进行采样，获得所述当前点的反射颜色，包括：基于所述目标珠宝模型当前点的反射向量对所述反射环境球进行采样，获得所述当前点的反射采样颜色；基于所述当前点的反射采样颜色和所述反射采样率，获得所述当前点的反射颜色。7.一种基于webgl的珠宝渲染装置，其特征在于，包括：构建模块，用于通过webgl构建目标珠宝模型的三维场景；提取模块，用于在所述三维场景下，加载所述目标珠宝模型并提取所述目标珠宝模型的法线信息；其中，所述法线信息包括法线向量；反射颜色获取模块，用于基于所述目标珠宝模型中当前点的反射向量，对所述目标珠宝模型的反射环境球进行采样，获得所述当前点的反射颜色；确定模块，用于基于所述当前点的法线向量和预设折射采样次数，确定所述当前点的每次折射采样方向和每次折射采样点；其中，所述当前点的首次折射采样方向由所述当前点的法线向量确定，每次所述折射采样点由对应的上一次折射采样方向确定；折射颜色获取模块，用于基于每次所述折射采样点，对所述目标珠宝模型的折射环境球进行循环采样，获得所述当前点每次的折射颜色，并累加所述当前点每次的折射颜色，以获得所述当前点的最终折射颜色；渲染模块，用于基于所述当前点的反射颜色和最终折射颜色，对所述目标珠宝模型进行渲染。
8.根据权利要求7所述的基于webgl的珠宝渲染装置，其特征在于，还包括转换模块和判断模块；所述转换模块，用于将所述当前点在所述目标珠宝模型坐标系下的局部空间顶点坐标，转换到所述三维场景坐标系下的世界空间顶点坐标；所述确定模块，包括：折射采样方向确定模块，用于基于所述当前点的法线向量和视角向量，确定所述当前点的首次折射采样方向；采样点确定模块，用于基于所述世界空间顶点坐标和所述当前点的首次折射采样方向，获得所述目标珠宝模型的首次折射采样点；所述折射采样方向确定模块，还用于基于所述首次折射采样点的法线向量和视角向量，确定所述当前点的下一次折射采样方向；所述采样点确定模块，还用于基于所述世界空间顶点坐标和所述当前点的下一次折射采样方向，获取所述目标珠宝模型的下一次折射采样点；所述判断模块，用于判断所述目标珠宝模型采样点的总数量是否超过所述预设折射采样次数；若否，则由所述折射采样方向确定模块和所述采样点确定模块循环上述获取所述目标珠宝模型的每次折射采样点的步骤，直至所述判断模块判断所述目标珠宝模型采样点的总数量超过所述预设折射采样次数。9.一种终端设备，其特征在于，包括处理器、存储器和存储在所述存储器中且被配置为由所述处理器执行的计算机程序，所述处理器执行所述计算机程序时实现如权利要求1至6中任意一项所述的基于webgl的珠宝渲染方法。10.一种计算机可读存储介质，其特征在于，所述计算机可读存储介质包括存储的计算机程序，其中，在所述计算机程序运行时控制所述计算机可读存储介质所在设备执行如权利要求1至6中任意一项所述的基于webgl的珠宝渲染方法。
技术总结本发明公开了一种基于WEBGL的珠宝渲染方法、装置、终端设备及存储介质，方法包括：通过WEBGL构建目标珠宝模型的三维场景；加载目标珠宝模型并提取其法线信息；法线信息包括法线向量；基于目标珠宝模型中当前点反射向量，对反射环境球进行采样，获得当前点反射颜色；基于法线向量和预设折射采样次数，确定当前点每次折射采样方向和每次折射采样点；基于每次折射采样点对折射环境球进行循环采样，获得当前点每次折射颜色，累加当前点每次折射颜色，获得当前点最终折射颜色；基于当前点反射颜色和最终折射颜色，对目标珠宝模型进行渲染。本发明获得多次折射颜色，极大提高了WEBGL的目标珠宝模型渲染效果，并实现了跨端的3D珠宝产品快速展示。快速展示。快速展示。
技术研发人员：植敬祖 李光平 涂玲 李云飞
受保护的技术使用者：广州京腾科技有限公司
技术研发日：2022.06.08
技术公布日：2022/11/1
