# 可视化二叉树

**Repository Path**: sparkyuan/visual-binary-tree

## Basic Information

- **Project Name**: 可视化二叉树
- **Description**: 输入二叉树数组，在网页中得到二叉树图形
- **Primary Language**: JavaScript
- **License**: MIT
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 1
- **Forks**: 1
- **Created**: 2022-08-13
- **Last Updated**: 2025-01-17

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 可视化二叉树



## 简介

一个简易的网页程序，用来将数组转化为二叉树图形

数组标准按照 **完全二叉树**（即**BFS**广度搜索结果）排序，非末尾的叶子结点，子树需要用null填充



## 使用

用一个**现代**浏览器打开html文件即可

古老版本IE会不兼容部分ES6+语法



## 输入

在输入框内依次输入数组元素，用逗号（英文标点）分割

不需要数组中括号

除了null填充外，其他非数字填充也会被识别为null

**注意**：没有二叉树合法性检查，所以请检查好输入内容再输入



## 功能

在输入框内输入元素后，会自动生成和更新二叉树图形

按下锁定按钮将禁止更新，锁定后再次点击解锁即可恢复

按下缩小和放大按钮可以改变图形的大小，但缩小最多缩小为原来的十分之一，放大最多放大为原来的两倍

清空会清除当前输入框所有内容以及已有二叉树图形，请谨慎使用



## 更新

现在二叉树视图区可以通过长按鼠标拖拽来改变位置

在二叉树视图区滑动鼠标滚轮也能缩放视图，向上滚动放大，向下滚动缩小，与缩放按钮同步

输入内容将不再强制要求用英文标点的逗号分隔，中英文逗号都能被识别