1x

A Segment Tree (ST) is a binary tree that is build on top of an (usually Integer) array so that we can solve the Range Min/Max/Sum (other variants are possible) Query (abbreviated as RMinQ/RMaxQ/RSumQ) as well as any Range (that includes Point) Update Query of this array in O(log N) time instead of the naive O(N) time. Given an array A of N (usually Integer) elements, we can build the corresponding RMinQ/RMaxQ/RSumQ Segment Tree in O(N) time.

Remarks: By default, we show e-Lecture Mode for first time (or non logged-in) visitor.
If you are an NUS student and a repeat visitor, please login.

🕑

To toggle between the RMinQ/RMaxQ/RSumQ Segment Tree, select the respective header. Note that there can be other type of range queries than the three classics shown in this visualization.

Pro-tip 1: Since you are not logged-in, you may be a first time visitor (or not an NUS student) who are not aware of the following keyboard shortcuts to navigate this e-Lecture mode: [PageDown]/[PageUp] to go to the next/previous slide, respectively, (and if the drop-down box is highlighted, you can also use [→ or ↓/← or ↑] to do the same),and [Esc] to toggle between this e-Lecture mode and exploration mode.

🕑

View the visualization of Segment Tree (tree on top of an array) here!

The tree on the top side shows the Segment Tree structure. The vertices are indexed in the same manner as with Binary Heap data structure where the root is at index 1 and the left/right child of a vertex p is 2*p/2*p+1, respectively. The value inside each vertex shows the MinIndex/MaxIndex/Sum value of the corresponding range/segment [L,R] of the underlying array A. We put "p:[L,R]" identifier in red color below each vertex except when L=R and that segment corresponds to a single array index (only that index is shown).

Vertices that are lazily updated will have this purple ring highlight. This lazy update technique will be explained in subsequent slides.

Pro-tip 2: We designed this visualization and this e-Lecture mode to look good on 1366x768 resolution or larger (typical modern laptop resolution in 2021). We recommend using Google Chrome to access VisuAlgo. Go to full screen mode (F11) to enjoy this setup. However, you can use zoom-in (Ctrl +) or zoom-out (Ctrl -) to calibrate this.

🕑

The bottommost row shows the content of the underlying array A (yellow colored) from which the Segment Tree structure is built.

Each leaf vertex in the Segment Tree corresponds to an individual index in the corresponding array A. For Min ST and Max ST, the leaf vertex in the Segment Tree contains the index itself (the minimum/maximum element of a subarray with just one element is that element itself). For Sum ST, the leaf vertex in the Segment Tree contains the only value of that single-element subarray.

Pro-tip 3: Other than using the typical media UI at the bottom of the page, you can also control the animation playback using keyboard shortcuts (in Exploration Mode): Spacebar to play/pause/replay the animation, / to step the animation backwards/forwards, respectively, and -/+ to decrease/increase the animation speed, respectively.

🕑

There are three basic operations that are available in Segment Tree data structure visualization (for all 3 modes: RMinQ/RMaxQ/RSumQ):

1. You can create RMinQ/RMaxQ/RSumQ Segment Tree from either a user-defined array of integers (maximum of 16 two-digits integer), or let the system provide a small random integer array or a small random but sorted integer array.
2. You can do RMinQ/RMaxQ/RSumQ by specifying a left (L) and a right (R) indices.
3. You can do Range Update by specifying a left (L) index, a right (R) index, and a new VALUE for this range [L,R]. We employ lazy update strategy for fast performance. You can still do Point Update (updating a single index only) by setting L = R.

For the details of these three operations, read CP4 or attend live CS3233 class.

🕑

Unfortunately, this data structure is not yet available in C++ STL, Python, Java API, or OCaml Standard Library as of 2024. Therefore, we have to write our own implementation.

Please look at the following C++/Python/Java/OCaml implementations of this Segment Tree data structure in Object-Oriented Programming (OOP) fashion: segmenttree_ds.cpp | py | java | ml

