Coding Challenge #65.2: Visualizing a Binary Tree

Subscribers:
1,750,000
Published on ● Video Link: https://www.youtube.com/watch?v=KFEvF_ymuzY



Duration: 8:53
99,423 views
1,755


This multi-part coding challenge is part of the first week of my course: "Intelligence and Learning." Here I attempt to implement a classic data structure: The Binary Search Tree. Code: https://thecodingtrain.com/challenges/65-binary-tree

p5.js Web Editor Sketches:
๐Ÿ•น๏ธ Binary Search Tree: https://editor.p5js.org/codingtrain/sketches/pLFI8gCU9
๐Ÿ•น๏ธ Visualizing a Binary Tree: https://editor.p5js.org/codingtrain/sketches/UBGpfubd1

Other Parts of this Challenge:
๐Ÿ“บ Binary Search Tree: https://youtu.be/ZNH0MuQ51m4

๐ŸŽฅ Previous video: https://youtu.be/xXjRlEr7AGk?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH
๐ŸŽฅ Next video: https://youtu.be/MLtAMg9_Svw?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH
๐ŸŽฅ All videos: https://www.youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH

References:
๐Ÿ“• Intelligence and Learning (Spring 2017): https://github.com/shiffman/NOC-S17-2-Intelligence-Learning
๐Ÿ“˜ Grokking Algorithms book: http://amzn.to/2mMCK7Z
๐Ÿ”ด Live Stream Archive #87.3: https://youtu.be/hVSHlFjTeqg?t=11983s

Related Coding Challenges:
๐Ÿš‚ #68 Breadth-First Search: https://youtu.be/piBq7VD0ZSo
๐Ÿš‚ #98 Quadtree: https://youtu.be/OJxEcs0w_kE

Timestamps:
0:00 Visualizing the Binary Tree
1:15 Add a x and y position to each node
2:46 Draw the node
4:29 Draw a line between the nodes
7:03 Conclusion and suggested visualization variations

Editing by Mathieu Blanchette
Animations by Jason Heglund
Music from Epidemic Sound

๐Ÿš‚ Website: http://thecodingtrain.com/
๐Ÿ‘พ Share Your Creation! https://thecodingtrain.com/guides/passenger-showcase-guide
๐Ÿšฉ Suggest Topics: https://github.com/CodingTrain/Suggestion-Box
๐Ÿ’ก GitHub: https://github.com/CodingTrain
๐Ÿ’ฌ Discord: https://thecodingtrain.com/discord
๐Ÿ’– Membership: http://youtube.com/thecodingtrain/join
๐Ÿ›’ Store: https://standard.tv/codingtrain
๐Ÿ–‹๏ธ Twitter: https://twitter.com/thecodingtrain
๐Ÿ“ธ Instagram: https://www.instagram.com/the.coding.train/

๐ŸŽฅ Coding Challenges: https://www.youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH
๐ŸŽฅ Intro to Programming: https://www.youtube.com/playlist?list=PLRqwX-V7Uu6Zy51Q-x9tMWIv9cueOFTFA

๐Ÿ”— p5.js: https://p5js.org
๐Ÿ”— p5.js Web Editor: https://editor.p5js.org/
๐Ÿ”— Processing: https://processing.org

๐Ÿ“„ Code of Conduct: https://github.com/CodingTrain/Code-of-Conduct

This description was auto-generated. If you see a problem, please open an issue: https://github.com/CodingTrain/thecodingtrain.com/issues/new

#binarysearchtree #datastructure #intelligenceandlearning #javascript #p5js







Tags:
JavaScript (Programming Language)
live
programming
daniel shiffman
creative coding
coding challenge
tutorial
coding
challenges
coding train
the coding train
binary tree
binary search tree
data structure binary
data structure binary tree
binary tree javascript
binary search
binary search tree javascript
binary tree js
data structure javascript
computer science data structure
intelligence and learning
data visualization
binary tree visualization