Learning vtkjs之Calculator

过滤器 公式计算器 Calculator

介绍

The Calculator filter is a fast way to add derived data arrays to a

dataset. These arrays can be defined over points, cells, or just field

data that is "uniform" across the dataset (i.e., constant over all of

space). Values in the array(s) you create are specified in terms of

existing arrays via a function you provide.

The Calculator filter is similar in spirit to VTK's array calculator,

so it should be familiar to VTK users but the syntax takes advantage

of JavaScript's flexibility.

chatGLM 翻译一下

计算器过滤器是一种快速向数据集中添加派生数据数组的方法。 这些数组可以定义为点、单元格,或只是数据集中的"统一"场数据(即,在整个空间中是常数)。 您创建的数组中的值是通过您提供的函数以现有数组为条件来指定的。

计算器过滤器在精神上类似于 VTK 的数组计算器,因此对 VTK 用户来说应该很熟悉,但其语法利用了 JavaScript 的灵活性。

用法

其实官方给的例子真的坑好多啊,比如interpolateScalarsBeforeMapping: false,才可以插值,useLookupTableScalarRange: false,才可以表示使用lookuptable,用起来很疑惑,你不看源码就不知道什么情况,它自己的例子也报错,运行不起来,最后需要自己debug一下

官方例子给的是setFormulaSimple方式,比较方便

核心代码

js 复制代码
// 创建一个计算器的过滤器
const simpleFilter = vtkCalculator.newInstance();
    simpleFilter.setFormulaSimple(
      FieldDataTypes.POINT, // Generate an output array defined over points.
      [], // We don't request any point-data arrays because point coordinates are made available by default.
      "z", // Name the output array "z"
      (x) => (x[0] - 0.5) * (x[0] - 0.5) + (x[1] - 0.5) * (x[1] - 0.5) + 0.125
    ); // Our formula for z
// 利用的是scalar来修改变形
    const warpScalar = vtkWarpScalar.newInstance();
    const warpMapper = vtkMapper.newInstance({
      interpolateScalarsBeforeMapping: false,
      useLookupTableScalarRange: false,
      lookupTable,
    });
    const warpActor = vtkActor.newInstance();
    // warpActor.getProperty().setEdgeVisibility(true);

    // The generated 'z' array will become the default scalars, so the plane mapper will color by 'z':
    // 数据源是来自这个平面plane
    simpleFilter.setInputConnection(planeSource.getOutputPort());

    // We will also generate a surface whose points are displaced from the plane by 'z':
    warpScalar.setInputConnection(simpleFilter.getOutputPort());
    // 设置需要对应处理的数组的key
    warpScalar.setInputArrayToProcess(0, "z", "PointData", "Scalars");


    warpMapper.setInputConnection(warpScalar.getOutputPort());
    warpActor.setMapper(warpMapper);

代码效果

一个公式效果

另外一个公式效果

这个还是挺好用的,用来按照一定规则过滤数组,这部分核心逻辑可以抽离出来

全部代码都放到github上了
新坑_Learning vtkjs_git地址

关注我,我持续更新vtkjs的example学习案例

也欢迎各位给我提意见,技术交流~

大鸿

WeChat : HugeYen

WeChat Public Account : BIM树洞

做一个静谧的树洞君

用建筑的语言描述IT事物;

用IT的思维解决建筑问题;

共建BIM桥梁,聚合团队。

本学习分享资料不得用于商业用途,仅做学习交流!!如有侵权立即删除!!

相关推荐
zhanshuo16 分钟前
鸿蒙UI开发全解:JS与Java双引擎实战指南
前端·javascript·harmonyos
JohnYan16 分钟前
模板+数据的文档生成技术方案设计和实现
javascript·后端·架构
撰卢40 分钟前
如何提高网站加载速度速度
前端·javascript·css·html
10年前端老司机1 小时前
在React项目中如何封装一个可扩展,复用性强的组件
前端·javascript·react.js
lemonzoey1 小时前
Node.js child_process 核心 API 详解
前端·javascript
lemonzoey1 小时前
pnpm 与 npm 的依赖管理机制深度解析
前端·javascript
lemonzoey1 小时前
PNPM 全局存储机制深度解析
前端·javascript
gnip2 小时前
markdown预览自定义扩展实现
前端·javascript
G等你下课2 小时前
AJAX请求跨域问题
前端·javascript·http
爱编程的喵2 小时前
JavaScript闭包深度解析:从作用域到实战应用
前端·javascript