imgui-plot 使用指南

imgui-plot 使用指南

imgui-plot An improved plot widget for Dear ImGui, aimed at displaying audio data imgui-plot 项目地址: https://gitcode.com/gh_mirrors/im/imgui-plot


imgui-plot 是一个针对 Dear ImGui 的增强版图表控件,专为显示音频数据设计。它弥补了Dear ImGui中原有PlotLines()功能在显示细节上的不足,添加了如网格线、对数缩放以及自定义提示等实用特性。

安装指南

简易方法:最简单的集成方式是手动拷贝。只需将include/imgui_plot.hsrc/imgui_plot.cpp文件放置于您的Dear ImGui库同级目录下即可完成整合。

CMake集成:对于使用CMake作为构建系统的项目,推荐通过FetchContent模块自动化拉取并整合imgui-plot。在您的CMakeLists.txt中加入以下代码:

include(FetchContent)
FetchContent_Declare(imgui_plot
    GIT_REPOSITORY https://github.com/soulthreads/imgui-plot.git
    GIT_TAG v0.1.0
)
FetchContent_MakeAvailable(imgui_plot)
target_link_libraries(${PROJECT_NAME} PRIVATE imgui_plot)

记得适当地配置IMGUI_INCLUDE_DIR指向您的Dear ImGui源码位置(如果不同于默认路径)。

项目使用说明

imgui-plot强调通过结构体PlotConfig来配置图表参数,而非直接函数调用传递大量参数,以提升代码可读性。

简单示例

首先,初始化一个PlotConfig对象,设定必要的参数,然后调用ImGui::Plot来显示图表。

ImGui::PlotConfig conf;
conf.values.xs = x_data; // 可选:指定X轴数据
conf.values.ys = y_data; // 必须设置Y轴数据
conf.values.count = data_count; // 数据点数量
conf.scale.min = -1; // Y轴最小值
conf.scale.max = 1; // Y轴最大值
conf.tooltip.show = true; // 显示工具提示
conf.tooltip.format = "x=%.2f, y=%.2f"; // 提示信息格式
conf.grid_x.show = true; // 显示X轴网格
conf.grid_y.show = true; // 显示Y轴网格
conf.frame_size = ImVec2(400, 400); // 图表大小
conf.line_thickness = 2.f; // 折线宽度

ImGui::Plot("plot title", conf);

多数据流绘制

可以展示多个数据流,每个数据流使用不同的颜色。下面的代码演示了如何实现这一点,同时展示了选择区域的功能。

// 在draw_multi_plot函数中...
conf.values.ys_list = y_data; // 数据列表
conf.values.ys_count = 3; // 数据流数量
conf.values.colors = colors; // 配置每条线的颜色
conf.selection.show = true; // 开启选择区域
// ...更多配置...
ImGui::Plot("plot1", conf);

API使用文档

主要API围绕PlotConfig展开,关键字段包括但不限于:

  • values.xs: X轴数据指针。
  • values.ys, values.ys_list: 分别用于单线或多线绘图的Y轴数据。
  • values.count: 数据点总数。
  • scale.min/max: 设置Y轴的最小/最大值。
  • tooltip.{show, format}: 控制和定制工具提示。
  • grid_{x,y}.{show,size,subticks}: 控制网格线的显示和细分。
  • frame_size: 图表的尺寸。
  • line_thickness: 折线的粗细。
  • selection.{show,start,length}: 用于控制和反馈选择区域。

通过这些配置项,您可以高度自定义图表的外观和行为。


以上即为imgui-plot的基本使用和技术文档概览,通过这些步骤您应该能够顺利地将其集成到自己的应用中,并利用其强大的功能进行复杂数据的可视化展示。如果有更深入的问题或者需求,欢迎查看项目的GitHub仓库并参与讨论。

imgui-plot An improved plot widget for Dear ImGui, aimed at displaying audio data imgui-plot 项目地址: https://gitcode.com/gh_mirrors/im/imgui-plot

猜你喜欢

转载自blog.csdn.net/gitblog_01284/article/details/143049960