一种WebGL图形渲染引擎的建立方法与流程

本发明涉及图形处理技术领域，特别涉及一种webgl图形渲染引擎的建立方法。

背景技术：

webgl(webgraphicslibrary)是一种3d绘图标准，这种绘图技术标准把javascript和opengles2.0结合在一起，通过增加opengles2.0的一个javascript绑定，可以为html5canvas提供硬件3d加速渲染，提供了基于浏览器的无插件三维渲染跨平台方案，可被用于创建具有复杂3d结构的网站页面。

webgl接口较底层，需要熟悉计算机图形学相关知识体系才能从事相关开发，使用难度非常高，并且直接使用webgl开发三维功能周期较长。webgl标准推出并得到大多数浏览器支持的时间较短，目前国内市场基于webgl的商业三维引擎封装度非常低，无法满足前端开发人员开发三维功能的需求。

技术实现要素：

本发明的目的旨在至少解决所述技术缺陷之一。

为此，本发明的目的在于提出一种webgl图形渲染引擎的建立方法。

为了实现上述目的，本发明的实施例提供一种webgl图形渲染引擎的建立方法，包括如下步骤：

步骤s1，基于webgl标准，建立evm图形渲染引擎的底层接口模块，包括：

封装引擎循环框架，包括事件更新和图像帧更新；

封装图形数学库模块，包括向量及计算、欧拉角及计算、四元数及计算、欧拉角转四元数、四元数转欧拉角、射线拾取计算、模型包围盒计算、颜色计算和插值计算；

封装基本物体属性模块，包括三角面、线段的核心几何体封装，以支持正方向、球体、导入的自定义模型；

步骤s2，对所述底层接口模块进行分类整理和再封装，形成多个功能模块，其中，所述多个功能模块包括：相机模块、相机控制模块、灯光模块、图片精灵模块、材质模块、物理模块、粒子发射器模块、模型数据加载模块、辅助物体模块、事件绑定模块和消息传递模块；

步骤s3，根据建立的多个功能模块，对预设的常见业务进行封装整合，建立evm图形渲染引擎，提供标准api接口，供业务层使用。

进一步，在所述步骤s1中，基于webgl标准，对webgl接口进行封装。

进一步，所述多个功能模块包括：着色器、灯光控制模块、相机控制模块、场景控制模块、物理模块、粒子模块、事件绑定模块和消息传递模块。

进一步，在所述步骤s3中，预设的常见业务包括：流程制定业务、物体制定业务和报表图表业务。

进一步，所述步骤s2进一步包括如下步骤：

封装相机模块，包括透视相机、正交相机、渲染到cube纹理相机；

封装相机控制模块，包括飞行控制和注视旋转控制；

封装灯光模块，包括环境光源、点光源、方向光源、聚光灯、穹型光源等，并实现灯光的阴影计算；

封装图片精灵模块，实现图片精灵的相关特性；

封装材质模块，包括点材质、线材质、基础材质、标准材质、深度材质、法线材质、phong材质、兰伯特材质、自定义shader材质，封装透明、半透明渲染设置；

封装物理模块，实现模型碰撞检测等效果；

封装粒子发射器模块、实现三维粒子特效功能；

封装模型数据加载模块，包括obj格式、collada格式；

封装辅助物体模块，包括位置、包围盒、坐标轴、法线等辅助物体方便功能开发调试；

封装事件绑定模块和消息传递模块，实现模块间交互机制。

进一步，所述步骤s3进一步包括如下步骤：

建立evm图形渲染引擎，所述evm图形渲染引擎提供三维场景初始化、模型加载、灯光创建及设置、材质创建及设置，以实现快速搭建web无插件三维实时渲染方案，以及提供client/server架构三维引擎的所有标准接口。

本发明提供的evm-图形渲染引擎基于webgl标准进行开发，对底层图形硬件接口进行完整封装，生成一套完整的webgl图形渲染引擎，比直接使用webgl开发降低了开发门槛，前端开发工程师通过培训能快速的使用evm-图形渲染引擎api进行页面三维功能的开发。并且，evm-图形渲染引擎还面向gis显示，事件绑定，效果展现等功能进行业务层面封装,对外提供标准api，供业务层使用。

根据本发明实施例的webgl图形渲染引擎的建立方法，具有以下有益效果：

(1)evm-图形渲染引擎基于webgl原生接口进行开发，在渲染效率和性能上和同类产品相比有显著提高。

(2)evm-图形渲染引擎封装了底层渲染硬件接口，区分基础功能模块，提供丰富api。

(3)evm-图形库封装了业务层接口，同时提供详尽功能文档，即使没有丰富底层硬件知识也可以做上层业务逻辑开发。evm-图形渲染引擎使用方便，层次清晰，接口明确，文档方便可查，方便广大开发者进行二次开发和功能定制。

本发明附加的方面和优点将在下面的描述中部分给出，部分将从下面的描述中变得明显，或通过本发明的实践了解到。

附图说明

本发明的上述和/或附加的方面和优点从结合下面附图对实施例的描述中将变得明显和容易理解，其中：

图1为根据本发明实施例的webgl图形渲染引擎的建立方法的流程图；

