vtk.js 学习教程

面向已经掌握 Three.js 表面渲染的开发者。本教程从数据模型和管线出发，逐步学习切片、体渲染、真实数据读取与综合项目。

组织方式：30 个独立章节与 README.md 同级。 示例项目放在 examples/，练习和参考答案放在 exercises/，不混入正文。第 1–9 阶段的第 1–30 章均已完成。

技术基线

后续阶段沿用此版本。若升级依赖，先验证已有示例，再同步修改受影响的章节。

目录与编写阶段

第 1 阶段：心智模型与第一个程序（已完成）

  1. vtk.js 在解决什么问题
  2. 从 Three.js 转换到 vtk.js
  3. 数据管线与场景管线
  4. 第一个可运行程序

练习与参考答案 · 可运行示例

第 2 阶段：渲染环境对象（已完成）

  1. vtkGenericRenderWindow 与 vtkRenderWindow
  2. vtkRenderer 与 vtkCamera
  3. vtkRenderWindowInteractor 与交互样式

练习与参考答案 · 可运行示例

第 3 阶段：数据对象（已完成）

  1. vtkDataArray：值、分量与元组
  2. vtkPolyData、vtkPoints 与 vtkCellArray
  3. Point Data 与 Cell Data
  4. vtkImageData：规则三维采样场

练习与参考答案 · 可运行示例

第 4 阶段：表面与切片（已完成）

  1. vtkMapper：输入与表面映射
  2. vtkActor 与 vtkProperty：放置与外观
  3. 标量着色与颜色映射
  4. vtkImageMapper 与 vtkImageSlice：三维数据的切片

练习与参考答案 · 可运行示例

第 5 阶段：体渲染原理（已完成）

  1. 体渲染原理：视线采样、插值与颜色累积
  2. vtkColorTransferFunction：标量到颜色
  3. vtkPiecewiseFunction：标量到不透明度

练习与参考答案 · 可运行示例

第 6 阶段：体渲染对象（已完成）

  1. vtkVolumeMapper：三维采样与混合方式
  2. vtkVolume 与 vtkVolumeProperty：体对象及外观
  3. 切片、合成体渲染、MIP 与等值面

练习与参考答案 · 可运行示例

第 7 阶段：真实数据与过滤器（已完成）

  1. Reader 对象与数据格式
  2. vtkHttpDataSetReader：数组选择与按需加载
  3. Filter 对象：等值面提取与 vtkClipPolyData

练习与参考答案 · 可运行示例

第 8 阶段：排错与自学（已完成）

  1. 数据更新机制
  2. 大数据性能
  3. 阅读官方示例、API 与源码

练习与参考答案 · 可运行示例

第 9 阶段：综合项目（已完成）

  1. 带标量着色的表面查看器
  2. 带切片和传递函数控制的体数据查看器
  3. 属性数组按需加载与网络请求观察

练习与参考答案 · 可运行示例

阅读顺序

按章节编号阅读正文。完成一个阶段后，再做该阶段的练习；示例项目供运行、修改和检查，不代替正文中的解释。