图形学 日志

自制简易的软光栅渲染器(2)

playerzhou 无回复

项目地址:https://github.com/OmegaZhou/SimpleRenderer

读取并解析OBJ文件

  • 在完成了直线的绘制之后,tiny renderer教程提供了一个obj文件来检验当前的结果
  • 在这里,我走了一定的弯路,起初我想一次性解析完整个obj文件格式并导成可供代码使用的对象,但始终不知道如何设计相关的数据结构,加上我自己对于直接使用JavaScript操作长字符串也不甚了解,浪费了很多时间
  • 最后还是想明白了,先解析好目前要用数据,之后再迭代开发才能更好地设计出易用的结构
  • 之后我在参考他人的代码上实现了对OBJ文件的解析
    • 由于JavaScript中字符串为值类型且每次修改都是进行复制操作,容易引发性能问题
    • 因此首先先将字符串按行划分成数组元素,每次仅对一行字符串进行操作,避免多次复制长字符串
    • 接着在每一行移除注释部分
    • 接着根据每行起始关键字执行相应的解析操作
    • 这里,虽然在网上的资料中得知obj文件支持使用\符号连接多行,但在此为了方便,我不考虑这一情况
  • 最终,我将需要用到的顶点和面结构导入定义好的Model类中,并进行相应的绘制测试
  • 通过绘制obj文件,我也发现了代码中之前存在的许多bug,并修复完成

来一发吐槽

此站点使用Akismet来减少垃圾评论。了解我们如何处理您的评论数据