Coding Challenge 181: Weighted Voronoi Stippling

  Рет қаралды 182,170

The Coding Train

The Coding Train

Күн бұрын

Пікірлер: 204
@TheFlimTV
@TheFlimTV 11 ай бұрын
I love how this feels both like a University Lecture, and a kids educational channel!
@jounouchi123
@jounouchi123 3 ай бұрын
the pinnacle of eli5
@fuschia-draws
@fuschia-draws 2 ай бұрын
perfect videos for adults who loved bill nye as kids
@DanielMiclos
@DanielMiclos 11 ай бұрын
I just wanted to drop by and express my heartfelt appreciation for the amazing content you've been sharing on your channel. Your videos are not only educational, but also a huge source of inspiration for me and many others in the coding community. The generosity with which you share your knowledge and passion for coding is truly commendable. Thank you for being such a fantastic resource and for all the hard work you put into making complex concepts accessible and fun. Keep up the incredible work!
@tiagdvideo
@tiagdvideo 11 ай бұрын
100%!
@Haagimus
@Haagimus 11 ай бұрын
Would like to second this as well Daniel for making both education and programming fun and at the same time. I've watched you for years and years and I have always enjoyed everything that you've made, especially the coding challenges. For a little while, I even replicated some of the coding challenges in Python using the p5 package for python. Keep up the great stuff and don't ever stop Sir!
@arikardasis
@arikardasis 11 ай бұрын
I was going to say "This rules. You rule". But your's is more good words.
@xM0nsterFr3ak
@xM0nsterFr3ak 11 ай бұрын
14:40 "This is lovely, but it's collapsing into an black hole..." That's a very funny quote 😂
@GoldbergToastyBred
@GoldbergToastyBred 11 ай бұрын
it looks so organic there
@jaredgreen2363
@jaredgreen2363 11 ай бұрын
Accidentally made a gravity simulator…
@nicolaswinck9562
@nicolaswinck9562 11 ай бұрын
how fascinating it was to see Gloria Pickle turning into Gloria pixels! you make it look so easy!
@radadadadee
@radadadadee 11 ай бұрын
I program for a living and I couldn't agree more. He makes it looks so easy! But I know it's much more complicated, he's just so good at his job.
@orangejuice732
@orangejuice732 11 ай бұрын
In college a was an undergraduate research assistant converting a 2d voronoi lattice simulation to 3d. 7 years later I think I finally have a grasp on what that simulation was actually meant to do because of this video so thank you.
@conorohagan9947
@conorohagan9947 11 ай бұрын
I love your enthusiasm and I really appreciate that you show your mistakes and laugh about them. Let's be honest, learning to program is boring. You make it really fun.
@vcvracarkad
@vcvracarkad 11 ай бұрын
I'd love to see this done for each R G B channel individually. i think that would create a really cool comic book type of effect.
@mariovelez578
@mariovelez578 10 ай бұрын
Can’t believe this guy taught me so many wonders of coding back in the day and he’s still going! Keep up the good work!
@sentinelaenow4576
@sentinelaenow4576 11 ай бұрын
The Coding Train is by far the most awesome educational and inspiring coding lessons there is. Thank you so much for sharing your coding adventures, you are the best. ♥
@HeadmostCantaloupe
@HeadmostCantaloupe 9 ай бұрын
I love the new editing style Dan! Feels refreshing to see intros and the Apple ][ jingles being used in the beginning of the video!
@TheMasonX23
@TheMasonX23 11 ай бұрын
As a former graphics programmer, I loved this! Also, your enthusiasm and positivity is infectious! Love it man, always happy to hop on board!
@guzman-do
@guzman-do 5 ай бұрын
This channel is the best programming channel on KZbin... You make the most difficult concepts simple.. amazing
@MyCodingDiary
@MyCodingDiary 11 ай бұрын
You're doing a fantastic job. Don't ever stop creating!
@RyanMcCoppin
@RyanMcCoppin 9 ай бұрын
Dude, you are doing a great job. You are personally entertaining, you are providing problem solving techniques and the projects you are doing are very cool. I'm glad I found this channel.
@barco10001
@barco10001 11 ай бұрын
In all my (few) but intense years of learning creative coding I have not had a greater source of learning and inspiration from your channel. Your ways of teaching and exploring deep and complex topics of creative coding are amazing, fun, and highly enjoyable. The coding community cannot thank you enough!
@dr_ned_flanders
@dr_ned_flanders 11 ай бұрын
Wonderful video, Daniel. I love how each video is so visual and leads me to learn a new algorithm or mathematical technique as well as improving my coding.
@Rand00mThing
@Rand00mThing 11 ай бұрын
Wow I admire your coding skills. I could not do what you keep doing. I don't have the passion to always throw myself into new coding problems. I will never forget you, "Coding Rainbow" 🙏
@CocoaBeans660
@CocoaBeans660 11 ай бұрын
This guy makes me so happy and is such an inspiration for KZbin and coding in general. I love it
@hamiltonianpathondodecahed5236
@hamiltonianpathondodecahed5236 11 ай бұрын
Every time you introduce some idea, I feel like, "yeah sure, I know the math, that's how that works, no way you can implement it in a single video", then you simply code it up. I am amazed.
@cashewABCD
@cashewABCD 6 ай бұрын
Watching these for free, what a great world your building, thank you!
@pattvira
@pattvira 11 ай бұрын
I felt so relaxed watching this 😌with a nice touch of Dan's enthusiastic sounds every time he got the next thing to work. Jokes aside! Got lots of inspiration from this tutorial - thank you Dan!
@TheCodingTrain
@TheCodingTrain 10 ай бұрын
Thank you Patt!
@agzertuche
@agzertuche 11 ай бұрын
Thanks!
@krepker
@krepker 11 ай бұрын
Mindblowing His ability to pick some abstract concept and just use it to solve an real problem in minutes
@rohitwesley
@rohitwesley 11 ай бұрын
Hay i been braking my head on this algo for the last yr, was exploring how to go from delaney to nanite 😂 and went as mad as you have, 😅 the fact that u had a hard time, makes me not feel so dumb anymore, not to take anything away from you, love your stuff watch as many as i can, would love to see you experiment with shadertoy constraints and do some crazy stuff 😊
@munzeralseed
@munzeralseed 11 ай бұрын
Love it! It reminds me of a technique you used before, which is Floyd-Steinberg dithering. However, this one seems more challenging since you used an external library, but it sets a challenge to write the whole algorithm from scratch and optimize it, which I think I will attempt!
@TheCodingTrain
@TheCodingTrain 11 ай бұрын
oh, please do! I would love to see it!!!
@SianaGearz
@SianaGearz 11 ай бұрын
Floyd Steinberg performs error diffusion in some direction, whatever direction you're scanning towards, say towards bottom right, so if you apply it to a moving image, your start of scan is relatively stable say top left corner but your bottom right is very noisy. This isn't visible in static images, only moving. You could potentially start scanning out from the middle but that doesn't really solve the problem, it will still be obvious where the noise is eminating from. There's a more modern algorithm with a similar visual outcome to Floyd Steinberg but without bias in any direction, where you use a precomputed blue noise as a threshold function, and you can reuse the same across frames or use a spatiotemporal variant, and the way to compute this blue noise, the foundation is in this very video - Lloyd's Relaxation of a random point set. Blue noise sampling is the foundation of a lot of modern stochastic rendering methods in graphics. There's a whole research group at Nvidia concerned with blue noise.
@landsgevaer
@landsgevaer 11 ай бұрын
You don't need voronoi for how it was eventually done. You could just determine the point that is closest to the pixel ... (That point's voronoi cell will contain the pixel.)
@a.lollipop
@a.lollipop 7 ай бұрын
​@@landsgevaer the voronoi diagram is necessary for getting the polygons whose centroid the points move to.
@landsgevaer
@landsgevaer 7 ай бұрын
@@a.lollipop Like I said, you don't need it anymore the way it was eventually done. I gave the much simpler alternative above...
@JUNGELMAN2012
@JUNGELMAN2012 10 ай бұрын
Hands down....Black belt in coding. I love it.
@MarioTorre
@MarioTorre 11 ай бұрын
Pretty good stuff. This seems a very useful method to correctly simulate film grain in a digital photo
@dgo4490
@dgo4490 11 ай бұрын
This algorithm is good for relaxing UV maps for unfolded meshes for artist texturing. The "raster dots" effect can easily be achieved by averaging the image into boxes of n by n pixels and drawing a circle scaled to the magnitude of the average value. Instead of scaled the dot can also be proportionally occluded by another offset dot masking it out, or a hole dot within the dot and whatnot...
@GoldbergToastyBred
@GoldbergToastyBred 11 ай бұрын
Im so excited! I saw your video on nebula tv but i didnt had any subscription so i couldnt watch i didnt think you would upload it this early
@Hamomim1
@Hamomim1 11 ай бұрын
My brain hurt, but I was amazed by the beauty of mathematics and your explanation. I have been following it more or less for years. thanks
@astropgn
@astropgn 11 ай бұрын
This has been my favorite channel since I don`t know, 2017
@menaced.
@menaced. 11 ай бұрын
This is basically just shader math, you should try doing a video about/using glsl or hlsl, theres some fun stuff you can do with them, maybe use shader toy? (Never used it bc Im a gamedev so use shaders in engine/in opengl)
@paper_airplane
@paper_airplane 11 ай бұрын
Just wanted to note that there are more sophisticated stippling algorithms, like the one based on power diagrams, which is a generalization of Voronoi diagrams (implementing it _is_ a coding challenge). See "Blue noise through optimal transport" paper for details. Besides, you check whether the center of each pixel is inside the Voronoi cell to calculate its mass center. Considering each pixel as a square and calculating the intersection area with each Voronoi cell will give a significant quality improvement for the Lloyd algorithm.
@BillionPlusOne
@BillionPlusOne 10 ай бұрын
This was super fun to watch, thanks so much!
@gazzaka
@gazzaka 11 ай бұрын
You are brilliant...loving the videos, thanks 🙂
@Tomtekavler
@Tomtekavler 11 ай бұрын
I can't and have never coded in my life but i still love your videos!
@SianaGearz
@SianaGearz 11 ай бұрын
You can. Just start somewhere and one step at a time.
@Flackon
@Flackon 11 ай бұрын
Back in the day I made a random map generator and the coastlines and elevation features were drawn via voronoi diagrams. I coded the main app in p5 but also imported d3 for the voronoi computations, so, yeah. No shame in that, lol.
@aeschynanthus_sp
@aeschynanthus_sp 10 ай бұрын
The formula for the area of a polygon is the famous shoelace formula! Mathologer, among other people, has a nice video about it.
@kasperchristensen8416
@kasperchristensen8416 11 ай бұрын
Thank you for another great video, Mr. Shiffman 😁👍
@Autopawn
@Autopawn 11 ай бұрын
Thank you! Your work is inspiring 😄
@soadsam
@soadsam 11 ай бұрын
babe wake up! new coding train video just dropped!
@gfabasic32
@gfabasic32 11 ай бұрын
Such a great series!
@flameofthephoenix8395
@flameofthephoenix8395 10 ай бұрын
0:39 Yeah! I kind of am a little confused about that particular thing, currently what I've always thought them to be was when you take a bunch of points with a given radius, then starting with the highest radius and going down just render every circle, then bits closer to a point will be prioritized over ones further resulting in segments being created. But it was never really clear whether this was actually Voronoi or just another simpler method intended to replicate it.
@flameofthephoenix8395
@flameofthephoenix8395 10 ай бұрын
8:29 Ah! So, it sounds like the method I learned actually is Voronoi and it's much more efficient for finding the areas than the method of having each pixel calculate their distance.
@HomeofLawboy
@HomeofLawboy 11 ай бұрын
14:43 God coding the fabric of spacetime
@EXPLAIN_TO_YOURSELF
@EXPLAIN_TO_YOURSELF 10 ай бұрын
Maybe I should leave a comment on each video you upload. Whenever I'm coding or facing a task, I play one of your challenge videos. They inspire and empower me to overcome the obstacles in my tasks.
@adamgliwa896
@adamgliwa896 10 ай бұрын
Hard work, and good explanation. Very helpful! 👍
@mrmb84
@mrmb84 11 ай бұрын
The black hole! 😯 Unexpected but so cool!
@xenedon1509
@xenedon1509 11 ай бұрын
well that was awesome
@galzajc1257
@galzajc1257 11 ай бұрын
fun fact: we just had those in our first lecture of solid state physics this monday. i'm deffinitely tempted to make a 3D version of this, and make it efficiently, that seems like a fun geometric problem.
@ThugLifeModafocah
@ThugLifeModafocah 11 ай бұрын
I understood the absolute number of ZERO things. Thank you.
@PumpiPie
@PumpiPie 10 ай бұрын
amazing :D
@metallust
@metallust 11 ай бұрын
Cool as always
@allaze-eroler
@allaze-eroler 6 ай бұрын
It’s been YEARS (about 5 to 8 years) that i was looking something exactly that! It would have been immensely interesting to adapt it as a lizard skin! I’m now curious how it will be done with blender (open source 3D modeling software) my idea was to use the white color as inexistant scale while the black color would represent the smallest scale of a lizard. Your example is exactly what I’m trying to reproduce as a lizard skin generator! Anyway, thank again for the amazing video you did here!
@kevinrichter6503
@kevinrichter6503 10 ай бұрын
Small mistake on 9:07, where the last circumcircle of the right triangle should be. But overall, that was a fun and educational coding challenge! As always ;)
@PaulMurrayCanberra
@PaulMurrayCanberra 11 ай бұрын
@4:31 Other ways to convert an array of x/y into a flat array of pairwise numbers: const somePoints = [{x:1,y:2},{x:3,y:4},{x:5,y:6}]; const method2 = []; somePoints.forEach(p => { method2.push(p.x); method2.push(p.y); }); console.log(JSON.stringify(method2)); const method3 = somePoints.reduce((vec, p) => vec.concat([p.x, p.y]), []); console.log(JSON.stringify(method3)); .forEach is quite a bit better than writing for loops. .reduce is for functional programming weenies, although it is admittedly cool and tends to be compact.
@realcygnus
@realcygnus 11 ай бұрын
Good one Dan !
@aquelaquelaquelaquel
@aquelaquelaquelaquel 10 ай бұрын
Man.. I really love your videos although I don't code almost at all.. but damn i like how you integrate things that are pure abstractions for me into applicable real projects. You are a true professor.
@randospawn7495
@randospawn7495 11 ай бұрын
I like dithering in art, it looks cool
@kuoyulu6714
@kuoyulu6714 11 ай бұрын
I have no idea whats going on but this is so cool 😃
@vicentesoto1628
@vicentesoto1628 11 ай бұрын
geez xD this is high vibration content Loved it Is it maths, cs or stand up comedy though
@RaulScanavino
@RaulScanavino 7 ай бұрын
Please, can someone show me how to export the final stippling to a svg file. I'm not a programmer! Tks!
@tyhuffman5447
@tyhuffman5447 11 ай бұрын
Stunning as always!
@TheCodingTrain
@TheCodingTrain 11 ай бұрын
Thank you!
@knevari3952
@knevari3952 11 ай бұрын
You are the best !
@riccardoronconi2146
@riccardoronconi2146 11 ай бұрын
Well. This was pretty amazing
@aleksander5127
@aleksander5127 11 ай бұрын
​ I love your content. If you allow me, here is a suggestion. You could implement an algorithm to find the path to the goal on the Micro Mouse Race.
@IgneousGorilla
@IgneousGorilla 11 ай бұрын
Amazing video!
@PeterHellmich
@PeterHellmich 11 ай бұрын
Could be a beautiful effect to transform from the totally distributed dots to those of the image.
@munzeralseed
@munzeralseed 11 ай бұрын
He already did it with the logo at 0:09 and it looks so cool!
@PeterHellmich
@PeterHellmich 11 ай бұрын
Okay but how? Simply the reversed process?
@munzeralseed
@munzeralseed 11 ай бұрын
Yes I think so
@sachinsurya007
@sachinsurya007 10 ай бұрын
You are Bob Ross of programming
@HexaflexagonFan
@HexaflexagonFan 10 ай бұрын
the point where you made the points relax based on the centre of gravity could (maybe) be used for liquid simulation
@DarkoRomanov
@DarkoRomanov 11 ай бұрын
The black holee is mesmerizing
@glowiboi
@glowiboi 11 ай бұрын
Can you help me find the utility and applications of this technique?
@blacklion79
@blacklion79 11 ай бұрын
I wonder, is this algorithm used in high-end RIPs to convert gray-scale image to BW one for printing?
@anon_y_mousse
@anon_y_mousse 11 ай бұрын
This does look like fun. I think I'll try it in C with RayLib, and use color. This might make for a really cool image viewer.
@nangld
@nangld 11 ай бұрын
I have two question: Can you use it for 3d scenes? Can you use it to speedup machine vision?
@StefanWolfrum
@StefanWolfrum 11 ай бұрын
Wow, so cool!!! ❤
@frossida
@frossida 11 ай бұрын
How is this (or is it) related to denoising algorithms used in image processing?
@somedude5951
@somedude5951 11 ай бұрын
Would be great to have a shader for that effect.
@stabilini
@stabilini 11 ай бұрын
Amazing content, thanks !
@gsestream
@gsestream 9 ай бұрын
How about low resolution sampling of an image. Kinda same effect.
@tiosam1426
@tiosam1426 11 ай бұрын
It's a translation of light and shadow with a circle radius variation.
@yertzar775
@yertzar775 11 ай бұрын
This is actually part of Solid state Physics formulation of the K-Space for electrons
@clearwavepro100
@clearwavepro100 11 ай бұрын
Excellent!! :)
@Crazyclay78YT
@Crazyclay78YT 11 ай бұрын
oh man ive been wanting to do this
@nembobuldrini
@nembobuldrini 11 ай бұрын
fascinating and relaxing
@ineverchangemyplayericon3016
@ineverchangemyplayericon3016 11 ай бұрын
what?! its possible to not know generators? I now wonder if Blender uses Llyod's algo for its relax feature.
@samable9585
@samable9585 11 ай бұрын
I like ,relax, followed by head scratching 😂😂
@coder0xff
@coder0xff 11 ай бұрын
I wonder if there are simpler ways to achieve the same effect, like have the points attracted to dark pixels and repeled by eachother.
@zackel-baz9555
@zackel-baz9555 10 ай бұрын
I tried this myself before, I'm confused as to why your points don't all converge to the same point, considering the centroids all move to the centre of mass of the voronoi cells
@landsgevaer
@landsgevaer 11 ай бұрын
Instead of converting points to voronoi, and then figuring out which polygon a pixel is in, you could just determine which point is closest to the pixel... (The trick with remembering the previous pixel's index still works, or you could use a k-d Tree to make it efficient.)
@flameofthephoenix8395
@flameofthephoenix8395 10 ай бұрын
While unrelated to this particular video, surely this comment section is as good as any! I was thinking about how it may be nice to see what you can do with exclusively bill-boarding in 3d graphics, there's of course traditional bill boarding, but you can also make other bill boarding rendering techniques, like for instance rendering 3d lines, this is where you position your image in-between the projected versions of two points then scale it up according to the distance between them and rotate it to fit between, this works really well for a similar cost to standard bill-boarding, you can also do something similar to traditional bill boarding but where you place the image at the incenter of the projected version of a 3d triangle and of course scale it to the size of the incenter too, though I haven't worked out how you could also try incorporating rotation into that to make it a little better. Regardless, I'm curious just how far you could go with just methods like these, I've already made some interesting things with it like a spider since spiders are mostly just lines anyway that could be made out of the 3d line rendering, similarly skeletons would be easy, but for anything beyond that you may need to get super artistic with both traditional and incenter bill boarding plus possibly making new rendering techniques.
@jvsonyt
@jvsonyt 11 ай бұрын
15:08 it would be cool if you wrapped the averaging code in an "if then" with a size greater than or equal to like 9 pixels or something to limit how deep the blackhole became
@enderwiggins8977
@enderwiggins8977 11 ай бұрын
If you created a circle on every point which all expand at the same rate and had them ‘flatten’ when they collided with another circle would that create the voronoi diagram? I’m not sure how efficient that would be code-wise but I’m just curious as to whether it would work at all.
@PMA_ReginaldBoscoG
@PMA_ReginaldBoscoG 9 ай бұрын
What if you used this stippling in boids ? Would be glad if you make a version.
@pt_codes
@pt_codes 11 ай бұрын
I hope one of you train enthusiasts can answer this - how did you know the delaunay portion of the d3 library was available from the cdn (with that particular url)? I looked on the d3 site and I couldn't find the option of linking to just portions of the d3 libraries without using import statements etc. I much prefer your method of just putting it as a source in index.html, but don't know how to find that it exists? Great video!
@RikMaxSpeed
@RikMaxSpeed 11 ай бұрын
Lovely video but I lost count of the misspelled Dalaunays? 😅
@jackpot1377
@jackpot1377 Ай бұрын
can't find the long version... has it been deleted ?
@iamtimsson
@iamtimsson 11 ай бұрын
how did you and the paper fit under your pillow and did you use protection? twofish?
@apppples
@apppples 11 ай бұрын
I feel like maybe you could do this with spatial hashing. Like an oct tree, for each point we get its weight, and we find the nearest seed point at each iteration or something? idk. Sounds like something that'd be quite fast on gpu.
11 ай бұрын
Would it be possible to use both diagrams and other algorithms shown in this video to let's say, triangulate a person's unknown position? I'm no spy nor stalker of any sort, just remembered I was addicted to tv series called Numbers which used Math to solve crimes (of course in Hollywood style, but you get the point). My idea here is how Math can be used to almost anything in life, rather than drawing (which is awesome too).
@alwysrite
@alwysrite 11 ай бұрын
why the elevator music to fill in quiet spaces in video?
Coding Challenge 182: Apollonian Gasket Fractal
56:48
The Coding Train
Рет қаралды 90 М.
Coding Challenge 166: ASCII Text Images
22:42
The Coding Train
Рет қаралды 1,1 МЛН
BAYGUYSTAN | 1 СЕРИЯ | bayGUYS
36:55
bayGUYS
Рет қаралды 1,9 МЛН
Chain Game Strong ⛓️
00:21
Anwar Jibawi
Рет қаралды 41 МЛН
Coding Adventure: Ant and Slime Simulations
17:54
Sebastian Lague
Рет қаралды 1,9 МЛН
Coding Challenge 180: Falling Sand
23:00
The Coding Train
Рет қаралды 1,1 МЛН
Cones are MESSED UP - Numberphile
18:53
Numberphile
Рет қаралды 456 М.
Better Mountain Generators That Aren't Perlin Noise or Erosion
18:09
Josh's Channel
Рет қаралды 452 М.
Coding Challenge 168: MandelBulb 3D Fractal
28:02
The Coding Train
Рет қаралды 378 М.
An introduction to Shader Art Coding
22:40
kishimisu
Рет қаралды 1 МЛН
How do non-euclidean games work? | Bitwise
14:19
DigiDigger
Рет қаралды 2,5 МЛН
A simple procedural animation technique
8:31
argonaut
Рет қаралды 552 М.
Coding Challenge 179: Elementary Cellular Automata
21:41
The Coding Train
Рет қаралды 161 М.
BAYGUYSTAN | 1 СЕРИЯ | bayGUYS
36:55
bayGUYS
Рет қаралды 1,9 МЛН