尧图网站建设 
Rerun BarChartView 视图完全指南柱状图蓝图的属性、数据流与源码实现解析【免费下载链接】rerunVisualize, query, and stream to train on multimodal robotics data.项目地址: https://gitcode.com/GitHub_Trending/re/rerun导读BarChartView是 Rerun 可视化框架中用于展示一维数据向量 / 1D 张量柱状图的蓝图视图类型。本文以官方参考文档 bar_chart_view.md 为核心骨架完整讲解该视图的两大属性组plot_legend与background、可可视化的数据源BarChart与 1DTensor并结合本仓库的 Python 示例片段、Rust 实现与测试用例从如何配置到底层如何渲染进行纵深剖析。读完本文你将掌握如何在 Python 蓝图中创建和定制BarChartView并理解其背后的组件描述符ComponentDescriptor与可视化器Visualizer工作机制。1. BarChartView 是什么BarChartView是 Rerun 蓝图Blueprint中的一种视图View类型专门用于渲染单个柱状图。在 blueprint/views/bar_chart_view.rs 中它被定义为由两个属性子结构组成的视图类plot_legend图例legend的配置background绘图背景的配置。需要特别注意的是参考文档与源码都明确标注了这一点⚠️此类型目前处于unstable状态未来可能以不向后兼容数据的方式发生重大变化。这意味着在编写依赖该视图的持久化蓝图时应关注后续版本对视图定义的可能调整。在 Rust 侧该视图的渲染入口位于 view_class.rs 中的BarChartView结构体其display_name()返回Bar chart图标使用re_ui::icons::VIEW_HISTOGRAM直方图语义图标布局优先级为LayoutPriority::Low即视图中没有数据时一般不会主动抢占布局空间。整个 crate 的职责在 crates/views/re_view_bar_chart/README.md 中概括为一句A View that shows a single bar chart。2. 视图属性详解参考文档列出了BarChartView的完整属性它们都由独立的蓝图 archetype 承载且默认值由 Rust 侧的 fallback provider 注册见下文 2.3 节。2.1plot_legend图例配置属性类型为PlotLegend包含两个字段字段类型含义默认值cornerCorner2D图例对齐到哪个角落右下角RightBottom源码注释明确写 Defaults to the right bottom cornervisibleVisible是否显示图例默认 trueTrue by default不过在view_class.rs的on_register中注册的 fallback 是Corner2D::RightTop右上角而非右下角system_registry.register_fallback_provider::Corner2D( PlotLegend::descriptor_corner().component, |_| Corner2D::RightTop, );两者看似矛盾实际含义不同plot_legend.rs中corner字段的 doc 注释描述的是PlotLegendarchetype 自身的文档化默认值而view_class.rs中注册的是BarChartView实际运行时使用的 fallback。在解释最终渲染行为时应以视图类注册的 fallback 为准右上角。这一细节也印证了阅读文档时需结合源码校验的重要性。在渲染端当legend_visible为真时view_class.rs 会使用re_plot::legend::LegendWidget以legend_corner指定的位置叠加绘制图例每个图例条目对应一个 data result实体路径并携带该实体图表对应的颜色用户点击图例条目可切换实体的可见性点击结果通过save_visible持久化到查询树tree中。2.2background绘图背景配置属性类型为PlotBackground包含两个字段字段类型含义colorColorRGBA绘图区背景颜色show_gridEnabled是否绘制网格渲染端在ui()方法中通过ViewProperty::from_archetype::PlotBackground读取这两个属性background_color被直接设置到 egui 的visuals.extreme_bg_color即整个绘图区的背景色show_grid控制Plot::new(bar_chart_plot).show_grid(...)是否绘制网格网格颜色与淡出效果来自re_ui::design_tokens_of_visuals设计令牌tokens.plot_grid_color/tokens.plot_grid_fade并启用clamp_grid(true)防止网格无限延伸。值得一提的是柱体颜色与背景的适配逻辑渲染时若背景亮度低于 0.5柱体填充色会采用 additive 混合模式egui_color.gamma_multiply(0.75).additive()否则用普通 gamma 乘法以保证深色背景下柱体依然醒目view_class.rs。2.3 属性是如何被解析的属性 archetype如PlotBackground、PlotLegend同样遵循 Rerun 的组件描述符机制。以PlotBackground为例其show_grid字段对应的组件是rerun.blueprint.components.Enabledplot_background.rsPlotLegend的corner对应Corner2D、visible对应Visibleplot_legend.rs。视图类在渲染时用component_or_fallback获取最终值——即用户未显式设置时使用 fallback provider 返回的默认值。3. 可视化数据源BarChart 与 1D Tensor参考文档Visualized archetypes一节明确列出了该视图支持的两类数据BarChartTensor仅限 1D 张量3.1 BarChart archetype 的字段BarChart在 archetypes/bar_chart.rs 中定义包含 4 个组件1 个必需 3 个可选字段组件类型必需?含义valuesTensorData✅ 必需柱高数值必须是一维张量向量colorColor可选柱体颜色abscissaTensorData可选每个值对应的横坐标一维张量长度须与 values 相同widthsLength可选每个柱的宽度x 轴单位默认 1长度须与 values 相同其组件描述符ComponentDescriptor如下values→BarChart:values类型rerun.components.TensorDatacolor→BarChart:color类型rerun.components.Colorabscissa→BarChart:abscissa类型rerun.components.TensorDatawidths→BarChart:widths类型rerun.components.Length3.2 可视化器的查询与校验在 visualizer_system.rs 中BarChartVisualizerSystem以BarChart:values作为唯一必需组件VisualizerQueryInfo::single_required_component。执行查询时对每个 data result 取LatestAt时间点上的TensorData只有当该张量is_vector()即一维向量时才继续处理分别读取abscissa带 fallback、color带 fallback、widths可选切片widths若未提供则通过typed_fallback_for::Length得到默认宽度数组并用clamped_vec_or_else将长度对齐到 values 的长度最终把每个实体路径映射为一份BarChartData { abscissa, widths, values, color }交给视图类渲染。这也解释了为什么 1DTensor也能被柱状图视图展示只要它是向量其TensorData就能匹配上BarChart:values的组件描述符。4. 实战示例用蓝图创建 BarChartView参考文档引用的是views/bar_chart示例片段其完整源码位于 docs/snippets/all/views/bar_chart.pyUse a blueprint to show a bar chart. import rerun as rr import rerun.blueprint as rrb rr.init(rerun_example_bar_chart, spawnTrue) rr.log(bar_chart, rr.BarChart([8, 4, 0, 9, 1, 4, 1, 6, 9, 0])) # Create a bar chart view to display the chart. blueprint rrb.Blueprint( rrb.BarChartView( originbar_chart, nameBar Chart, backgroundrrb.archetypes.PlotBackground( color[50, 0, 50, 255], show_gridFalse ), ), collapse_panelsTrue, ) rr.send_blueprint(blueprint)要点拆解数据记录rr.log(bar_chart, rr.BarChart([...]))把一个 1D 数值列表记录到实体bar_chart视图创建rrb.BarChartView(originbar_chart, nameBar Chart, ...)创建一个以bar_chart实体为原点origin的柱状图视图背景定制backgroundrrb.archetypes.PlotBackground(color[50, 0, 50, 255], show_gridFalse)演示了文档中background属性的两个字段——深紫半透明背景 关闭网格发送蓝图rr.send_blueprint(blueprint)将蓝图应用到当前会话并配合collapse_panelsTrue折叠侧边面板让柱状图独占视野。4.1 进阶自定义横坐标与柱宽Rust 版示例 与 Python 版 archetype 示例 展示了abscissa与widths的用法import rerun as rr rr.init(rerun_example_bar_chart, spawnTrue) rr.log(bar_chart, rr.BarChart([8, 4, 0, 9, 1, 4, 1, 6, 9, 0])) rr.log( bar_chart_custom_abscissa, rr.BarChart([8, 4, 0, 9, 1, 4], abscissa[0, 1, 3, 4, 7, 11]), ) rr.log( bar_chart_custom_abscissa_and_widths, rr.BarChart( [8, 4, 0, 9, 1, 4], abscissa[0, 1, 3, 4, 7, 11], widths[1, 2, 1, 3, 4, 1], ), )abscissa[0, 1, 3, 4, 7, 11]横坐标不必等距可表达非均匀采样的 x 轴刻度widths[1, 2, 1, 3, 4, 1]每个柱的宽度独立控制在 x 轴单位下取值默认 1。需要再次强调abscissa与widths的长度必须与values相同源码 doc 注释明确要求 same length as values否则会通过clamped_vec_or_else截断或按 fallback 补齐。4.2 测试用例佐证crates/views/re_view_bar_chart/tests/bar_chart_test.rs 中的test_bar_chart完整模拟了数据 蓝图 渲染链路用archetypes::BarChart::new(x())记录 100 个点的数据x()生成 0~100 均匀分布通过ViewBlueprint::new_with_root_wildcard(BarChartView::identifier())建立视图蓝图以 400×300 画布渲染并保存快照bar_chart_1d对应 bar_chart_1d.png。这验证了只要实体上有BarChart数据且视图中注册了BarChartVisualizerSystemBarChartView即可直接渲染出柱状图无需手动添加指示器indicator。5. 渲染管线与交互源码级原理5.1 柱体布局以柱中心定位view_class.rs 中的核心转换逻辑对每个实体的BarChartData先将其abscissa横坐标与values柱高分别从TensorBuffer的任意数值类型U8/I8/U16/I16/U32/I32/U64/I64/F16/F32/F64统一转为f64浮点随后计算每个柱center_x index 0.5 * width即每个柱的中心横坐标为横坐标值 半个柱宽柱体由egui_plot::Bar::new(center_x, value).width(width)构建同一实体的所有柱聚合成一个egui_plot::BarChart并以实体路径命名、以实体颜色着色、以entity_path.hash()作为绘图项 ID用于后续的 hover/点击命中。5.2 悬停检测与 tooltip悬停检测不依赖 egui_plot 内建机制而是基于上一帧的PlotTransform自行实现find_nearest_barview_class.rs光标距柱顶点的屏幕距离 ≤ 16pxTOOLTIP_INTERACT_RADIUS视为命中候选若光标落在某个柱的矩形范围内按 transform 将柱的左/右/顶/底换算为屏幕坐标则直接判定命中该柱命中后显示 tooltip内容为#索引、实体路径与格式化后的数值并把悬停/点击事件映射为Item::DataResult交给 viewer 的选择系统从而与选中面板、实体树联动鼠标悬停在图例上时不触发柱体 hover避免遮挡图例交互。5.3 交互控制BarChartView::help()中登记了完整的鼠标/滚轮交互view_class.rs操作触发方式Pan平移左键拖拽Horizontal pan横向滚动Zoom缩放滚动配合修饰键Zoom X-axis修饰键 横向滚动Zoom Y-axis修饰键 纵向滚动Zoom to selectionSELECTION_RECT_ZOOM_BUTTON 拖拽框选Reset view双击左键注具体修饰键如 Ctrl/⌘取决于操作系统视图内部使用 egui 默认输入选项未开放自定义。6. 稳定性与兼容性提示BarChartView及其属性 archetypePlotLegend、PlotBackground均标注为unstable官方文档与生成代码都提示数据可能不再向后兼容本文描述的字段结构、默认值与组件描述符均以当前仓库 rerun 的源码为准视图定义见 bar_chart_view.rs渲染实现见 view_class.rs数据查询见 visualizer_system.rs若需在代码中直接使用可在 Python 侧通过rerun.blueprint.views.BarChartView创建在 Rust 侧通过re_view_bar_chart::BarChartView实现ViewClasstrait注册使用。结语BarChartView虽然结构简单一个图例属性 一个背景属性但其背后是一套完整、严谨的可视化数据流蓝图属性通过 ComponentDescriptor 与 fallback 机制解析、可视化器按BarChart:values必需组件匹配一维数据、渲染层将任意数值类型张量统一转换为 f64 柱体坐标并实现了图例联动、柱体 hover、框选缩放等交互。希望本文能帮助你快速上手 Rerun 的柱状图视图并为阅读 bar_chart.rs 等底层实现提供清晰的索引。【免费下载链接】rerunVisualize, query, and stream to train on multimodal robotics data.项目地址: https://gitcode.com/GitHub_Trending/re/rerun创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考 Rerun BarChartView 视图完全指南：柱状图蓝图的属性、数据流与源码实现解析
Rerun BarChartView 视图完全指南柱状图蓝图的属性、数据流与源码实现解析【免费下载链接】rerunVisualize, query, and stream to train on multimodal robotics data.项目地址: https://gitcode.com/GitHub_Trending/re/rerun导读BarChartView是 Rerun 可视化框架中用于展示一维数据向量 / 1D 张量柱状图的蓝图视图类型。本文以官方参考文档 bar_chart_view.md 为核心骨架完整讲解该视图的两大属性组plot_legend与background、可可视化的数据源BarChart与 1DTensor并结合本仓库的 Python 示例片段、Rust 实现与测试用例从如何配置到底层如何渲染进行纵深剖析。读完本文你将掌握如何在 Python 蓝图中创建和定制BarChartView并理解其背后的组件描述符ComponentDescriptor与可视化器Visualizer工作机制。1. BarChartView 是什么BarChartView是 Rerun 蓝图Blueprint中的一种视图View类型专门用于渲染单个柱状图。在 blueprint/views/bar_chart_view.rs 中它被定义为由两个属性子结构组成的视图类plot_legend图例legend的配置background绘图背景的配置。需要特别注意的是参考文档与源码都明确标注了这一点⚠️此类型目前处于unstable状态未来可能以不向后兼容数据的方式发生重大变化。这意味着在编写依赖该视图的持久化蓝图时应关注后续版本对视图定义的可能调整。在 Rust 侧该视图的渲染入口位于 view_class.rs 中的BarChartView结构体其display_name()返回Bar chart图标使用re_ui::icons::VIEW_HISTOGRAM直方图语义图标布局优先级为LayoutPriority::Low即视图中没有数据时一般不会主动抢占布局空间。整个 crate 的职责在 crates/views/re_view_bar_chart/README.md 中概括为一句A View that shows a single bar chart。2. 视图属性详解参考文档列出了BarChartView的完整属性它们都由独立的蓝图 archetype 承载且默认值由 Rust 侧的 fallback provider 注册见下文 2.3 节。2.1plot_legend图例配置属性类型为PlotLegend包含两个字段字段类型含义默认值cornerCorner2D图例对齐到哪个角落右下角RightBottom源码注释明确写 Defaults to the right bottom cornervisibleVisible是否显示图例默认 trueTrue by default不过在view_class.rs的on_register中注册的 fallback 是Corner2D::RightTop右上角而非右下角system_registry.register_fallback_provider::Corner2D( PlotLegend::descriptor_corner().component, |_| Corner2D::RightTop, );两者看似矛盾实际含义不同plot_legend.rs中corner字段的 doc 注释描述的是PlotLegendarchetype 自身的文档化默认值而view_class.rs中注册的是BarChartView实际运行时使用的 fallback。在解释最终渲染行为时应以视图类注册的 fallback 为准右上角。这一细节也印证了阅读文档时需结合源码校验的重要性。在渲染端当legend_visible为真时view_class.rs 会使用re_plot::legend::LegendWidget以legend_corner指定的位置叠加绘制图例每个图例条目对应一个 data result实体路径并携带该实体图表对应的颜色用户点击图例条目可切换实体的可见性点击结果通过save_visible持久化到查询树tree中。2.2background绘图背景配置属性类型为PlotBackground包含两个字段字段类型含义colorColorRGBA绘图区背景颜色show_gridEnabled是否绘制网格渲染端在ui()方法中通过ViewProperty::from_archetype::PlotBackground读取这两个属性background_color被直接设置到 egui 的visuals.extreme_bg_color即整个绘图区的背景色show_grid控制Plot::new(bar_chart_plot).show_grid(...)是否绘制网格网格颜色与淡出效果来自re_ui::design_tokens_of_visuals设计令牌tokens.plot_grid_color/tokens.plot_grid_fade并启用clamp_grid(true)防止网格无限延伸。值得一提的是柱体颜色与背景的适配逻辑渲染时若背景亮度低于 0.5柱体填充色会采用 additive 混合模式egui_color.gamma_multiply(0.75).additive()否则用普通 gamma 乘法以保证深色背景下柱体依然醒目view_class.rs。2.3 属性是如何被解析的属性 archetype如PlotBackground、PlotLegend同样遵循 Rerun 的组件描述符机制。以PlotBackground为例其show_grid字段对应的组件是rerun.blueprint.components.Enabledplot_background.rsPlotLegend的corner对应Corner2D、visible对应Visibleplot_legend.rs。视图类在渲染时用component_or_fallback获取最终值——即用户未显式设置时使用 fallback provider 返回的默认值。3. 可视化数据源BarChart 与 1D Tensor参考文档Visualized archetypes一节明确列出了该视图支持的两类数据BarChartTensor仅限 1D 张量3.1 BarChart archetype 的字段BarChart在 archetypes/bar_chart.rs 中定义包含 4 个组件1 个必需 3 个可选字段组件类型必需?含义valuesTensorData✅ 必需柱高数值必须是一维张量向量colorColor可选柱体颜色abscissaTensorData可选每个值对应的横坐标一维张量长度须与 values 相同widthsLength可选每个柱的宽度x 轴单位默认 1长度须与 values 相同其组件描述符ComponentDescriptor如下values→BarChart:values类型rerun.components.TensorDatacolor→BarChart:color类型rerun.components.Colorabscissa→BarChart:abscissa类型rerun.components.TensorDatawidths→BarChart:widths类型rerun.components.Length3.2 可视化器的查询与校验在 visualizer_system.rs 中BarChartVisualizerSystem以BarChart:values作为唯一必需组件VisualizerQueryInfo::single_required_component。执行查询时对每个 data result 取LatestAt时间点上的TensorData只有当该张量is_vector()即一维向量时才继续处理分别读取abscissa带 fallback、color带 fallback、widths可选切片widths若未提供则通过typed_fallback_for::Length得到默认宽度数组并用clamped_vec_or_else将长度对齐到 values 的长度最终把每个实体路径映射为一份BarChartData { abscissa, widths, values, color }交给视图类渲染。这也解释了为什么 1DTensor也能被柱状图视图展示只要它是向量其TensorData就能匹配上BarChart:values的组件描述符。4. 实战示例用蓝图创建 BarChartView参考文档引用的是views/bar_chart示例片段其完整源码位于 docs/snippets/all/views/bar_chart.pyUse a blueprint to show a bar chart. import rerun as rr import rerun.blueprint as rrb rr.init(rerun_example_bar_chart, spawnTrue) rr.log(bar_chart, rr.BarChart([8, 4, 0, 9, 1, 4, 1, 6, 9, 0])) # Create a bar chart view to display the chart. blueprint rrb.Blueprint( rrb.BarChartView( originbar_chart, nameBar Chart, backgroundrrb.archetypes.PlotBackground( color[50, 0, 50, 255], show_gridFalse ), ), collapse_panelsTrue, ) rr.send_blueprint(blueprint)要点拆解数据记录rr.log(bar_chart, rr.BarChart([...]))把一个 1D 数值列表记录到实体bar_chart视图创建rrb.BarChartView(originbar_chart, nameBar Chart, ...)创建一个以bar_chart实体为原点origin的柱状图视图背景定制backgroundrrb.archetypes.PlotBackground(color[50, 0, 50, 255], show_gridFalse)演示了文档中background属性的两个字段——深紫半透明背景 关闭网格发送蓝图rr.send_blueprint(blueprint)将蓝图应用到当前会话并配合collapse_panelsTrue折叠侧边面板让柱状图独占视野。4.1 进阶自定义横坐标与柱宽Rust 版示例 与 Python 版 archetype 示例 展示了abscissa与widths的用法import rerun as rr rr.init(rerun_example_bar_chart, spawnTrue) rr.log(bar_chart, rr.BarChart([8, 4, 0, 9, 1, 4, 1, 6, 9, 0])) rr.log( bar_chart_custom_abscissa, rr.BarChart([8, 4, 0, 9, 1, 4], abscissa[0, 1, 3, 4, 7, 11]), ) rr.log( bar_chart_custom_abscissa_and_widths, rr.BarChart( [8, 4, 0, 9, 1, 4], abscissa[0, 1, 3, 4, 7, 11], widths[1, 2, 1, 3, 4, 1], ), )abscissa[0, 1, 3, 4, 7, 11]横坐标不必等距可表达非均匀采样的 x 轴刻度widths[1, 2, 1, 3, 4, 1]每个柱的宽度独立控制在 x 轴单位下取值默认 1。需要再次强调abscissa与widths的长度必须与values相同源码 doc 注释明确要求 same length as values否则会通过clamped_vec_or_else截断或按 fallback 补齐。4.2 测试用例佐证crates/views/re_view_bar_chart/tests/bar_chart_test.rs 中的test_bar_chart完整模拟了数据 蓝图 渲染链路用archetypes::BarChart::new(x())记录 100 个点的数据x()生成 0~100 均匀分布通过ViewBlueprint::new_with_root_wildcard(BarChartView::identifier())建立视图蓝图以 400×300 画布渲染并保存快照bar_chart_1d对应 bar_chart_1d.png。这验证了只要实体上有BarChart数据且视图中注册了BarChartVisualizerSystemBarChartView即可直接渲染出柱状图无需手动添加指示器indicator。5. 渲染管线与交互源码级原理5.1 柱体布局以柱中心定位view_class.rs 中的核心转换逻辑对每个实体的BarChartData先将其abscissa横坐标与values柱高分别从TensorBuffer的任意数值类型U8/I8/U16/I16/U32/I32/U64/I64/F16/F32/F64统一转为f64浮点随后计算每个柱center_x index 0.5 * width即每个柱的中心横坐标为横坐标值 半个柱宽柱体由egui_plot::Bar::new(center_x, value).width(width)构建同一实体的所有柱聚合成一个egui_plot::BarChart并以实体路径命名、以实体颜色着色、以entity_path.hash()作为绘图项 ID用于后续的 hover/点击命中。5.2 悬停检测与 tooltip悬停检测不依赖 egui_plot 内建机制而是基于上一帧的PlotTransform自行实现find_nearest_barview_class.rs光标距柱顶点的屏幕距离 ≤ 16pxTOOLTIP_INTERACT_RADIUS视为命中候选若光标落在某个柱的矩形范围内按 transform 将柱的左/右/顶/底换算为屏幕坐标则直接判定命中该柱命中后显示 tooltip内容为#索引、实体路径与格式化后的数值并把悬停/点击事件映射为Item::DataResult交给 viewer 的选择系统从而与选中面板、实体树联动鼠标悬停在图例上时不触发柱体 hover避免遮挡图例交互。5.3 交互控制BarChartView::help()中登记了完整的鼠标/滚轮交互view_class.rs操作触发方式Pan平移左键拖拽Horizontal pan横向滚动Zoom缩放滚动配合修饰键Zoom X-axis修饰键 横向滚动Zoom Y-axis修饰键 纵向滚动Zoom to selectionSELECTION_RECT_ZOOM_BUTTON 拖拽框选Reset view双击左键注具体修饰键如 Ctrl/⌘取决于操作系统视图内部使用 egui 默认输入选项未开放自定义。6. 稳定性与兼容性提示BarChartView及其属性 archetypePlotLegend、PlotBackground均标注为unstable官方文档与生成代码都提示数据可能不再向后兼容本文描述的字段结构、默认值与组件描述符均以当前仓库 rerun 的源码为准视图定义见 bar_chart_view.rs渲染实现见 view_class.rs数据查询见 visualizer_system.rs若需在代码中直接使用可在 Python 侧通过rerun.blueprint.views.BarChartView创建在 Rust 侧通过re_view_bar_chart::BarChartView实现ViewClasstrait注册使用。结语BarChartView虽然结构简单一个图例属性 一个背景属性但其背后是一套完整、严谨的可视化数据流蓝图属性通过 ComponentDescriptor 与 fallback 机制解析、可视化器按BarChart:values必需组件匹配一维数据、渲染层将任意数值类型张量统一转换为 f64 柱体坐标并实现了图例联动、柱体 hover、框选缩放等交互。希望本文能帮助你快速上手 Rerun 的柱状图视图并为阅读 bar_chart.rs 等底层实现提供清晰的索引。【免费下载链接】rerunVisualize, query, and stream to train on multimodal robotics data.项目地址: https://gitcode.com/GitHub_Trending/re/rerun创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考