SegmentTree

KO | EN

gitlite — search

#javascript #ai #typescript #golang #go #linux #docker #macos #nodejs #windows #cli #ios #openai #open-source

(★ 5)

一个基于 FTXUI 的交互式线段树可视化程序

SegmentTree 최신버젼 다운로드

최종 버전 다운로드 (.zip)

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

# 线段树可视化

![](https://raw.githubusercontent.com/2005czq/SegmentTree/main/images/demo.gif)

一个基于 FTXUI 的交互式线段树可视化程序，支持线段树建树、区间求和与区间加值的逐步演示。

## 功能特性

- ✨ 可视化：以树形结构直观展示线段树的每个节点
- 📊 逐步演示：记录并回放每一步操作，便于学习理解
- ⌨️ 键盘导航：支持方向键、Home/End 键快速浏览操作步骤
- 📖 详细说明：每个操作步骤都配有中文说明文字

提示：按 F11 全屏以获得最佳显示效果

## 系统要求

- 操作系统：Windows / Linux / macOS
- 编译器：支持 C++20 标准的编译器（如 GCC 10+、Clang 11+、MSVC 2019+）
- CMake：3.14 或更高版本
- Git（用于 CMake 下载依赖库）
- 依赖库：FTXUI

## 构建说明

1. 克隆或下载项目
    ```bash
    git clone https://github.com/2005czq/SegmentTree.git
    cd SegmentTree
    ```
2. 创建构建目录
    ```bash
    mkdir build
    cd build
    ```
3. 使用 CMake 配置项目
    ```bash
    cmake ..
    ```
4. 编译程序
    ```bash
    cmake --build .  # Windows
    make             # Linux / macOS
    ```
5. 运行程序
    ```bash
    .\app.exe        # Windows
    ./app            # Linux / macOS
    ```

## 使用说明

启动时会显示欢迎弹窗，介绍程序的功能和使用方法。点击按钮或按 Enter/Esc 键关闭弹窗进入主界面

### 顶部控制区

- 数组输入框：输入用空格分隔的整数，例如 `1 5 4 2 3 9 7`
- 处理区间：设置查询或更新的左右端点（闭区间 `[L, R]`）
- 加值输入框：区间更新时每个元素增加的值
- 操作按钮：
  - 🟢 构建树：根据输入数组构建线段树
  - 🔵 区间查询：查询指定区间的和
  - 🟡 区间更新：对指定区间的每个元素加上指定值
  - 🔴 清空树：清除当前线段树
- 步骤导航按钮：
  - 🟣 开头：跳转到第一步
  - ⚪ 上一步：回退一步
  - ⚪ 下一步：前进一步
  - 🟣 结尾：跳转到最后一步

### 底部演示区

- 说明图例（左上角）：颜色和符号的含义
- 步骤信息（顶部中央）：当前操作类型、步骤数和详细说明
- 树形展示（中央）：线段树的可视化结构

### 操作流程

- **构建线段树**
	1. 在 **数组** 输入框中输入数组，例如：`1 5 4 2 3 9 7`
	2. 点击 **构建树** 按钮
	3. 使用步骤导航按钮逐步查看建树过程
- **区间查询**
	1. 确保已经构建树
	1. 在 **处理区间** 中输入左右端点，例如：左 `2`，右 `4`
	1. 点击 **区间查询** 按钮
	1. 逐步浏览查询过程，最终会显示查询结果
- **区间更新**
	1. 确保已经构建树
	1. 在 **处理区间** 中输入左右端点，例如：左 `2`，右 `4`
	1. 在 **加值** 输入框中输入要增加的值，例如：`2`
	1. 点击 **区间更新** 按钮
	1. 逐步浏览更新过程
- **键盘快捷键**
	- 左方向键 ← ：上一步
	- 右方向键 → ：下一步
	- Home 键：跳到开头
	- End 键：跳到结尾

## 项目结构与技术细节

```
SegmentTree/
├── main.cpp              # 主程序入口
├── images/
│   └── demo.gif          # 演示动画
├── src/
│   ├── segtree.hpp       # 线段树核心实现
│   ├── state.hpp         # 可视化状态管理
│   ├── renderer.hpp      # 树形渲染模块
│   ├── ui.hpp            # 用户界面组件
│   └── utils.hpp         # 工具函数
├── CMakeLists.txt        # 项目构建配置文件
├── README.md
└── LICENSE
```

- `segtree.hpp`：线段树类，包含 `build`、`query`、`update` 三个核心方法
- `state.hpp`：记录每步操作的详细信息，支持前进、后退、跳转
- `renderer.hpp`：递归渲染树形结构，高亮当前节点和访问路径
- `ui.hpp`：封装 FTXUI 组件，提供交互界面

使用 [FTXUI](https://github.com/ArthurSonzogni/FTXUI) 库进行可视化构建

## 开源协议

本项目遵循 [MIT](./LICENSE) 开源协议

SegmentTree

SegmentTree 최신버젼 다운로드

오늘의 추천 프로젝트

Was this content helpful?

Recent Feedback

SegmentTree

SegmentTree 최신버젼 다운로드

오늘의 추천 프로젝트

Was this content helpful?

Recent Feedback

Download README