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桥梁,聚合团队。

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

相关推荐
呼啦啦呼啦啦啦啦啦啦5 小时前
利用pdfjs实现的pdf预览简单demo(包含翻页功能)
android·javascript·pdf
前端 贾公子8 小时前
vue-cli 模式下安装 uni-ui
前端·javascript·windows
拾光拾趣录8 小时前
链表合并:双指针与递归
前端·javascript·算法
拼图2098 小时前
element-plus——图标推荐
javascript·vue.js·elementui
期待のcode8 小时前
图片上传实现
java·前端·javascript·数据库·servlet·交互
koooo~9 小时前
JavaScript中的Window对象
开发语言·javascript·ecmascript
安心不心安10 小时前
React hooks——useReducer
前端·javascript·react.js
像风一样自由202010 小时前
原生前端JavaScript/CSS与现代框架(Vue、React)的联系与区别(详细版)
前端·javascript·css
啃火龙果的兔子10 小时前
react19+nextjs+antd切换主题颜色
前端·javascript·react.js
_pengliang10 小时前
小程序按住说话
开发语言·javascript·小程序