Rerun Graphs 图可视化实战基于 Fjädra 力导向布局引擎绘制节点连线图与气泡图【免费下载链接】rerunVisualize, query, and stream to train on multimodal robotics data.项目地址: https://gitcode.com/GitHub_Trending/re/rerun导读本文围绕 Rerun 仓库中的 graphs 示例 展开讲解如何借助 Rerun 内置的力导向布局引擎Fjädra仅通过GraphNodes/GraphEdges两类原语记录图数据即可在 viewer 中自动完成节点排布与布局渲染。你将掌握 Rerun 力导向物理模拟的五大力Center、Collision、Many-Body、Link、Position的含义与调参方式学会用rr.GraphNodes、rr.GraphEdges记录树、格子、马尔可夫链等常见图结构并通过 Blueprint 的GraphView与ForceLink、ForceManyBody、ForceCollisionRadius等力参数配置不同形态的图可视化节点连线图、气泡图。一、示例概览Rerun 能画出哪些图Rerun 的re_view_graph视图对应 crate crates/views/re_view_graph专门用于渲染节点连线图node-link diagram。graphs 示例演示了四种典型图结构随机树node_link / bubble_chart以root为根逐步随机挂载新节点的有向树同时以节点连线图和气泡图两种形态展示格子lattice10×10 的二维网格有向图节点颜色按坐标渐变马尔可夫链markov_chain三状态sunny / rainy / cloudy随机游走的时间序列动画节点位置固定描述面板description以 Markdown 文本展示示例说明。示例的核心卖点在于记录数据时完全不需要提供节点坐标除马尔可夫链外节点位置由 Rerun 内部的力导向布局引擎实时计算用户既可以在选择面板selection panel里动态调整力参数也可以通过 Blueprint 在代码中预设。二、Rerun 的力导向布局引擎 FjädraRerun 内置了一个与d3-force非常相似的物理模拟引擎名为Fjädra瑞典语弹簧。它被集成在re_view_graph视图中负责把图数据节点 边转换为布局坐标。从源码看布局的核心实现在 crates/views/re_view_graph/src/layout/provider.rs 的ForceLayoutProvider中fjadra::Simulation承载所有节点与力的模拟状态每个布局请求会把节点转换为fj::Node把边转换为节点索引对(usize, usize)节点的半径取自其包围盒尺寸的一半v.size.max_elem() as f64 / 2.0每次视图刷新调用tick(1)推进模拟一步直到is_finished()判定收敛若所有节点都带固定位置如马尔可夫链则直接跳过模拟仅按固定坐标摆放见 provider.rs 中all_nodes_fixed()分支。力导向布局的优点在于灵活同一条图数据只需调整力的组合与参数就能产出节点连线图、气泡图等差异巨大的可视化形态。三、五大物理力详解Fjädra 实现了五种与d3-force对应力。它们在 Rerun 中均有对应的 Blueprint archetype定义于 crates/store/re_sdk_types/src/blueprint/archetypes并在 provider.rs 的update_simulation中按开关逐一生效力Blueprint 类型参数作用居中力Centerforce_center.rsenabled、strength将整个图的质心拉向原点注释原文tries to move the center of mass of the graph to the origin碰撞半径力Collision radiusforce_collision_radius.rsenabled、strength、iterations依据节点半径解析节点间碰撞避免节点互相重叠多体力Many-Bodyforce_many_body.rsenabled、strength在任意两节点间施加类似电荷的作用力strength为正吸引、为负排斥链接力Linkforce_link.rsenabled、distance、iterations让存在边相连的节点趋向目标距离行为类似弹簧位置力Positionforce_position.rsenabled、strength、position类似重力把所有节点拉向指定位置在 provider.rs 中可以看到每支力的具体装配方式fj::Link::new(edges).distance(d).iterations(n)、fj::ManyBody::new().strength(s)、fj::Collide::new().radius(...).iterations(n).strength(s)、fj::Center::new().strength(s)而 Position 力被拆分为fj::PositionX与fj::PositionY两个方向分别施力。所有参数的默认值均来自ForceLayoutParams的查询回退逻辑见 crates/views/re_view_graph/src/layout/params.rs它通过ViewProperty::component_or_fallback从 Blueprint 中读取未配置时自动使用各组件类型的默认值——这就是不开蓝图也能自动出布局的原因。说明这些 Force archetype 在源码注释中均标注为unstable可能在不兼容的情况下变更使用时建议跟随 Rerun SDK 版本固定行为。四、运行 graphs 示例在仓库根目录下安装并运行pip install -e examples/python/graphs python -m graphs示例项目配置见 examples/python/graphs/pyproject.toml依赖rerun-sdk并注册了graphs命令入口graphs graphs:main因此也可以直接用graphs命令启动。运行后 viewer 中会同时出现四个面板Node-link diagram、Bubble chart、Lattice 与 Markov Chain外加 Description 文本面板。五、核心代码用 GraphNodes / GraphEdges 记录图数据Rerun 记录图数据只依赖两个 archetypeGraphNodes节点列表支持node_ids、positions可选坐标、colors、labels、show_labels、radii等字段定义见 crates/store/re_sdk_types/src/archetypes/graph_nodes.rsGraphEdges边列表支持graph_typedirected/undirected以及GraphType.Directed等枚举值。5.1 记录格子图静态rr.log( lattice, rr.GraphNodes( nodes, colorscolors, # 按坐标渐变的颜色 labels[f({x}, {y}) for x, y in itertools.product(...)], ), staticTrue, # 静态数据不随时间变化 ) rr.log(lattice, rr.GraphEdges(edges, graph_typedirected), staticTrue)要点使用staticTrue表示该数据不随时间演化节点 ID 使用字符串如0、1边的两端引用这些 ID。由于没有提供positions节点坐标完全交由 Fjädra 计算。5.2 记录随机树随时间演化rr.set_time(frame, sequencei) # 以 frame 为时间轴 rr.log( node_link, # 节点连线图 rr.GraphNodes(nodes, labelsnodes, radiiradii, colorscolors), rr.GraphEdges(edges, graph_typerr.GraphType.Directed), ) rr.log( bubble_chart, # 气泡图只记节点不记边 rr.GraphNodes(nodes, labelsnodes, radiiradii, colorscolors), )要点同一批节点被记录到两个不同 entity 路径node_link与bubble_chart其中气泡图不记录边仅靠节点的radii与碰撞力形成圆形打包circle packing效果rr.set_time让每帧节点数递增形成动态生长动画。完整实现见 examples/python/graphs/graphs.py 的log_trees()。5.3 记录马尔可夫链固定坐标 状态动画rr.log( markov_chain, rr.GraphNodes(state_names, labelsstate_names, colorscolors, positionspositions), rr.GraphEdges(edges, graph_typedirected), )要点positions为硬编码坐标[[0, 0], [150, 150], [300, 0]]因此无需任何力即可布局viewer 检测到所有节点位置固定时直接跳过物理模拟。每帧通过np.random.choice按转移矩阵采样下一个状态并高亮当前状态节点形成马尔可夫链动画见log_markov_chain()。六、用 Blueprint 预设布局GraphView 与力参数除了在运行时手动调节选择面板还可以在代码中通过rr.send_blueprint精确配置每个图面板的布局方式。示例的log_blueprint()展示了四种典型配置rrb.GraphView( originnode_link, nameNode-link diagram, force_linkForceLink(distance60), # 弹簧目标距离 60 force_many_bodyForceManyBody(strength-60), # 节点间互相排斥 ), rrb.GraphView( originbubble_chart, nameBubble chart, force_linkForceLink(enabledFalse), # 关闭链接力 force_many_bodyForceManyBody(enabledFalse), # 关闭多体力 force_collision_radiusForceCollisionRadius(enabledTrue), # 仅靠碰撞力打包 defaults[rr.GraphNodes.from_fields(show_labelsFalse)], # 全局关闭标签 ), rrb.GraphView( originlattice, nameLattice, force_linkForceLink(distance60), force_many_bodyForceManyBody(strength-60), defaults[rr.GraphNodes.from_fields(show_labelsFalse, radii10)], ), rrb.GraphView( originmarkov_chain, nameMarkov Chain, # 节点坐标固定无需任何力 ),从这段代码可以提炼出可复用的调参思路节点连线图保留ForceLink控制边长度与ForceManyBody控制节点疏密。ForceLink(distance60)使相邻节点趋向 60 的间距ForceManyBody(strength-60)让不相连节点互相排斥防止过度拥挤气泡图关闭 Link 与 Many-Body 力只保留ForceCollisionRadius。此时节点在碰撞力作用下自动挤压成紧密的圆形堆叠节点的radii直接决定气泡大小——这就是圆打包布局的实现原理固定布局图节点自带positions时无需配置任何力defaults参数可对 entity 内的节点统一附加属性如show_labelsFalse、radii10免去在数据端逐节点设置。这些 Force archetype 的 Python 导入路径为rerun.blueprint.archetypes.force_*对应 Rust 侧 crates/store/re_sdk_types/src/blueprint/archetypes全部字段均为可选0 required / 0 recommended / 若干 optional意味着最小化配置只需设置关心的参数即可。七、布局运行机制与注意事项结合源码与示例有几点值得注意边方向GraphEdges的graph_type控制边是否带箭头多条平行边在布局收敛后会以贝塞尔曲线扇出绘制见 provider.rs 的SlotKind::Regular分支自环边单独以顶部锚点的曲线渲染节点半径来源布局中碰撞力使用的半径来自节点包围盒size.max_elem() / 2因此节点越大碰撞力作用范围越大性能取舍iterations参数决定每步模拟内单支力的应用次数源码注释明确提高该参数可获得更好结果但会延长计算时间见 force_link.rs数据体积控制图数据量较大时应使用staticTrue记录不变的部分如格子图结构随时间演化的部分如树、马尔可夫链再用rr.set_time逐帧记录避免冗余存储。八、延伸阅读示例源码与元数据examples/python/graphs/graphs.py、examples/python/graphs/README.md、examples/python/graphs/pyproject.toml图视图实现crates/views/re_view_graph/src/view.rs、布局模块 crates/views/re_view_graph/src/layout/mod.rs数据模型定义crates/store/re_sdk_types/src/archetypes/graph_nodes.rs、crates/store/re_sdk_types/src/archetypes/graph_edges.rs力参数查询与默认值crates/views/re_view_graph/src/layout/params.rs【免费下载链接】rerunVisualize, query, and stream to train on multimodal robotics data.项目地址: https://gitcode.com/GitHub_Trending/re/rerun创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考
