This video did a WAY better job of explaining these concepts than all of the other resources I've seen so far (some of which you showed previews of). Massive thanks for putting this together!
Brilliant! Crisp, clear and sharp tutorial. Crisp presentation, clear in explanation and sharp and quickly to the point, many thanks I now understand viewBox much better.
@4:35 so you removed the viewport height and size of 200px. The svg stretchs to the body element, therefore its no longer 200x200 and the squares are no longer 100x100, right? So how comes the viewBox coordinates 100 100 100 100 give you the fish? If u didn’t remove the width and height 200x200 then it would make sense to me.
Thank you for watching so carefully. It is a tricky subject but things are all working as they should as I demonstrated. SVG images have multiple coordinate systems. The viewBox coordinates of 100 100 100 100 are the "real" coordinates of the svg based on how it was originally designed, not how it is displayed in the browser according to the current view port settings. This whole subject took me awhile to fully understand. I strongly recommend this article by Sara Souiedan if you want to get more technical: www.sarasoueidan.com/blog/svg-coordinate-systems/ Thanks again for watching!
This video did a WAY better job of explaining these concepts than all of the other resources I've seen so far (some of which you showed previews of).
Massive thanks for putting this together!
Awesome. So glad you liked it!
Brilliant! Crisp, clear and sharp tutorial. Crisp presentation, clear in explanation and sharp and quickly to the point, many thanks I now understand viewBox much better.
Thanks so much for watching and commenting. So glad it helped.
Thank you very much. finally what i was looking for. your the man
thank you so much for the amzing content bud, this is a treasure wish you the best man
It’s so good to be appreciated. Thx so much for watching and the nice comment.
absolutely awesome, thanks a lot.
amazing example!
Thank you very much, your videos are always clear to understand for newbies like me! :)
So glad you enjoyed it. Thx so much for the feedback!
Thanks bro, you're an absolute legend!
Glad you liked it. Thx for watching.
wonderful stuff, thank you so much.
Glad you liked it.
Dog hack is awesome! 😂 Good job, bro! 🤜
Thx!
@4:35 so you removed the viewport height and size of 200px. The svg stretchs to the body element, therefore its no longer 200x200 and the squares are no longer 100x100, right? So how comes the viewBox coordinates 100 100 100 100 give you the fish? If u didn’t remove the width and height 200x200 then it would make sense to me.
Thank you for watching so carefully. It is a tricky subject but things are all working as they should as I demonstrated. SVG images have multiple coordinate systems. The viewBox coordinates of 100 100 100 100 are the "real" coordinates of the svg based on how it was originally designed, not how it is displayed in the browser according to the current view port settings. This whole subject took me awhile to fully understand. I strongly recommend this article by Sara Souiedan if you want to get more technical: www.sarasoueidan.com/blog/svg-coordinate-systems/ Thanks again for watching!
Thank you so much!!!!!
thank you
Learn Everything I know about GreenSock for only $2.95/mo
www.creativecodingclub.com/bundles/creative-coding-clubs?src=viewBox