一种可编辑的网页三维几何造型渲染方法

专利名称：一种可编辑的网页三维几何造型渲染方法
技术领域：
本发明属于计算机图形处理技术领域，涉及网页三维(Web3D)几何造型渲染技术，尤其是一种Web富客户端的三维几何造型渲染方法，可应用于动漫行业。
背景技术：
Web3D是一项结合三维图形技术与浏览器/服务器体系架构(B/S)技术的综合技 术。其技术大背景涉及到三维图形显示技术与Web应用程序技术。主流的三维图像显示技 术即在计算机上，将在三维数据空间建立的物体数据或几何模型转换成模拟真实物外观的 二维投影并显示的技术，主要涉及如下主要流程在数学空间建立三维几何体的几何模型 (图元数据)、投影变换、视口变换、片断操作、显示转换为像素数据的二维投影数据。B/S技 术基于浏览器/服务器体系架构，在客户端(浏览器端)主要关注的是对从服务器传输而 来的、符合一定传输协议标准的数据进行解析，提取出浏览器应用程序能识别的信息，并建 立数据结构显示或处理这些信息。近年来由于富客户端技术的发展，JavaScript语言在B/ S客户端应用程序中发展迅速。JavaScript语言的实现依赖于浏览器引擎对JavaScript 语言的底层支持，比如WebKit浏览器引擎就使用JavaScriptCore模块完成这一功能，否则 JavaScript语言无法在浏览器或其它B/S应用程序中调用操作系统中其它模块的功能接现有的Web3D技术主要有两种实现方案以解析Web3D数据交换协议为核心的数 据交换技术方案和Web ES技术方案。两种Web3D技术方案的基本处理过程相同，如图1所 示在显示三维图形时，1)三维图形信息从服务器端以文本格式发送到客户端，2)客户端 通过解析三维图形信息文本获取三维图形数据，3)将经解析后的三维图形数据交给三维渲 染程序(渲染引擎或基于渲染管线的图形库)，4)将经三维渲染程序处理后的三维图形显 示在浏览器视图中。在第一种技术方案中，数据传输协议通常建立在标记语言之上，此种交换协议 (如X3D、VRML)定义了三维几何造型在数据传输时的表示方式。客户端将此种交换协议解 析为底层渲染引擎能够识别的数据，并由底层渲染引擎将图形渲染在浏览器中。而在在第 二种技术方案中，底层渲染程序的指令被直接定义为脚本语言API，数据传输过程中直接传 输脚本语言指令。将范围缩小到实体造型方面，对于面向动漫行业的领域来说，以上两种技术在易 用性与灵活性的平衡，渲染可编辑的三维几何造型数据的方式和效率上都存在着问题。修 改近似的规则几何体的顶点制作复杂几何造型是现今三维动漫设计的常用方式。使用第一 种技术方案，用户修改规则几何体的方式仅限于修改定义中的基本参数，因此无法实现顶 点粒度几何造型顶点编辑。如果使用复杂图形节点表示规则几何体数据，如使用四边形面 表示立方体，进而实现编辑功能，复杂度将会非常巨大。并且由于此种方式在编辑过程中需 要经过编辑、数据重解析、渲染引擎中几何造型对象查找与更新、渲染四个步骤，开销也较 大。
而使用Web ES方案存在着如下两个问题第一个问题是现阶段并没有一个技术 方案公开其底层技术实现方案，比如03D的使用C++编写的03D JavaScript API和03D CoreSoftware,；第二个问题是现阶段公开的Web ES方案也没有提出能适应动漫行业需求 的可修改渲染方案，03D的基本几何造型只提供了改变几何造型大小的操作(比如改变立 方体的长、宽、高)和一个矩阵操作接口用于同时操作几何造型的所有顶点，因此无法实现 顶点粒度的几何造型编辑。网页(Web)页面渲染方式从发明到现在已经发生了巨大的变革。网页三维 (Web3D)技术的提出将对未来三维动漫行业的发展起到巨大的推动作用。但面向动漫行 业的Web3D渲染不仅需要解决三维几何数据的显示问题，还需解决三维数据的可编辑性问题。

