Coding Challenge #54.1: Islamic Star Patterns
In this bonus super-sized coding challenge, I work through visualizing Islamic Star Patterns in p5.js. Code: https://thecodingtrain.com/challenges/54-islamic-star-patterns
p5.js Web Editor Sketches:
πΉοΈ Islamic Star Pattern - Part I: https://editor.p5js.org/codingtrain/sketches/b3wnFYeVs
πΉοΈ Islamic Star Pattern - Part II: https://editor.p5js.org/codingtrain/sketches/j-WTRIgjN
Other Parts of this Challenge:
πΊ Part 2: Update - Law of Sines: https://youtu.be/lobJ9gzbLo8
π₯ Previous video: https://youtu.be/bqF9w9TTfeo?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH
π₯ Next video: https://youtu.be/f5QBExMNB1I?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH
π₯ All videos: https://www.youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH
References:
π Points, lines, and planes: http://paulbourke.net/geometry/pointlineplane/
π Law of Sines on Wikipedia: https://en.wikipedia.org/wiki/Law_of_sines
β‘οΈ Gabriel Weymouth's Tweet on Star Patterns: https://twitter.com/gabrielweymouth/status/826890126747906048
π€ Craig S. Kaplan Lecture on Star Patterns: https://youtu.be/FBn6VgoF3fE
π University of Waterloo's Star Patterns Paper: http://www.cgl.uwaterloo.ca/csk/projects/starpatterns/
Links to Charities:
πΈ Refugees International: https://refugeerights.org/donate/
πΈ National Immigration Law Center: https://www.nilc.org/donate
πΈ International Rescue Committee: https://www.refugeesinternational.org/donate/
πΈ Urban Justice Center | Intl. Refugee Assistance Project: https://help.rescue.org/donate/refugees-need-urgent-support
Live Stream Archive:
π΄ Coding Train Live 75: Islamic Star Patterns: https://youtu.be/hCjTKCb2Cuw?t=1108s
Related Coding Challenges:
π #155 Kaleidoscope Snowflake #SupportP5: https://youtu.be/R3C2giDfmO8
Timestamps:
00:00 Introduction
03:10 References and theory
08:13 Code! Creating Polygon and Edge objects
14:46 Closing the Polygon
17:00 Creating Hankin objects
25:10 Rotating the Hankin objects correctly
27:13 How to find the point of intersection of Hankins
30:21 Code! Implementing the math of intersection points
43:54 Finding some of the intersection points
49:40 Finding all the intersection points
51:17 Getting rid of debugging stuff
51:38 Normalizing some vectors
52:08 Adding the delta on Hankins
54:45 Adding some sliders!
57:43 Creating the tiling
1:00:02 What's missing from this implementation?
1:03:53 Getting rid of the grid
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
#islamicstarpatterns #hankins #tilepattern #lawofsines #p5js #javascript