vtkjs学习笔记 一 基本工作流

数据工作流一般为：

source——filter——mapper——actor——render——renderwindow——interactor。

Actor用来在场景中表现一个可视化实体，也可以成为3D图形的描绘实现，主要用于对图形的描绘。

Filter是一种数据处理机制，有一个或者多个输入，但仅有一个输出。其目的是对图形图像数据进行处理，以便得到我们期望的数据。

 

 

一个完整初始化的流程如下：

 

   // 创建source
    const coneSource = vtkConeSource.newInstance({ height: 1.0 });
    const filter = vtkCalculator.newInstance();

    // 设置filter
    filter.setInputConnection(coneSource.getOutputPort());
    filter.setFormula({
      getArrays: (inputDataSets: any) => ({
        input: [],
        output: [
          {
            location: FieldDataTypes.CELL,
            name: 'Random',
            dataType: 'Float32Array',
            attribute: AttributeTypes.SCALARS
          }
        ]
      }),
      evaluate: (arraysIn: any, arraysOut: any) => {
        const [scalars] = arraysOut.map((d: any) => d.getData());
        for (let i = 0; i < scalars.length; i++) {
          scalars[i] = Math.random();
        }
      }
    });

    //设置 actor and mapper, bind filter to mapper
    this.mapper = vtkMapper.newInstance();
    this.mapper.setInputConnection(filter.getOutputPort());
    const actor = vtkActor.newInstance();
    actor.setMapper(this.mapper);

    // 设置 renderer renderwindow interactor
    const fulllScreenApp = vtkFullScreenRenderWindow.newInstance({
      rootContainer: (this.$refs as any).vtkWrapper
    });

    this.renderer = fulllScreenApp.getRenderer();
    this.renderWindow = fulllScreenApp.getRenderWindow();

    // add actor to renderer
    this.renderer.addActor(actor);

    //render
    this.renderWindow.render();

 

 

---

 

1. vtkSource（数据源）

数据源表示用于渲染的数据集，如顶点信息，索引信息，图元信息等。

数据源有：vtkConeSource,vtkSphereSource,vtkOutlineSource等等。

它们都继承与vtkAlgorithm类，该类用于提供数据工作流的接口。

2. vtkMapper（映射器）

Mapper用于表示数据将如何被渲染，主要包括了与渲染管线相关的一些配置属性

映射器有：vtkDataSetMapper,vtkMultiGroupPolyDataMapper,vtkPolyDataMapper.

它们都继承于vtkMapper类。 所有的数据对象都要通过映射器Mapper映射到vtkActor中。

3. vtkActor（演员）

Actor类似于Unity 中的Entity,表示了场景中的一个可渲染对象，其包括了Source和Mapper信息，提供一些高级属性接口如坐标，旋转等。

该类继承于vtkProp3D，有4个子类：vtkFollow,vtkLODActor,vtkMesaActor,vtkOpenGLActor.

4. vtkRenderer（渲染器）

负责管理场景的渲染过程，对场景中的可渲染对象进行渲染，组成场景的对象包括Prop、相机（vtkCamera）和光照（vtkLight），一个vtkRenderWindow中可以有多个vtkRenderer对象。

该类继承于vtkViewport，

该类的有一个重要接口是设置vtk渲染窗口vtkRenderWindow的背景颜色。

vtkRenderer::AddActor(); // 该方法用于将vtkProp类型的对象添加到渲染场景中。

vtkRenderer::SetBackground(); // 该方法用于设置渲染场景的背景颜色。

5. vtkRenderWindow（窗口）

视口，作为renderer的渲染的地方，包含了窗口，dom上下文信息

6. vtkRenderWindowInteractor（窗口交互器）    

这个捕捉了界面所有交互事件（鼠标，键盘等），传递给Observer处理。

该类的继承关系在vtkRenderWindowInteractor文章中已给出。

7. vtkInteractorObserver（观察者）        

交互观察者，用来捕捉交互事件（鼠标，键盘事件等），界面事件的处理都在这儿

该类的继承关系在vtkRenderWindowInteractor文章中已给出

总结（引用别人画的一张数据流图）：