sentrux源码剖析（三）：egui Treemap渲染引擎——squarify布局、依赖边路由与实时高亮的实现细节

sentrux源码剖析三egui Treemap渲染引擎——squarify布局、依赖边路由与实时高亮的实现细节【免费下载链接】sentruxReal-time architectural sensor that helps AI agents close the feedback loop, enabling recursive self-improvement of code quality. Pure Rust.项目地址: https://gitcode.com/gh_mirrors/se/sentruxsentrux是一个纯 Rust 编写的实时架构传感器它把代码仓库扫描成 Treemap 树状图让每个文件按权重占据一块矩形、每条依赖关系变成一条连线帮助开发者和 AI Agent一眼看清代码库的规模、耦合与热点。本文深入它的渲染引擎源码拆解squarify 布局算法、依赖边路由与实时高亮三大核心机制带你看懂这个 egui Treemap 可视化是如何在每帧绘制中既快又稳的。渲染管线总览从文件树到屏幕像素整条管线的设计目标是布局与渲染彻底解耦布局引擎只输出抽象的几何数据RenderData扁平矩形 折线边 锚点不依赖 egui渲染器拿到它后纯函数式地画到egui::Painter上无状态、无副作用。入口compute_layout_from_snapshot 把快照、视口尺寸和 LayoutConfig尺寸模式、缩放模式、布局模式、聚焦过滤等 9 个配置打包喂给布局调度产出矩形、锚点再调用边路由最终拼成 RenderData。每帧绘制render_frame 按固定图层顺序绘制根矩形 → 目录分区 → 文件块 → 热度覆盖层 → 依赖边 → 徽标 → 小地图。交互时自动降级 LODlod_full跳过边与热度层保证流畅。坐标换算所有几何都在世界坐标系计算由 ViewportTransform 统一换算成屏幕像素支持平移、缩放与视口剔除——屏幕外的矩形和边直接不画。Squarify 布局让上百个文件摆得又方又齐Squarified treemapBruls、Huizing、van Wijk 2000是业界标准的空间填充算法sentrux 在 squarify.rs 中做了通用化实现调用方提供带权重的条目和目标矩形算法通过回调逐个吐出定位后的矩形。权重先行谁的文件块该更大面积分配前先做自底向上权重预计算precompute_weights 一次遍历同时应用聚焦过滤、隐藏路径排除排序后二分前缀匹配O(log H)和尺寸模式行数/逻辑行/函数数/热度/均匀再用 apply_scale 压缩极端差值——线性、平方根、log₂、x^0.6 四种缩放小文件不会被大文件碾没。逐行构建宽高比最优贪心核心在 build_row从最大权重条目开始逐个试加入当前行用 worst_aspect_ratio 追踪行内最差宽高比一旦变差立即定行——这就是square 化的由来。随后 process_row 按比例切分行区域主循环 squarify 反复放一行、缩剩余视口直到耗尽。两个工程细节值得留意尾部兜底剩余空间塞不下正常矩形时emit_tail 以最小尺寸网格摆放保证 100 个小文件一个不丢有专门的浮点漂移回归测试。NaN 防御零权重、NaN 权重都不会产生 NaN 坐标test_zero_weight_items_no_nan 专门守护这一点。递归切分由 layout_treemap 驱动目录先扣除内边距和标题条chrome_for_depth 用简单规则而非小数启发式再对子节点调用 squarify避免幽灵空目录。依赖边路由L 形折线、边界裁剪与车道分配边路由的目标是最少弯折 永不穿块。compute_edge_path 的策略很直观两端裁剪到块边界起点按出块方向贴到源块边缘clip_source_to_border终点沿入线方向贴到目标块边缘还处理了端点落在块内的退化情况。0 弯折两中心近似水平/垂直对齐时直接画直线1 弯折否则按主导方向走 L 形正交路径拐角坐标还会被钳制到源块外部clamp_bend_outside防止折线穿过自己。当多个文件对之间存在 import/call/inherit 三类边同时存在时apply_lane_offsets 用规范化 (min,max) 字符串对分组assign_lanes 按 0、-1、1、-2、2 对称展开车道避免平行线段叠在一起。性能上compute_all_edge_paths 先把重复的 (from,to) 边聚合成带计数连接透明度、线宽随条数增强再用rayon::join三类边并行路由同时构建双向邻接索引EdgeAdjacency把每帧某文件连接了谁的查询从 O(E) 扫描降为 O(1)。实时高亮聚光灯模式、热度涟漪与虚线动画聚光灯高亮是最实时的交互悬停或选中文件时渲染器通过EdgeAdjacency查出它的所有邻居组成集合build_connected_set——命中者提亮、无关文件整体变暗边只画与活跃文件相连的那几条passes_spotlight。搜索框激活时同一套机制切换为匹配高亮、其余压暗。边与块的视觉区分靠虚线模式import 实线、call 虚线、inherit 点线draw_edge_line。draw_dashed_polyline 用累计长度让虚线图案跨拐角连续不重置每帧推进相位偏移形成流动动画——动画偏移特意用 f64 取模避免 4.5 小时后 f32 精度丢失。热度层由独立的 heat_overlay 处理编辑活动让对应块泛起涟漪光晕配合 Heat 配色模式最近谁在动一目了然——这正是 sentrux 作为实时架构传感器帮 AI Agent 闭合反馈环的视觉基础。关键源码文件速查模块路径布局总入口sentrux-core/src/layout/mod.rsSquarify 算法sentrux-core/src/layout/squarify.rs递归切分与目录装饰sentrux-core/src/layout/treemap_layout.rs权重与缩放sentrux-core/src/layout/weight.rs边路由与车道sentrux-core/src/layout/routing.rs边聚合与并行sentrux-core/src/layout/aggregation.rs每帧渲染编排sentrux-core/src/renderer/mod.rs文件块绘制与高亮sentrux-core/src/renderer/rects.rs边绘制与虚线动画sentrux-core/src/renderer/edges.rs、sentrux-core/src/renderer/edge_routing.rs视口变换与剔除sentrux-core/src/layout/viewport.rs小结sentrux 的 Treemap 渲染引擎是经典算法 工程防御的范例squarify 保证面积语义正确且形状美观L 形路由 车道分配让依赖网络在密集画布中依然可读邻接索引 视口剔除 LOD 降级则支撑起实时高亮的流畅体验。纯 Rust、无状态渲染、并行路由的设计让它能从容应对数万边的大仓库。【免费下载链接】sentruxReal-time architectural sensor that helps AI agents close the feedback loop, enabling recursive self-improvement of code quality. Pure Rust.项目地址: https://gitcode.com/gh_mirrors/se/sentrux创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考