三维图形渲染的方法和装置、电子设备和存储介质制造方法及图纸

本申请提供了一种三维图形渲染的方法和装置、电子设备和存储介质，其中，该方法包括：利用目标三维封装库内的第一函数方法，配置场景信息，其中，目标三维封装库是使用JavaScript对目标绘图标准进行封装后得到的；获取已创建的初始几何体模型和获取渲染关联信息；将初始几何体模型输入场景信息中，结合渲染关联信息，渲染出目标几何体模型。通过本申请，解决了相关技术中存在的开发成本高、效率低和周期较长的问题。率低和周期较长的问题。率低和周期较长的问题。

【技术实现步骤摘要】
三维图形渲染的方法和装置、电子设备和存储介质


[0001]本申请涉及计算机
，尤其涉及一种三维图形渲染的方法和装置、电子设备和存储介质。

技术介绍

[0002]目前，WebGL(Web Graphics Library)是一种3D绘图标准，这种绘图技术标准允许把JavaScript和OpenGL ES 2.0结合在一起，通过增加OpenGL ES 2.0的一个JavaScript绑定，WebGL可以为HTML5Canvas提供硬件3D加速渲染，这样Web开发人员就可以借助系统显卡来在浏览器里更流畅地展示3D场景和模型了，还能创建复杂的导航和数据视觉化。显然，WebGL技术标准免去了开发网页专用渲染插件的麻烦，可被用于创建具有复杂3D结构的网站页面，甚至可以用来设计3D网页游戏等等。
[0003]现有的WebGL暴露的接口较为底层，需要熟悉计算机图形学相关知识体系才能从事相关开发，使用难度非常高，而且开发周期较长；现有的基于WebGL的三维引擎封装度非常低，无法满足前端开发人员开发三维功能的需求。
[0004]因此，现有技术的缺点包括开发成本高、效率低和周期较长等。

技术实现思路

[0005]本申请提供了一种三维图形渲染的方法和装置、电子设备和存储介质，以至少解决相关技术中存在开发成本高、效率低和周期较长的问题。
[0006]根据本申请实施例的一个方面，提供了一种三维图形渲染的方法，其特征在于，所述方法包括：
[0007]利用目标三维封装库内的第一函数方法，配置场景信息，其中，所述目标三维封装库是使用JavaScript对目标绘图标准进行封装后得到的；
[0008]获取已创建的初始几何体模型和获取渲染关联信息；
[0009]将所述初始几何体模型输入所述场景信息中，结合所述渲染关联信息，渲染出目标几何体模型。
[0010]根据本申请实施例的另一个方面，还提供了一种三维图形渲染的装置，该装置包括：
[0011]配置模块，用于利用目标三维封装库内的第一函数方法，配置场景信息，其中，所述目标三维封装库是使用JavaScript对目标绘图标准进行封装后得到的；
[0012]获取模块，用于获取已创建的初始几何体模型和获取渲染关联信息；
[0013]渲染模块，用于将所述初始几何体模型输入所述场景信息中，结合所述渲染关联信息，渲染出目标几何体模型。
[0014]可选地，获取模块，包括：
[0015]调用单元，用于调用目标绘图标准中的多个组件参数函数；
[0016]生成单元，用于根据所述组件参数函数，生成所述初始几何体模型。
[0017]可选地，获取模块，包括：
[0018]第一创建单元，用于利用所述目标三维封装库内的第二函数方法创建材质元素；
[0019]第二创建单元，用于利用所述目标三维封装库内的第三函数方法创建着色器；
[0020]第三创建单元，用于利用所述目标三维封装库内的第四函数方法创建渲染器；
[0021]第一设置单元，用于将所述着色器、所述材质元素以及所述渲染器作为所述渲染关联信息。
[0022]可选地，获取模块，还包括：
[0023]第四创建单元，用于利用所述目标三维封装库内的第五函数方法创建加载器；
[0024]读取单元，用于读取由建模软件已构建好的所述初始几何体模型；
[0025]第一加载单元，用于利用所述加载器加载出所述初始几何体模型。
[0026]可选地，获取模块，还包括：
[0027]第二加载单元，用于利用所述加载器加载所述初始几何体模型内的模型文件；
[0028]转换单元，用于通过JSON转换函数将所述模型文件转换为JSON文件；
[0029]解析单元，用于解析所述JSON文件，得到JSON文件内包含的渲染待用参数；
[0030]第五创建单元，用于利用所述目标三维封装库内的第四函数方法创建渲染器；
[0031]第二设置单元，用于将所述渲染待用参数和所述渲染器作为所述渲染关联信息。
[0032]可选地，该装置还包括：
[0033]创建模块，用于在所述将所述初始几何体模型输入所述场景信息中，结合所述渲染关联信息，渲染出目标几何体模型之前，根据所述场景信息，创建摄像元素和光源元素。
[0034]可选地，渲染模块包括：
[0035]调整单元，用于将所述初始几何体模型加入所述场景信息内，利用所述摄像元素和所述光源元素对所述初始几何体模型进行角度和光照的调整，得到中间几何体模型；
[0036]渲染单元，用于利用渲染器渲染所述中间几何体模型，得到所述目标几何体模型。
[0037]根据本申请实施例的又一个方面，还提供了一种电子设备，包括处理器、通信接口、存储器和通信总线，其中，处理器、通信接口和存储器通过通信总线完成相互间的通信；其中，存储器，用于存储计算机程序；处理器，用于通过运行所述存储器上所存储的所述计算机程序来执行上述任一实施例中的方法步骤。
[0038]根据本申请实施例的又一个方面，还提供了一种计算机可读的存储介质，该存储介质中存储有计算机程序，其中，该计算机程序被设置为运行时执行上述任一实施例中的方法步骤。
[0039]在本申请实施例中，通过利用目标三维封装库内的第一函数方法，配置场景信息，其中，目标三维封装库是使用JavaScript对目标绘图标准进行封装后得到的；获取已创建的初始几何体模型和获取渲染关联信息；将初始几何体模型输入场景信息中，结合渲染关联信息，渲染出目标几何体模型。由于本申请实施例使用了JavaScript对目标绘制标准进行了一遍封装，得到目标三维封装库，所以利用目标三维封装库去使用WebGL来渲染三维模型，不需要进行C语言等相关的知识的学习，只需要使用JavaScript语言就可以进行3D开发，使本就有JavaScript基础的前端开发人员能够快速入门，快速上手，快速的把三维模型数据在页面上呈现出来，降低开发难度，并且只需要更少的代码就可以实现三维模型的渲染，节省了研发周期，提高了工作效率，进而解决了相关技术中存在的开发成本高、效率低
和周期较长的问题。
附图说明
[0040]此处的附图被并入说明书中并构成本说明书的一部分，示出了符合本专利技术的实施例，并与说明书一起用于解释本专利技术的原理。
[0041]为了更清楚地说明本专利技术实施例或现有技术中的技术方案，下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍，显而易见地，对于本领域普通技术人员而言，在不付出创造性劳动性的前提下，还可以根据这些附图获得其他的附图。
[0042]图1是根据本申请实施例的一种可选的三维图形渲染的方法的流程示意图；
[0043]图2是根据本申请实施例的一种可选的WebGL绘制流程图；
[0044]图3是根据本申请实施例的一种可选的三维图形渲染的方法的完整流程示意图；
[0045]图4本文档来自技高网...

