Coding Train Live 71: Coding Challenges: Circle Packing and White House Data Visualization

Channel:
United States The Coding Train
Subscribers:
1,740,000
Published on ● Video Link: https://www.youtube.com/watch?v=pF0cadg2mg0


Duration: 3:49:59
100,997 views
2,093

In this first Live Stream of 2017, I look at a simple algorithm for "Circle Packing" and animate the process of filling a 2D space with non-overlapping circles of various sizes, colors and positions.

I also discuss the newly released social media data from the Obama Administration and make a couple simple data visualization examples.

πŸ’» Circle Packing challenge https://thecodingtrain.com/challenges/50-animated-circle-packing
πŸ’» White House Social Media Data Visualization challenge https://thecodingtrain.com/challenges/48-white-house-social-media-data-visualization
πŸ’» Photo Mosaic from Obama's Social Media Images https://thecodingtrain.com/challenges/49-photo-mosaic-with-white-house-social-media-images

Timestamps:
17:30 - Intro to today's first topic
22:02 - Coding Challenge: Circle Packing
1:14:43 - Back from break
1:58:48 - CC: White House Social Media Data Visualization
2:55:48 - CC: Photo Mosaic from Obama's Social Media Images
3:36:51 - Coding Challenge: Circle Packing Kitten Image
3:42:50 - Q&A/Conclusion

πŸš‚ 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

Resources:
The White House Social Media Data is available here: https://www.whitehouse.gov/blog/2017/01/05/new-lenses-first-social-media-presidency
Julien Leonard's Various Circle Packing Tutorials: http://julienleonard.com/tutorials.html
ITPNYU's Obamathon repo: https://github.com/ITPNYU/Obamathon
Kittens Song: https://soundcloud.com/lostghbear/lostghbear-podopleloff-kittens-feat-dan-shiffman
This Dot Song on Soundcloud: https://soundcloud.com/kristianpedersen/this-dot-feat-daniel-shiffman?in=kristianpedersen/sets/coding-rainbow-remixes

Source Code for the all Video Lessons: https://github.com/CodingTrain/Rainbow-Code

Help us caption & translate this video!

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



Other Videos By The Coding Train


2017-01-27Coding Challenge #52: Random Walker
2017-01-26Live Stream #73: Random Walk
2017-01-18Coding Challenge 51.3: A* Pathfinding Algorithm - Part 3
2017-01-17Coding Challenge 51.2: A* Pathfinding Algorithm - Part 2
2017-01-16Coding Challenge 51.1: A* Pathfinding Algorithm - Part 1
2017-01-13Live Stream #72: A* Pathfinding Algorithm
2017-01-10Coding Challenge #50.2: Animated Circle Packing - Part 2 (Kitten Addendum)
2017-01-09Coding Challenge #50.1: Animated Circle Packing - Part 1
2017-01-06Coding Challenge #49: Photo Mosaic with White House Social Media Images
2017-01-06Coding Challenge #48: White House Social Media Data Visualization
2017-01-05Coding Train Live 71: Coding Challenges: Circle Packing and White House Data Visualization
2016-12-23ITP Winter Show 2016
2016-12-21Coding Challenge #47: Pixel Sorting in Processing
2016-12-20Guest Tutorial #3: Spring Animations and p5.js with Val Head
2016-12-19Guest Tutorial #2: Web Animations and Mo.js with Sarah Drasner
2016-12-16Coding Challenge #46.2: Asteroids with p5.js - Part 2
2016-12-15Coding Challenge #46.1: Asteroids with p5.js - Part 1
2016-12-14Live Stream #70: Coding Challenges: Asteroids and Pixel Sorting
2016-12-11Coding Challenge #45: Saving p5.js Drawings to Firebase
2016-12-109.3: Firebase: Retrieving Data - Programming with Text
2016-12-099.2: Firebase: Saving Data - Programming with Text


Tags:
JavaScript (Programming Language)
live
programming
daniel shiffman
creative coding
p5.js
coding challenge
p5.js tutorial
p5js
javascript (programming language)
tutorial
javascript
algorithms
processing load pixels
coding
challenges
circle packing
photo mosaic
obama photo mosaic
white house data visualization
data visualization
processing pixel
white house social media
obama social media data
twitter data viz
twitter data visualization
obama data visualization