Graph Animation Code Step by Step in repl.it/python/pygame

Опубликовано: 09 Февраль 2025
на канале: Professor Gerry Jenkins
7,806
143

Graph animation code step by step: Written in Python/PyGame to animate a BFS Graph algorithm to help visualize how the algorithm works. (play with code at https://repl.it/talk/share/Graph-Anim...

This is a video that shows how to animate a visual of a the Breadth First Search (BFS). As the algorithm steps though searching a graph, each step in the algorithm show progress by coloring nodes and edges so that a CS Data Structure student can understand how the BFS algorithm works

I step though the code within the repl.it IDE environment, which is a great IDE environment for student and coders to play with code and share and publish their work.

I show the development of the code in three stages, so you can see how I incrementally develop the program.

Links:
To repl.it code base: https://repl.it/talk/share/Graph-Anim...
To my YouTube BFS and DFS animations set to music:
BFS:    • Animated Visualization BFS Algorithm:...  
DFS:    • Animation of Graph DFS(depth first se...  
How to use sprites:    • PyGame draw cycle, flip, sprites, and...  

Video Chapters:
00:00 Intro to my popular YouTube BFS animation set to music
00:29 Repl.it introduction
00:56 The main code demo program
02:11 Drawing the Nodes as circles
04:43 Trick to drawing circle with inside fill color of desired thickness
06:24 Adding the edges, with more colors
10:43 refactor drawing circles into method
11:05 Doing the while animation
12:43 refactor all drawing into one method
13:18 add update method to do end of loop clock and display update tasks
14:40 the main algorithm loop, we set colors when things happen
17:04 What to do after, learn about using sprites in pygame