【技术保护点】

【技术特征摘要】
1.一种三维图形渲染的方法，其特征在于，所述方法包括：利用目标三维封装库内的第一函数方法，配置场景信息，其中，所述目标三维封装库是使用JavaScript对目标绘图标准进行封装后得到的；获取已创建的初始几何体模型和获取渲染关联信息；将所述初始几何体模型输入所述场景信息中，结合所述渲染关联信息，渲染出目标几何体模型。2.根据权利要求1所述的方法，其特征在于，所述获取已创建的初始几何体模型，包括：调用所述目标绘图标准中的多个组件参数函数；根据所述组件参数函数，生成所述初始几何体模型。3.根据权利要求2所述的方法，其特征在于，所述获取渲染关联信息，包括：利用所述目标三维封装库内的第二函数方法创建材质元素；利用所述目标三维封装库内的第三函数方法创建着色器；利用所述目标三维封装库内的第四函数方法创建渲染器；将所述着色器、所述材质元素以及所述渲染器作为所述渲染关联信息。4.根据权利要求1所述的方法，其特征在于，所述获取已创建的初始几何体模型，还包括：利用所述目标三维封装库内的第五函数方法创建加载器；读取由建模软件已构建好的所述初始几何体模型；利用所述加载器加载出所述初始几何体模型。5.根据权利要求4所述的方法，其特征在于，所述获取渲染关联信息，还包括：利用所述加载器加载所述初始几何体模型内的模型文件；通过JSON转换函数将所述模型文件转换为JSON文件；解析所述JSON文件，得到JSON文件内包含的渲染待用参数；利用所述目标三维封装库内的第四函数方法创建渲染器；将所述渲染待用参数和所述渲染器作为所述渲染关联信息。6.根据...

【专利技术属性】
技术研发人员：贺圣茗，
申请(专利权)人：圣名科技广州有限责任公司，
类型：发明
国别省市：