Again, you are free to customize this custom library implementation to suit your needs.

You have reached the last slide. Return to 'Exploration Mode' to start exploring!

Note that if you notice any bug in this visualization or if you want to request for a new visualization feature, do not hesitate to drop an email to the project leader: Dr Steven Halim via his email address: stevenhalim at gmail dot com.

🕑

>
values =

N =

L =
R =

L =
R =
VALUE =

#### 关于

VisuAlgo最初由副教授Steven Halim于2011年构思，旨在通过提供自学、互动式学习平台，帮助学生更深入地理解数据结构和算法。

VisuAlgo涵盖了Steven Halim博士与Felix Halim博士、Suhendry Effendy博士合著的书《竞技编程》中讨论的许多高级算法。即使过去十年，VisuAlgo仍然是可视化和动画化这些复杂算法的独家平台。

VisuAlgo仍然在不断发展中，正在开发更复杂的可视化。目前，该平台拥有24个可视化模块。

VisuAlgo配备了内置的问题生成器和答案验证器，其“在线测验系统”使学生能够测试他们对基本数据结构和算法的理解。问题根据特定规则随机生成，并且学生提交答案后会自动得到评分。随着越来越多的计算机科学教师在全球范围内采用这种在线测验系统，它可以有效地消除许多大学标准计算机科学考试中手工基本数据结构和算法问题。通过给通过在线测验的学生分配一个小但非零的权重，计算机科学教师可以显著提高学生对这些基本概念的掌握程度，因为他们可以在参加在线测验之前立即验证几乎无限数量的练习题。每个VisuAlgo可视化模块现在都包含自己的在线测验组件。

VisuAlgo已经被翻译成三种主要语言：英语、中文和印尼语。此外，我们还用各种语言撰写了关于VisuAlgo的公开笔记，包括印尼语、韩语、越南语和泰语：

id, kr, vn, th.

#### 团队

Associate Professor Steven Halim, School of Computing (SoC), National University of Singapore (NUS)
Dr Felix Halim, Senior Software Engineer, Google (Mountain View)

CDTL TEG 1: Jul 2011-Apr 2012: Koh Zi Chun, Victor Loh Bo Huai

Jul 2012-Dec 2013: Phan Thi Quynh Trang, Peter Phandi, Albert Millardo Tjindradinata, Nguyen Hoang Duy
Jun 2013-Apr 2014 Rose Marie Tan Zhao Yun, Ivan Reinaldo

CDTL TEG 2: May 2014-Jul 2014: Jonathan Irvin Gunawan, Nathan Azaria, Ian Leow Tze Wei, Nguyen Viet Dung, Nguyen Khac Tung, Steven Kester Yuwono, Cao Shengze, Mohan Jishnu

Jun 2014-Apr 2015: Erin Teo Yi Ling, Wang Zi
Jun 2016-Dec 2017: Truong Ngoc Khanh, John Kevin Tjahjadi, Gabriella Michelle, Muhammad Rais Fathin Mudzakir
Aug 2021-Apr 2023: Liu Guangyuan, Manas Vegi, Sha Long, Vuong Hoang Long, Ting Xiao, Lim Dewen Aloysius

Optiver: Aug 2023-Oct 2023: Bui Hong Duc, Oleh Naver, Tay Ngan Lin

Aug 2023-Apr 2024: Xiong Jingya, Radian Krisno, Ng Wee Han

List of translators who have contributed ≥ 100 translations can be found at statistics page.

NUS教学与学习发展中心（CDTL）授予拨款以启动这个项目。在2023/24学年，Optiver的慷慨捐赠将被用来进一步开发 VisuAlgo。

#### 使用条款

VisuAlgo并不是一个完成的项目。Steven Halim副教授仍在积极改进VisuAlgo。如果您在使用VisuAlgo时发现任何可视化页面/在线测验工具中的错误，或者您想要请求新功能，请联系Steven Halim副教授。他的联系方式是将他的名字连接起来，然后加上gmail dot com。