发明内容
本发明的目的在于提供一种可进行顶点粒度编辑的Web3D几何造型渲染方法。 本发明在使用基于场景树的渲染引擎，解析数据交换协议实现Web3D的基础上，通过解析 图形节点中的几何造型，使用渲染引擎几何造型工场生成几何造型对象，通过插件扩展 JavaScript底层API接口实现可编辑的三维几何造型渲染。本发明在实现顶点粒度可编辑 的Web3D几何造型渲染的基础上，结合了两种基本Web3D渲染思路，提高了几何造型重绘制 的效率。本发明技术方案如下一种可编辑的网页三维几何造型渲染方法，包括以下步骤1.客户端接收来自于服务器的X3D格式的数据交换文本。2.解析数据交换文本中X3D根节点(Root)，创建与之对应的渲染引擎场景树节点 作为场景树根节点。3.如果数据交换文本中出现组节点(Group)，创建与之对应的渲染引擎场景树节
点o4.如果数据交换文本中出现空间坐标变换节点(Transform)，创建与之对应的渲 染引擎场景树节点，并读取空间坐标变换节点中的变换参数，在此场景树中生成对应的几 何造型变换矩阵。5.如果数据交换文本中出现图形节点(Shape)，创建与之对应的渲染引擎场景树 节点作为场景树叶节点。6.解析图形节点中的几何造型节点。如果为简单几何造型节点则使用渲染引擎几 何造型工场依照其属性中的参数生成几何造型对象，如果为复杂几何造型节点则生成不包 含几何数据的几何造型对象；再将复杂几何造型节点及其子节点中的数据读取到几何造型 对象中。几何造型对象使用OpenGL VB0(Vertex Buffer Object)作为数据存储区。解析几何造型节点流程分为解析简单几何造型节点和解析复杂几何造型节点，解 析流程分别如下6. 1解析简单几何造型节点6. 1. 1将简单几何造型节点的节点名(几何造型名)、节点Id、几何造型参数传入 准备好的几何图形工场类的几何造型生成接口中。
6. 1. 2几何图形工场类为事先准备的几何造型对象分配顶点数据。视图形为平面 或者三维，将顶点向量维数(size)解释为二维或者三维，存入几何造型对象中。计算顶点 数量(n)，将顶点向量的数量存入几何造型对象中。即时生成几何造型全部顶点，将顶点数 据存入几何造型对象的顶点缓存区中。统计顶点数据大小(b)单位为字节，将大小信息存 入几何造型对象中。6. 1. 3几何图形工场类为事先准备的几何造型对象分配颜色参数。视颜色参数为 RGB色或RGBA色，本次默认使用RGBA色，将颜色向量维度(size)解释为三维或者四维。工 场类的几何图形生成接口将颜色向量维度存放在几何造型对象中。计算颜色向量数(与顶 点相同为n)存入几何造型对象中。即时生成几何造型顶点向量对应的全部颜色向量，将颜 色数据存入几何造型对象颜色缓冲区中。计算颜色颜色数据大小(b)单位为字节，将大小 信息存入几何造型对象中。6. 1. 4几何图形工场类为事先准备的几何造型对象分配法线参数。法线参数为三 维向量。工场类的几何图形接口将法线向量数量(n)存放在几何造型对象中。即时生成几 何造型顶点向量对应的的全部法线向量，存入几何造型对象中。计算法线数据大小(b)单 位为字节，将法线数据大小信息存入几何造型对象中。6. 1. 5几何图形工场类为事先准备的几何造型对象分配雾坐标参数。雾坐标参数 为单值。工场类的几何图形接口将雾坐标数量(n)存放在几何造型对象中。即时生成几何 造型顶点向量对应的全部雾坐标，存入几何造型对象中。计算雾坐标数据大小(b)单位为 字节，将雾坐标大小信息存入几何造型对象中。6. 1.6几何图形工场类为事先准备的几何造型对象分配纹理坐标参数。纹理坐标 使用三维向量表示纹理坐标(s、t、r)，其中r = 0，表示默认使用二维纹理。将纹理坐标数 量存放在几何造型对象中。即时生成几何造型顶点向量对应的全部纹理坐标值，存入几何 造型对象中。计算纹理坐标数据大小(b)单位为字节，将纹理坐标大小信息存入几何造型 对象中。6. 1. 7几何图形工场类为事先准备的几何造型对象分配索引。视基本图形不同，构 成几何造型的顶点解释成不同类型多边形，索引表示几何造型顶点构成多边形的序列。将 索引数量、多边形绘制方式、每个多边形单元的顶点数存入几何造型对象。计算索引数据大 小(b)单位为字节，将大小信息存入几何造型对象中。6. 2解析复杂几何造型节点6.2.1生成未分配几何造型数据的几何造型对象。6. 2. 2读取复杂结合节点中存储的顶点数据、节点名，将顶点数存入几何造型对象 中。使用解析器将顶点数据、顶点向量维度、顶点个数、顶点数据大小(以字节为单位)存 入几何造型对象中。按照复杂几何造型节点名解释几何造型顶点索引，将索引、多边形绘制 方式、索引个数、每个多边形单元的顶点数、索引数据大小存入几何造型对象中。6. 2. 2如果存在颜色节点(Color)，则读取颜色数据、节点名，并将颜色数据存入 几何造型对象中。根据颜色节点名将颜色节点数据解释为RGB或RGBA。将颜色向量解释方 式、颜色向量数、颜色数据大小存入几何造型对象。6. 2. 3如果存在法线节点(Normal)，则读取法线数据，并将法线数据存入几何造 型对象中。同时解析并存入几何造型对象的数据还包括法线向量个数、法线数据大小。
7
6. 2. 4如果存在纹理坐标节点(TexCoord)，则读取纹理坐标数据，存入几何造型 对象中。同时存入几何造型对象的数据还包括纹理坐标解释方式、纹理坐标个数、纹理数据 大小。7.解析图形节点中的外观节点(Appearance)，读取外观数据中光照数据，并存入 几何造型对象中。8.完成步骤5以后，将解析完成后的几何造型节点加入到步骤3中生成的场景树 节点中。并将该树节点添加到场景树叶节点键值对中。如果解析过程中存在步骤2中生成 的场景树节点，则将场景树节点加入到步骤2中生成的节点中。如果组节点包含其余图形 节点重复步骤3、4、5、6、7。如果组节点包含子组节点重复步骤2、3、4、5、6、7。直到所有组 节点包含子节点解析完成。9.完成步骤8后将生成的子树加入到场景树根节点中。如果还有未解析组节点， 则重复步骤2、3、4、5、6、7、8，直到交换协议所有节点解析完成。10.渲染步骤9中生成的场景树。将从场景树根节点到场景树叶节点中的几何变 换矩阵连续相乘，得到最终几何变矩阵。将几何变换矩阵与OpenGL的ModelView矩阵相乘。 将存放在场景树叶节点下的几何造型对象中的几何造型数据通过OpenGL渲染管线指令发 送到OpenGL渲染几何造型。对根节点到每个叶节点的分支做同样操作。如果用户使用JavaScript脚本语言，编辑场景中的某个几何造型对象，如图2所 示，需如下步骤11.使用JavaScript脚本语言，生成脚本语言插件对象。12.如果用户需要读取几何造型对象，则须指定几何造型对象的Id值，访问数据 区，调用脚本语言插件对象的几何造型访问方法。调用该方法系统须经过如下步骤12. 1在场景树叶节点键值对中收索指定Id值对应的几何造型对象。如果不存在 此对象则返回错误信息。如果存在几何造型对象则访问几何造型对象的几何造型数据访问 接口。12. 2调用几何造型对象数据访问方法，查找需访问的几何数据大小信息，如果需 查找的数据大小为零，则返回空数据。如果数据大小不为零，则读取数据区数据值，将拷贝 的数据值返回到脚本语言中。本方法使用OpenGLMapBuffer方法作为数据访问方法。13.如果用户需编辑几何造型对象，则需指定几何造型对象Id值、访问数据区、新 数据值，调用脚本语言插件对象的几何造型编辑方法。调用该方法系统需经过如下步骤13. 1在场景树叶节点键值对中收索指定Id值对应的几何造型对象。如果不存在 此对象则返回错误信息。如果存在几何造型对象则访问几何造型对象的几何造型数据编辑 接口。13. 2调用几何造型对象的数据编辑接口。查找需编辑的几何数据，如果需查找的 数据区大小为零则不能编辑。如果查找数据区非零，但不等于新数据值的数据总大小(数 据在内存中的字节数)则不允许修改原数据。如果查找数据区非零，且等于新数据值的数 据总大小则将数据区更新为新数据。13. 3在完成几何造型对象数据修改后，通过JavaScript指令命令系统重新渲染 整个场景树。使用JavaScript脚本语言机制，在并不需要经过重新解析X3D数据、查找树(或者重新组织整个场景树)两个步骤，在解决复杂几何图形造型编辑问题时大大减小了重渲 染数据的时间开销。使用本方法，脚本用户可以轻易利用简单几何造型节点实现斜三角锥、切错变换 立方体、压扁的球等在基本几何图形的基础上变形产生的几何形体，而不需要设计复杂的 自定义X3D节点或用户自定义节点。对于具有三维编程经验的脚本编程人员，可以使用脚 本接口实现具有技巧性的几何造型。同时该方法保持了直接使用X3D交换格式渲染场景简 单易用这一特点，非脚本用户或不需要顶点级数据修改的情况下，则只需使用解析X3D数 据交换协议渲染几何造型的功能。