图2为根据本发明实施例的webgl图形渲染引擎的建立方法的示意图。

具体实施方式

下面详细描述本发明的实施例，所述实施例的示例在附图中示出，其中自始至终相同或类似的标号表示相同或类似的元件或具有相同或类似功能的元件。下面通过参考附图描述的实施例是示例性的，旨在用于解释本发明，而不能理解为对本发明的限制。

本发明实施了提供一种webgl图形渲染引擎的建立方法，该引擎可以提供api封装接口使用。

如图1所示，本发明实施例的webgl图形渲染引擎的建立方法，包括如下步骤：

步骤s1，基于webgl标准，建立evm图形渲染的底层接口模块。

在本步骤中，基于webgl标准，对webgl接口进行封装，形成evm图形渲染引擎的底层接口模块。具体接口封装见api文档及代码清单。

具体地，封装引擎循环框架，包括事件更新和图像帧更新等。封装图形数学库模块，包括向量及计算、欧拉角及计算、四元数及计算、欧拉角转四元数、四元数转欧拉角、射线拾取计算、模型包围盒计算、颜色计算、多种方式的插值计算等。封装基本物体属性模块，包括三角面、线段等核心几何体封装，以支持正方向、球体、导入的自定义模型等。

步骤s2，对底层接口模块进行分类整理和再封装，形成多个功能模块。

在本发明的一个实施例中，参考图2，多个功能模块包括：着色器、灯光控制模块、相机控制模块、场景控制模块、物理模块、粒子模块、事件绑定模块和消息传递模块等。使evm图形渲染引擎完整可用，功能模块清晰友好。

具体地，封装相机模块，包括透视相机、正交相机、渲染到cube纹理相机。封装相机控制模块，包括飞行控制和注视旋转控制等。封装灯光模块，包括环境光源、点光源、方向光源、聚光灯、穹型光源等，并实现灯光的阴影计算。封装图片精灵模块，实现图片精灵的相关特性。封装材质模块，包括点材质、线材质、基础材质、标准材质、深度材质、法线材质、phong材质、兰伯特材质、自定义shader材质，封装透明、半透明渲染设置等。

封装物理模块，实现模型碰撞检测等效果。封装粒子发射器模块、实现三维粒子特效功能。封装模型数据加载模块，包括obj格式、collada格式等。封装辅助物体模块，包括位置、包围盒、坐标轴、法线等辅助物体方便功能开发调试。封装事件绑定模块和消息传递模块，实现模块间交互机制。

步骤s3，根据建立的多个功能模块，对预设的常见业务进行封装整合，建立evm图形渲染引擎，提供标准api接口，供业务层使用。

其中，预设的常见业务包括：流程制定业务、物体制定业务和报表图表业务。详见api接口文档。

evm图形渲染引擎提供详细的api接口和丰富的手册和文档，降低开发人员学习和二次开发的技术成本。

具体地，evm图形渲染引擎提供了三维场景初始化、模型加载、灯光创建及设置、材质创建及设置等功能模块，实现了快速搭建web无插件三维实时渲染方案。evm图形渲染引擎具有丰富方便的接口，提供了传统client/server架构三维引擎的所有标准接口，并且使用高效的图形算法，让开发人员在开发三维功能开发时，不需要额外担心图形渲染的性能问题。

本发明提供的evm-图形渲染引擎基于webgl标准进行开发，对底层图形硬件接口进行完整封装，生成一套完整的webgl图形渲染引擎，比直接使用webgl开发降低了开发门槛，前端开发工程师通过培训能快速的使用evm-图形渲染引擎api进行页面三维功能的开发。并且，evm-图形渲染引擎还面向gis显示，事件绑定，效果展现等功能进行业务层面封装,对外提供标准api，供业务层使用。

根据本发明实施例的webgl图形渲染引擎的建立方法，具有以下有益效果：

(1)evm-图形渲染引擎基于webgl原生接口进行开发，在渲染效率和性能上和同类产品相比有显著提高。

(2)evm-图形渲染引擎封装了底层渲染硬件接口，区分基础功能模块，提供丰富api。

(3)evm-图形库封装了业务层接口，同时提供详尽功能文档，即使没有丰富底层硬件知识也可以做上层业务逻辑开发。evm-图形渲染引擎使用方便，层次清晰，接口明确，文档方便可查，方便广大开发者进行二次开发和功能定制。

在本说明书的描述中，参考术语“一个实施例”、“一些实施例”、“示例”、“具体示例”、或“一些示例”等的描述意指结合该实施例或示例描述的具体特征、结构、材料或者特点包含于本发明的至少一个实施例或示例中。在本说明书中，对上述术语的示意性表述不一定指的是相同的实施例或示例。而且，描述的具体特征、结构、材料或者特点可以在任何的一个或多个实施例或示例中以合适的方式结合。

尽管上面已经示出和描述了本发明的实施例，可以理解的是，上述实施例是示例性的，不能理解为对本发明的限制，本领域的普通技术人员在不脱离本发明的原理和宗旨的情况下在本发明的范围内可以对上述实施例进行变化、修改、替换和变型。本发明的范围由所附权利要求极其等同限定。