基于WebGL的织物三维展示系统

摘要

针对纺织行业对织物三维模拟的需求，本文提出并实现了基于WebGL的织物三维展示系统。该系统属于Web应用程序，采用了B/S结构并使用SSH开发框架搭建。本文主要介绍了织物三维展示系统的功能及实现。本系统在设计中被划分成了两个子系统，分别为织物二维映射系统和三维场景模拟系统。
　　织物二维映射系统使用Java语言开发，实现的主要功能是使用目标纹理对原始场景图上划分出的区域进行纹理映射，针对图像映射的精度问题，采用了三次卷积插值算法，能够有效消除映射后产生的锯齿，使用了亮度融合技术，能够使映射后的图片保留原始场景中的部分亮度信息，提高真实性。
　　三维场景模拟系统主要使用JavaScript语言开发，使用了基于WebGL的Three.js开源库来搭建和展示三维场景，场景中加入了光照与阴影来凸显真实感，还加入了相机控制方式，使用户能自由改变视角方向。三维模型采用了OBJ文件和MTL文件配合使用，能自由替换某个部位的纹理材质。系统中使用了数据压缩传输等性能优化措施，能够极大增强用户体验。
　　使用本系统的用户，可以通过浏览器轻松获取纺织花样在三维模型上的展示效果。无论是花样设计师，还是需要购买某纺织品的用户，都可以得到纺织品在不同场景中的展示效果，可以将本系统作为设计工具或者销售工具。

目录

声明

摘要

图目录

表目录

第1章 绪论

1．1 计算机图形学的应用

1．2 纺织CAD技术在国内外的发展

1．2．1 国内技术发展

1．2．2 国外技术发展

1．3 织物三维展示系统概述

1．4 本课题的目的和意义

1．5 本课题的研究内容

1．6 本文章节安排

第2章 织物二维映射系统

2．1 映射系统设计方案

2．2 二维场景图的选择

2．3 绘制自定义区域的边界线

2．4 划分有限元网格

2．4．1 累加弦长参数样条曲线

2．4．2 有限元网格的划分

2．5 纹理映射

2．5．1 纹理映射简介

2．5．2 网格映射的实现

2．5．3 用于纹理映射的图像插值算法

2．6 亮度融合

2．6．1 颜色模型

2．6．2 融合算法

2．7 纹理映射程序

2．8 映射效果展示

2．9 本章小结

第3章 三维场景模拟系统的技术框架

3．1 三维场景模拟系统的体系结构

3．2 SSH框架介绍

3．3 WebGL相关理论背景

3．3．1 WebGL程序开发

3．3．2 WebGL坐标系统

3．4 Three．js开源框架

3．4．1 场景构建

3．4．2 几何体与材质

3．4．3 外部模型的导入

3．4．4 光照与阴影

3．4．5 相机的控制方式

3．5 纹理与材质库

3．5．1 MTL材质库

3．5．2 UV纹理坐标

3．6 本章小结

第4章 三维场景模拟系统的实现

4．1 后台文件结构

4．1．1 用户状态

4．2 前端三维场景的搭建与优化

4．2．1 前端框架

4．2．2 用户操作

4．2．3 性能优化

4．3 模型数据的后期维护

4．4 本章小结

第5章 织物三维展示系统的效果演示

5．1 织物三维展示系统的系统框架

5．2 用户交互界面

5．3 三维展示图

5．4 本章小结

第6章 总结与展望

6．1 主要研究工作

6．2 未来工作展望

参考文献

硕士期间参与的项目与发表和录用的论文

致谢