imgui-plot 使用指南
imgui-plot 是一个针对 Dear ImGui 的增强版图表控件,专为显示音频数据设计。它弥补了Dear ImGui中原有PlotLines()
功能在显示细节上的不足,添加了如网格线、对数缩放以及自定义提示等实用特性。
安装指南
简易方法:最简单的集成方式是手动拷贝。只需将include/imgui_plot.h
和src/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仓库并参与讨论。