Visualization

vtkjs-tips

使用vtkjs的一些tips

dash-vtkjs

设置坐标轴的样式

设置坐标轴的位置以及格式，这部分的文档还不是特别的完善，有时候只能通过查看源码来。最近的一个项目里需要手动修改vtkjs坐标轴也就是scalar bar的位置还有相关参数的颜色。

效率最高的方式是直接看源码。 这里有一个很tricky的地方就是先要设置了automated=False的参数，这个时候其他的barPosition相关的参数才能生效。而automated参数默认是true的，所以如果不设置这个参数，后面scalar bar 相关的配置再咋弄都是无效的。具体可以参考这里的源码。

在看代码的时候一定要有这种全局的意识，不是单独的去看一个局部的片段。

在实际项目中是通过dash-vtk的库去调用的vtkjs, 这是把scalar bar 设置成黑色并且调用相关组件生成geometry representation的代码

test_scalarbar_style = {
    'tickTextStyle': {
        'fontSize': 16,
        'fontColor': 'black'
    },
    'drawNanAnnotation': False,
    "automated": False # the position is only avalibale when the automated is false
    # 'boxPosition': [0.5, -0.92],  # 比如这里设置颜色条在视图的 0.8, 0.5 位置
    'boxPosition': [0.7, -0.9]  # 比如设置边框稍微偏下偏左一点
}

这是实际geo represetation的数据，scalarBarStyle采用上面默认设置的case。

rep = cvtk.GeometryRepresentation(
    id=data_key,
    property={
        "representation": 3,
        "edgeVisibility": True,
        'edgeColor': (0, 0, 0),
    },
    actor={"visibility": True},  # 用 actor 控制显隐；初始隐藏
    showCubeAxes=False, # control existenc of cube axes
    showScalarBar=False,
    scalarBarStyle=test_scalarbar_style,
    children=Mesh(
        id=MESH_ID+"_"+data_key,
        state=to_mesh_state(ds)
    ),
)

surface with edge 的开销问题

cellLocator的开销问题

C/S 以及 B/S 架构的选择问题

浏览器中单tab内存的限制通常为2G-4G（这个是比较固定的难以优化的限制），超过的话就会crash了，所以基于web的rendering只适合轻量化的model，如果需要在浏览器中同时加载10个model的话，那每个就要小于200MB了，然后再加上变量的话，可能限制就更多了。

所以这就决定了使用的场景，如果为了效果的酷炫，然后跨平台使用，安装便捷，还是在有GPU的机器上使用基于web的render就足够了，可以通过一些提取外部面的技术来限制模型的大小。可以说在80%的场景下是够用的。

另外的20%的场景就是需要内存中加载很大的网格数据，这个时候最好还是使用专门的客户端的渲染，或者web端就改成传图的模式。传图的方式就可以很灵活了，比如可以用分辨率低的快速渲染提高帧率等等。

还有一个就是部署的问题，一个exe部署起来是最方便的，web端的话，还需要把frontend一起build到后端中，基于python的话可能还存在一些源码保护的问题等等。

推荐文章