Тёмный

(Ep2) Mandala Maker in JavaScript (functional style) 

Christopher Okhravi
Подписаться 158 тыс.
Просмотров 2,2 тыс.
50% 1

Let's build a mandala maker in JavaScript and HTML canvas, using concepts from functional programming 😊😋
⭐️ Support the channel on Patreon:
/ christopherokhravi
Links mentioned in this video:
ramdajs.com/do...
math.stackexch...
mandalamaker.on...

Опубликовано:

 

15 окт 2024

Поделиться:

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 6   
@Baroquepassion
@Baroquepassion 3 года назад
watching the beginning of this video, one thing I can't help but feel (as someone who isn't very familiar with these functional concepts) is that there's an implicit tradeoff between how simple/general these functions and how readable the code is.
@cprn.
@cprn. 5 лет назад
On a possibly unrelated note, I can recommend watching Coding Math, video series on trigonometry and its practical applications to game physics by Keith Peters. It is an interesting subject on its own but most importantly starting around episodes 5 and 6 it explains how vector rotation works and I believe it can be used to create an arbitrary number of points arranged around an elliptical orbit that could possibly replace your list of transformations with something more general. I can't be entirely sure it'll work without actually implementing it but you seem to like to explore different approaches, therefore, some food for thoughts. Nice video, keep them coming. Cheers.
@ChristopherOkhravi
@ChristopherOkhravi 5 лет назад
Excellent food for thought! I will definitely check it out! Thanks a bunch!
@benoitgrelard
@benoitgrelard 5 лет назад
Hey Christopher, I would love to read that huge comment you showed at the beginning but for some reason I do not see it in the comments section of Episode 1. Was it a private comment? Are you able to point me to it? Thanks!
@francescodente2876
@francescodente2876 5 лет назад
What about using polar coordinates? It makes it a lot easier to calculate the points given the number of "slices" to divide the plane into. If you express each point as the angle theta from the positive x axis and the distance r from the origin you can derive the 8 points by adding 90 degrees to the starting theta each time. And you can also calculate "mirroring" by applying the same process using (90-theta) as the starting angle. Then you can easily convert to cartesian coordinates like this: x=r*cos(theta) y=r*sin(theta) Hope it helps.
@tristanforward9094
@tristanforward9094 5 лет назад
Great video watched the whole thing, starting to think your cats name is "The cat". At the end of the video you consider redrawing the canvas each time but then think there is another approach that is better performance. Unfortunately, the canvas for animation has to be redrawn each time does not "remember" where it drew things. So a separate state is needed. Using window.requestAnimationFrame() is also best option for creating a smooth render. And finally this article by Peter Jang: A Functional Canvas Approach With Redux would be insightful medium.com/@peterxjang/a-functional-canvas-approach-with-redux-ce59a369241b Great stuff Chris and glad and I found your channel
Далее
Only Use Inheritance If You Want Both of These
9:10
Просмотров 18 тыс.
Outsmarted 😂
00:20
Просмотров 2,3 млн
ITZY "GOLD" M/V
03:20
Просмотров 3,4 млн
7 Tips to Grow as a Developer
7:25
Просмотров 15 тыс.
Liskov Substitution Principle
20:16
Просмотров 13 тыс.
The Weird History of JavaScript
12:09
Просмотров 1,2 млн
How To Think Like A Programmer
1:00:07
Просмотров 2 млн
Rules Have Reasons (Always Ask Why)
11:49
Просмотров 13 тыс.
If Your Tech Job is Comfortable, You're in Danger
20:57
JavaScript Pro Tips - Code This, NOT That
12:37
Просмотров 2,5 млн
Depend on Abstractions not Concretions (Framework)
11:56