图1表示了使用数据交换协议的Web3D技术的几何造型渲染流程图2为本方法处理流程图，表示了使用本方法编辑和重渲染几何造型对象的流 程。图3为本方法软件原理图，表示了为实现该方法而设计的整个软件的组织架构， 和软件层次关系。图4为渲染引擎几何造型类的内存区示意图，表示渲染引擎几何造型对象的内存 区结构图。其中渲染引擎几何造型对象位于CPU内存区，VB0对象位于OpenGL内存区中。图5为渲染插件运行时层次结构图，详细展示了本方法运行时软件的层次结构。
具体实施例方式本发明的目的在于提供一种可进行顶点粒度编辑的Web3D几何造型渲染方法，本 发明建立在作为几何造型数据容器的几何造型类上，通过插件扩展JavaScript底层API接 口实现可编辑的三维几何造型渲染。本发明在实现顶点粒度可编辑的Web3D几何造型渲染 的基础上，结合了两种基本Web3D渲染思路，提高了几何造型重绘制的效率。本技术依然建 立在使用基于场景树的渲染引擎，解析数据交换协议实现Web3D的设计方法之上。一种可编辑的网页三维几何造型渲染方法，包括以下步骤1.客户端接收来自于服务器的X3D格式的数据交换文本。2.解析数据交换文本中X3D根节点(Root)，创建与之对应的渲染引擎场景树节点 作为场景树根节点。3.如果数据交换文本中出现组节点(Group)，创建与之对应的渲染引擎场景树节
点o4.如果数据交换文本中出现空间坐标变换节点(Transform)，创建与之对应的渲 染引擎场景树节点，并读取空间坐标变换节点中的变换参数，在此场景树中生成对应的几 何造型变换矩阵。5.如果数据交换文本中出现图形节点(Shape)，创建与之对应的渲染引擎场景树 节点作为场景树叶节点。6.解析图形节点中的几何造型节点。如果为简单几何造型节点则使用渲染引擎几 何造型工场依照其属性中的参数生成几何造型对象，如果为复杂几何造型节点则生成不包 含几何数据的几何造型对象；再将复杂几何造型节点及其子节点中的数据读取到几何造型对象中。几何造型对象使用OpenGL VBO(Vertex Buffer Object)作为数据存储区。解析几何造型节点流程分为解析简单几何造型节点和解析复杂几何造型节点，解 析流程分别如下6. 1解析简单几何造型节点6. 1. 1将简单几何造型节点的节点名(几何造型名)、节点Id、几何造型参数传入 准备好的几何图形工场类的几何造型生成接口中。6. 1. 2几何图形工场类为事先准备的几何造型对象分配顶点数据。视图形为平面 或者三维，将顶点向量维数(size)解释为二维或者三维，存入几何造型对象中。计算顶点 数量(n)，将顶点向量的数量存入几何造型对象中。即时生成几何造型全部顶点，将顶点数 据存入几何造型对象的顶点缓存区中。统计顶点数据大小(b)单位为字节，将大小信息存 入几何造型对象中。6. 1. 3几何图形工场类为事先准备的几何造型对象分配颜色参数。视颜色参数为 RGB色或RGBA色，本次默认使用RGBA色，将颜色向量维度(size)解释为三维或者四维。工 场类的几何图形生成接口将颜色向量维度存放在几何造型对象中。计算颜色向量数(与顶 点相同为n)存入几何造型对象中。即时生成几何造型顶点向量对应的全部颜色向量，将颜 色数据存入几何造型对象颜色缓冲区中。计算颜色颜色数据大小(b)单位为字节，将大小 信息存入几何造型对象中。6. 1. 4几何图形工场类为事先准备的几何造型对象分配法线参数。法线参数为三 维向量。工场类的几何图形接口将法线向量数量(n)存放在几何造型对象中。即时生成几 何造型顶点向量对应的的全部法线向量，存入几何造型对象中。计算法线数据大小(b)单 位为字节，将法线数据大小信息存入几何造型对象中。6. 1. 5几何图形工场类为事先准备的几何造型对象分配雾坐标参数。雾坐标参数 为单值。工场类的几何图形接口将雾坐标数量(n)存放在几何造型对象中。即时生成几何 造型顶点向量对应的全部雾坐标，存入几何造型对象中。计算雾坐标数据大小(b)单位为 字节，将雾坐标大小信息存入几何造型对象中。6. 1.6几何图形工场类为事先准备的几何造型对象分配纹理坐标参数。纹理坐标 使用三维向量表示纹理坐标(s、t、r)，其中r = 0，表示默认使用二维纹理。将纹理坐标数 量存放在几何造型对象中。即时生成几何造型顶点向量对应的全部纹理坐标值，存入几何 造型对象中。计算纹理坐标数据大小(b)单位为字节，将纹理坐标大小信息存入几何造型 对象中。6. 1. 7几何图形工场类为事先准备的几何造型对象分配索引。视基本图形不同，构 成几何造型的顶点解释成不同类型多边形，索引表示几何造型顶点构成多边形的序列。将 索引数量、多边形绘制方式、每个多边形单元的顶点数存入几何造型对象。计算索引数据大 小(b)单位为字节，将大小信息存入几何造型对象中。6. 2解析复杂几何造型节点6.2.1生成未分配几何造型数据的几何造型对象。6. 2. 2读取复杂结合节点中存储的顶点数据、节点名，将顶点数存入几何造型对象 中。使用解析器将顶点数据、顶点向量维度、顶点个数、顶点数据大小(以字节为单位)存 入几何造型对象中。按照复杂几何造型节点名解释几何造型顶点索引，将索引、多边形绘制方式、索引个数、每个多边形单元的顶点数、索引数据大小存入几何造型对象中。6. 2. 2如果存在颜色节点(Color)，则读取颜色数据、节点名，并将颜色数据存入 几何造型对象中。根据颜色节点名将颜色节点数据解释为RGB或RGBA。将颜色向量解释方 式、颜色向量数、颜色数据大小存入几何造型对象。6. 2. 3如果存在法线节点(Normal)，则读取法线数据，并将法线数据存入几何造 型对象中。同时解析并存入几何造型对象的数据还包括法线向量个数、法线数据大小。6. 2. 4如果存在纹理坐标节点(TexCoord)，则读取纹理坐标数据，存入几何造型 对象中。同时存入几何造型对象的数据还包括纹理坐标解释方式、纹理坐标个数、纹理数据 大小。7.解析图形节点中的外观节点(Appearance)，读取外观数据中光照数据，并存入 几何造型对象中。8.完成步骤5以后，将解析完成后的几何造型节点加入到步骤3中生成的场景树 节点中。并将该树节点添加到场景树叶节点键值对中。如果解析过程中存在步骤2中生成 的场景树节点，则将场景树节点加入到步骤2中生成的节点中。如果组节点包含其余图形 节点重复步骤3、4、5、6、7。如果组节点包含子组节点重复步骤2、3、4、5、6、7。直到所有组 节点包含子节点解析完成。9.完成步骤8后将生成的子树加入到场景树根节点中。如果还有未解析组节点， 则重复步骤2、3、4、5、6、7、8，直到交换协议所有节点解析完成。10.渲染步骤9中生成的场景树。将从场景树根节点到场景树叶节点中的几何变 换矩阵连续相乘，得到最终几何变矩阵。将几何变换矩阵与OpenGL的ModelView矩阵相乘。 将存放在场景树叶节点下的几何造型对象中的几何造型数据通过OpenGL渲染管线指令发 送到OpenGL渲染几何造型。对根节点到每个叶节点的分支做同样操作。如果用户使用JavaScript脚本语言，编辑场景中的某个几何造型对象，则需如下 步骤11.使用JavaScript脚本语言，生成脚本语言插件对象。12.如果用户需要读取几何造型对象，则须指定几何造型对象的Id值，访问数据 区，调用脚本语言插件对象的几何造型访问方法。调用该方法系统须经过如下步骤12. 1在场景树叶节点键值对中收索指定Id值对应的几何造型对象。如果不存在 此对象则返回错误信息。如果存在几何造型对象则访问几何造型对象的几何造型数据访问 接口。12. 2调用几何造型对象数据访问方法，查找需访问的几何数据大小信息，如果需 查找的数据大小为零，则返回空数据。如果数据大小不为零，则读取数据区数据值，将拷贝 的数据值返回到脚本语言中。本方法使用OpenGLMapBuffer方法作为数据访问方法。13.如果用户需编辑几何造型对象，则需指定几何造型对象Id值、访问数据区、新 数据值，调用脚本语言插件对象的几何造型编辑方法。调用该方法系统需经过如下步骤13. 1在场景树叶节点键值对中收索指定Id值对应的几何造型对象。如果不存在 此对象则返回错误信息。如果存在几何造型对象则访问几何造型对象的几何造型数据编辑 接口。13. 2调用几何造型对象的数据编辑接口。查找需编辑的几何数据，如果需查找的
11数据区大小为零则不能编辑。如果查找数据区非零，但不等于新数据值的数据总大小(数 据在内存中的字节数)则不允许修改原数据。如果查找数据区非零，且等于新数据值的数 据总大小则将数据区更新为新数据。 13. 3在完成几何造型对象数据修改后，通过JavaScript指令命令系统重新渲染整个场景树。
权利要求
一种可编辑的网页三维几何造型渲染方法，包括以下步骤1.客户端接收来自于服务器的X3D格式的数据交换文本；2.解析数据交换文本中X3D根节点，创建与之对应的渲染引擎场景树节点作为场景树根节点；3.如果数据交换文本中出现组节点，创建与之对应的渲染引擎场景树节点；4.如果数据交换文本中出现空间坐标变换节点，创建与之对应的渲染引擎场景树节点，并读取空间坐标变换节点中的变换参数，在此场景树中生成对应的几何造型变换矩阵；5.如果数据交换文本中出现图形节点，创建与之对应的渲染引擎场景树节点作为场景树叶节点；6.解析图形节点中的几何造型节点；如果为简单几何造型节点则使用渲染引擎几何造型工场依照其属性中的参数生成几何造型对象，如果为复杂几何造型节点则生成不包含几何数据的几何造型对象；再将复杂几何造型节点及其子节点中的数据读取到几何造型对象中；几何造型对象使用OpenGL VBO作为数据存储区；几何造型节点具体解析流程为6.1解析简单几何造型节点；6.1.1将简单几何造型节点的节点名、节点Id、几何造型参数传入准备好的几何图形工场类的几何造型生成接口中；6.1.2几何图形工场类为事先准备的几何造型对象分配顶点数据；视图形为平面或者三维，将顶点向量维数解释为二维或者三维，存入几何造型对象中；计算顶点数量，将顶点向量的数量存入几何造型对象中；即时生成几何造型全部顶点，将顶点数据存入几何造型对象的顶点缓存区中；统计顶点数据大小单位为字节，将大小信息存入几何造型对象中；6.1.3几何图形工场类为事先准备的几何造型对象分配颜色参数；视颜色参数为RGB色或RGBA色，本次默认使用RGBA色，将颜色向量维度解释为三维或者四维；工场类的几何图形生成接口将颜色向量维度存放在几何造型对象中；计算颜色向量数存入几何造型对象中；即时生成几何造型顶点向量对应的全部颜色向量，将颜色数据存入几何造型对象颜色缓冲区中；计算颜色颜色数据大小单位为字节，将大小信息存入几何造型对象中；6.1.4几何图形工场类为事先准备的几何造型对象分配法线参数；法线参数为三维向量；工场类的几何图形接口将法线向量数量存放在几何造型对象中；即时生成几何造型顶点向量对应的的全部法线向量，存入几何造型对象中；计算法线数据大小单位为字节，将法线数据大小信息存入几何造型对象中；6.1.5几何图形工场类为事先准备的几何造型对象分配雾坐标参数；雾坐标参数为单值；工场类的几何图形接口将雾坐标数量存放在几何造型对象中；即时生成几何造型顶点向量对应的全部雾坐标，存入几何造型对象中；计算雾坐标数据大小单位为字节，将雾坐标大小信息存入几何造型对象中；6.1.6几何图形工场类为事先准备的几何造型对象分配纹理坐标参数；纹理坐标使用三维向量表示纹理坐标(s、t、r)，其中r＝0，表示默认使用二维纹理；将纹理坐标数量存放在几何造型对象中；即时生成几何造型顶点向量对应的全部纹理坐标值，存入几何造型对象中；计算纹理坐标数据大小单位为字节，将纹理坐标大小信息存入几何造型对象中；6.1.7几何图形工场类为事先准备的几何造型对象分配索引；视基本图形不同，构成几何造型的顶点解释成不同类型多边形，索引表示几何造型顶点构成多边形的序列；将索引数量、多边形绘制方式、每个多边形单元的顶点数存入几何造型对象；计算索引数据大小单位为字节，将大小信息存入几何造型对象中；6.2解析复杂几何造型节点；6.2.1生成未分配几何造型数据的几何造型对象；6.2.2读取复杂结合节点中存储的顶点数据、节点名，将顶点数存入几何造型对象中；使用解析器将顶点数据、顶点向量维度、顶点个数、顶点数据大小存入几何造型对象中；按照复杂几何造型节点名解释几何造型顶点索引，将索引、多边形绘制方式、索引个数、每个多边形单元的顶点数、索引数据大小存入几何造型对象中；6.2.2如果存在颜色节点，则读取颜色数据、节点名，并将颜色数据存入几何造型对象中。根据颜色节点名将颜色节点数据解释为RGB或RGBA；将颜色向量解释方式、颜色向量数、颜色数据大小存入几何造型对象；6.2.3如果存在法线节点，则读取法线数据，并将法线数据存入几何造型对象中；同时解析并存入几何造型对象的数据还包括法线向量个数、法线数据大小；6.2.4如果存在纹理坐标节点，则读取纹理坐标数据，存入几何造型对象中；同时存入几何造型对象的数据还包括纹理坐标解释方式、纹理坐标个数、纹理数据大小；7.解析图形节点中的外观节点，读取外观数据中光照数据，并存入几何造型对象中；8.完成步骤5以后，将解析完成后的几何造型节点加入到步骤3中生成的场景树节点中；并将该树节点添加到场景树叶节点键值对中；如果解析过程中存在步骤2中生成的场景树节点，则将场景树节点加入到步骤2中生成的节点中；如果组节点包含其余图形节点重复步骤3、4、5、6、7，如果组节点包含子组节点重复步骤2、3、4、5、6、7；直到所有组节点包含子节点解析完成；9.完成步骤8后将生成的子树加入到场景树根节点中；如果还有未解析组节点，则重复步骤2、3、4、5、6、7、8，直到交换协议所有节点解析完成；10.渲染步骤9中生成的场景树；将从场景树根节点到场景树叶节点中的几何变换矩阵连续相乘，得到最终几何变矩阵；将几何变换矩阵与OpenGL的ModelView矩阵相乘；将存放在场景树叶节点下的几何造型对象中的几何造型数据通过OpenGL渲染管线指令发送到OpenGL渲染几何造型；对根节点到每个叶节点的分支做同样操作；如果用户使用JavaScript脚本语言，编辑场景中的某个几何造型对象，则需如下步骤11.使用JavaScript脚本语言，生成脚本语言插件对象；12.如果用户需要读取几何造型对象，则须指定几何造型对象的Id值，访问数据区，调用脚本语言插件对象的几何造型访问方法；具体包括如下步骤12.1在场景树叶节点键值对中收索指定Id值对应的几何造型对象；如果不存在此对象则返回错误信息；如果存在几何造型对象则访问几何造型对象的几何造型数据访问接口；12.2调用几何造型对象数据访问方法，查找需访问的几何数据大小信息，如果需查找的数据大小为零，则返回空数据；如果数据大小不为零，则读取数据区数据值，将拷贝的数据值返回到脚本语言中；使用OpenGLMapBuffer方法作为数据访问方法；13.如果用户需编辑几何造型对象，则需指定几何造型对象Id值、访问数据区、新数据值，调用脚本语言插件对象的几何造型编辑方法；具体包括如下步骤13.1在场景树叶节点键值对中收索指定Id值对应的几何造型对象；如果不存在此对象则返回错误信息；如果存在几何造型对象则访问几何造型对象的几何造型数据编辑接口；13.2调用几何造型对象的数据编辑接口；查找需编辑的几何数据，如果需查找的数据区大小为零则不能编辑；如果查找数据区非零，但不等于新数据值的数据总大小则不允许修改原数据；如果查找数据区非零，且等于新数据值的数据总大小则将数据区更新为新数据；13.3在完成几何造型对象数据修改后，通过JavaScript指令命令系统重新渲染整个场景树。
2.解析数据交换文本中X3D根节点，创建与之对应的渲染引擎场景树节点作为场景树 根节点；
3.如果数据交换文本中出现组节点，创建与之对应的渲染引擎场景树节点；
4.如果数据交换文本中出现空间坐标变换节点，创建与之对应的渲染引擎场景树节 点，并读取空间坐标变换节点中的变换参数，在此场景树中生成对应的几何造型变换矩 阵；
5.如果数据交换文本中出现图形节点，创建与之对应的渲染引擎场景树节点作为场景 树叶节点；
6.解析图形节点中的几何造型节点；如果为简单几何造型节点则使用渲染引擎几何 造型工场依照其属性中的参数生成几何造型对象，如果为复杂几何造型节点则生成不包含 几何数据的几何造型对象；再将复杂几何造型节点及其子节点中的数据读取到几何造型对 象中；几何造型对象使用OpenGL VB0作为数据存储区；几何造型节点具体解析流程为6. 1解析简单几何造型节点；6. 1. 1将简单几何造型节点的节点名、节点Id、几何造型参数传入准备好的几何图形 工场类的几何造型生成接口中；6. 1. 2几何图形工场类为事先准备的几何造型对象分配顶点数据；视图形为平面或者 三维，将顶点向量维数解释为二维或者三维，存入几何造型对象中；计算顶点数量，将顶点 向量的数量存入几何造型对象中；即时生成几何造型全部顶点，将顶点数据存入几何造型 对象的顶点缓存区中；统计顶点数据大小单位为字节，将大小信息存入几何造型对象中；6. 1. 3几何图形工场类为事先准备的几何造型对象分配颜色参数；视颜色参数为RGB 色或RGBA色，本次默认使用RGBA色，将颜色向量维度解释为三维或者四维；工场类的几何 图形生成接口将颜色向量维度存放在几何造型对象中；计算颜色向量数存入几何造型对象 中；即时生成几何造型顶点向量对应的全部颜色向量，将颜色数据存入几何造型对象颜色 缓冲区中；计算颜色颜色数据大小单位为字节，将大小信息存入几何造型对象中；6. 1. 4几何图形工场类为事先准备的几何造型对象分配法线参数；法线参数为三维向 量；工场类的几何图形接口将法线向量数量存放在几何造型对象中；即时生成几何造型顶 点向量对应的的全部法线向量，存入几何造型对象中；计算法线数据大小单位为字节，将法 线数据大小信息存入几何造型对象中；6. 1. 5几何图形工场类为事先准备的几何造型对象分配雾坐标参数；雾坐标参数为单 值；工场类的几何图形接口将雾坐标数量存放在几何造型对象中；即时生成几何造型顶点 向量对应的全部雾坐标，存入几何造型对象中；计算雾坐标数据大小单位为字节，将雾坐标 大小信息存入几何造型对象中；6. 1. 6几何图形工场类为事先准备的几何造型对象分配纹理坐标参数；纹理坐标使用 三维向量表示纹理坐标(s、t、r)，其中r = 0，表示默认使用二维纹理；将纹理坐标数量存 放在几何造型对象中；即时生成几何造型顶点向量对应的全部纹理坐标值，存入几何造型 对象中；计算纹理坐标数据大小单位为字节，将纹理坐标大小信息存入几何造型对象中；`6. 1.7几何图形工场类为事先准备的几何造型对象分配索引；视基本图形不同，构成 几何造型的顶点解释成不同类型多边形，索引表示几何造型顶点构成多边形的序列；将索 引数量、多边形绘制方式、每个多边形单元的顶点数存入几何造型对象；计算索引数据大小 单位为字节，将大小信息存入几何造型对象中；`6. 2解析复杂几何造型节点；`6. 2. 1生成未分配几何造型数据的几何造型对象；`6. 2. 2读取复杂结合节点中存储的顶点数据、节点名，将顶点数存入几何造型对象中； 使用解析器将顶点数据、顶点向量维度、顶点个数、顶点数据大小存入几何造型对象中；按 照复杂几何造型节点名解释几何造型顶点索引，将索引、多边形绘制方式、索引个数、每个 多边形单元的顶点数、索引数据大小存入几何造型对象中；`6. 2. 2如果存在颜色节点，则读取颜色数据、节点名，并将颜色数据存入几何造型对象 中。根据颜色节点名将颜色节点数据解释为RGB或RGBA ；将颜色向量解释方式、颜色向量 数、颜色数据大小存入几何造型对象；`6. 2. 3如果存在法线节点，则读取法线数据，并将法线数据存入几何造型对象中；同时 解析并存入几何造型对象的数据还包括法线向量个数、法线数据大小；`6.2. 4如果存在纹理坐标节点，则读取纹理坐标数据，存入几何造型对象中；同时存入 几何造型对象的数据还包括纹理坐标解释方式、纹理坐标个数、纹理数据大小；`
7.解析图形节点中的外观节点，读取外观数据中光照数据，并存入几何造型对象中；`
8.完成步骤5以后，将解析完成后的几何造型节点加入到步骤3中生成的场景树节点 中；并将该树节点添加到场景树叶节点键值对中；如果解析过程中存在步骤2中生成的场 景树节点，则将场景树节点加入到步骤2中生成的节点中；如果组节点包含其余图形节点 重复步骤3、4、5、6、7，如果组节点包含子组节点重复步骤2、3、4、5、6、7 ；直到所有组节点包 含子节点解析完成；`
9.完成步骤8后将生成的子树加入到场景树根节点中；如果还有未解析组节点，则重 复步骤2、3、4、5、6、7、8，直到交换协议所有节点解析完成；`
10.渲染步骤9中生成的场景树；将从场景树根节点到场景树叶节点中的几何变换矩 阵连续相乘，得到最终几何变矩阵；将几何变换矩阵与OpenGL的ModelView矩阵相乘；将 存放在场景树叶节点下的几何造型对象中的几何造型数据通过OpenGL渲染管线指令发送 到OpenGL渲染几何造型；对根节点到每个叶节点的分支做同样操作；如果用户使用JavaScript脚本语言，编辑场景中的某个几何造型对象，则需如下步骤`
11.使用JavaScript脚本语言，生成脚本语言插件对象；`
12.如果用户需要读取几何造型对象，则须指定几何造型对象的Id值，访问数据区，调 用脚本语言插件对象的几何造型访问方法；具体包括如下步骤 12. 1在场景树叶节点键值对中收索指定Id值对应的几何造型对象；如果不存在此对 象则返回错误信息；如果存在几何造型对象则访问几何造型对象的几何造型数据访问接n ；`12. 2调用几何造型对象数据访问方法，查找需访问的几何数据大小信息，如果需查找 的数据大小为零，则返回空数据；如果数据大小不为零，则读取数据区数据值，将拷贝的数据值返回到脚本语言中；使用OpenGLMapBuffer方法作为数据访问方法；
13.如果用户需编辑几何造型对象，则需指定几何造型对象Id值、访问数据区、新数据 值，调用脚本语言插件对象的几何造型编辑方法；具体包括如下步骤13. 1在场景树叶节点键值对中收索指定Id值对应的几何造型对象；如果不存在此对 象则返回错误信息；如果存在几何造型对象则访问几何造型对象的几何造型数据编辑接n ；13. 2调用几何造型对象的数据编辑接口 ；查找需编辑的几何数据，如果需查找的数据 区大小为零则不能编辑；如果查找数据区非零，但不等于新数据值的数据总大小则不允许 修改原数据；如果查找数据区非零，且等于新数据值的数据总大小则将数据区更新为新数 据；13. 3在完成几何造型对象数据修改后，通过JavaScript指令命令系统重新渲染整个 场景树。
全文摘要
一种可编辑的网页三维几何造型渲染方法，属于计算机图形处理技术领域。本发明在使用基于场景树的渲染引擎，解析数据交换协议实现Web3D的基础上，通过解析图形节点中的几何造型，使用渲染引擎几何造型工场生成几何造型对象，通过插件扩展JavaScript底层API接口实现可编辑的三维几何造型渲染。本发明在实现顶点粒度可编辑的Web3D几何造型渲染的基础上，结合了两种基本Web3D渲染思路，提高了几何造型重绘制的效率。本发明属于一种Web富客户端的三维几何造型渲染方法，可应用于动漫行业。
文档编号G06F9/44GK101853162SQ201010188278
公开日2010年10月6日 申请日期2010年6月1日 优先权日2010年6月1日
发明者石冶砾, 陆鑫, 雷航 申请人:电子科技大学