Coding Challenge 181: Weighted Voronoi Stippling

Stippling is an artistic technique that uses numerous dots to craft an image. In this coding challenge I attempt to implement a weighted Voronoi stippling algorithm with along with the Delaunay triangulation package from . Code: ๐Ÿš€ Watch this video ad-free on Nebula Web Editor Sketches: ๐Ÿ•น๏ธ Weighted Voronoi Stippling: ๐Ÿ•น๏ธ Circumcircle: ๐Ÿ•น๏ธ Delaunay Triangulation: ๐Ÿ•น๏ธ Voronoi Diagram: ๐Ÿ•น๏ธ Voronoi Phyllotaxis: ๐Ÿ•น๏ธ Voronoi Diagram colored by area: ๐Ÿ•น๏ธ Lloydโ€™s relaxation: ๐Ÿ•น๏ธ Weighted Stippling - Size and Color: ๐Ÿ•น๏ธ Weighted Stippling - Abstract Pattern: ๐Ÿ•น๏ธ Weighted Stippling - Video: ๐ŸŽฅ Previous: ๐ŸŽฅ All: References: ๐Ÿ”— d3-delaunay: ๐Ÿ”— Weighted Voronoi Stippling: ๐Ÿ”— Sweep Line Algorithm: ๐Ÿ”— Lloydโ€™s algorithm: โ€™s_algorithm ๐Ÿ”— Polygons and meshes by Paul Bourke: ๐ŸŽจ Pablo Jurado Ruiz: ๐Ÿ”— Stippling: ๐Ÿ”— Voronoi Diagram: ๐Ÿ”— Delaunay Triangulation: ๐Ÿ”— Mike Bostockโ€™s Voronoi Stippling: @mbostock/voronoi-stippling Videos: ๐Ÿš‚ Pixel Array: Related Coding Challenges: ๐Ÿš‚ C4 Worley Noise: ๐Ÿš‚ 33 Poisson-disc Sampling: Timestamps: 0:00 Hello! 0:37 What is a Delaunay triangulation? 2:31 d3-delaunay package 2:49 Coding the delaunay triangulation. 6:38 What is a Voronoi diagram? 9:17 voronoi function on the delaunay object 10:25 Things you could try with the Voronoi diagram 10:56 Lloydโ€™s โ€œrelaxationโ€œ algorithm 12:07 Calculate the average of a polygonโ€™s vertices 15:30 Calculate the area of a polygon 16:45 Calculate the proper centroid of a polygon 18:47 What is stippling? 19:45 Draw dots based on brightness value of pixel 21:50 Calculate a weighted centroid 24:51 Using () 27:52 Ideas for you to try! 28:47 Goodbye! Editing by Mathieu Blanchette Animations by Jason Heglund Music from Epidemic Sound ๐Ÿš‚ Website: ๐Ÿ‘พ Share Your Creation! ๐Ÿšฉ Suggest Topics: ๐Ÿ’ก GitHub: ๐Ÿ’ฌ Discord: ๐Ÿ’– Membership: ๐Ÿ›’ Store: ๐Ÿ–‹๏ธ Twitter: ๐Ÿ“ธ Instagram: ๐ŸŽฅ Coding Challenges: ๐ŸŽฅ Intro to Programming: ๐Ÿ”— : ๐Ÿ”— Web Editor: ๐Ÿ”— Processing: ๐Ÿ“„ Code of Conduct: This description was auto-generated. If you see a problem, please open an issue: #delaunaytriangulation #imagestippling #voronoi #sweepalgorithm #lloydsalgorithm #p5js #javascript
Back to Top