Hey, just want to say this was a huge help! This made me understand that the functions that are used in draw() like the rotate and scale are used for the canvas, not the shape itself. Thank you very much for this guide
Thanks for uploading this. One thing I've noticed about HTML canvas is that when zooming the resolution quickly looks really bad. What do you think is the best way to fix that? When zooming on DOM elements the images remain clear... I'd like that to occur with canvas too.
Fonts are generally vector elements designed to be resized smoothly. Canvas elements are pixel based raster images. Zooming in on a Canvas element is the same as zooming in on a jpeg or png.
Thankyou for sharing your knowledge. Coming from the C programming language, I see many powerful operational keywords but not a lot of descriptive variable names to help self document the code. does canvas ( and the other browser languages) rely on “user comments” to ensure coordinate translations , save / restores etc., help document, operational intent . I’m new to browser programming so just asking ? Thanks for this well done instructional!
JavaScript is the only language for client-side programming for the web. HTML5 has many APIs like the Canvas one to extend the functionality of websites. There is no self documentation for the code. There are tools that have been built to help with documentation like JSDoc - jsdoc.app/about-getting-started.html However, because JavaScript has been so rapidly changing and it is a first programming language for millions of developers standards for commenting and variable declaration are absent or lax.
Sir, I couldn't understand the difference between canvas pixels and css pixels. And what is the difference between width property defined in css and in javascript.
The canvas has a defined size - the width and height that you set in the HTML or JS. This defines how many pixels will be inside the Canvas. With CSS you can stretch or squash the Canvas size. This changes the size on the screen, but not the number of pixels inside the Canvas that it will render.
Subscribed! Thanks for the clear explanation.
You're my go-to channel for every javascript problem ❤
Hey, just want to say this was a huge help! This made me understand that the functions that are used in draw() like the rotate and scale are used for the canvas, not the shape itself. Thank you very much for this guide
was working on something with `rotate` for hours, then i saw your video and it clicked. Many, many thanks Steve
This is my go to video everytime I have to remind myself of canvas rotating, great tutorial. thank you!
Thank you, It was extremally useful.
Thanks for uploading this. One thing I've noticed about HTML canvas is that when zooming the resolution quickly looks really bad. What do you think is the best way to fix that? When zooming on DOM elements the images remain clear... I'd like that to occur with canvas too.
Fonts are generally vector elements designed to be resized smoothly.
Canvas elements are pixel based raster images. Zooming in on a Canvas element is the same as zooming in on a jpeg or png.
@@SteveGriffith-Prof3ssorSt3v3 Borders are resized smoothly when zoomed on... is it possible to make the canvas behave in the same way?
Thank you
Thankyou for sharing your knowledge. Coming from the C programming language, I see many powerful operational keywords but not a lot of descriptive variable names to help self document the code. does canvas ( and the other browser languages) rely on “user comments” to ensure coordinate translations , save / restores etc., help document, operational intent . I’m new to browser programming so just asking ? Thanks for this well done instructional!
JavaScript is the only language for client-side programming for the web. HTML5 has many APIs like the Canvas one to extend the functionality of websites. There is no self documentation for the code. There are tools that have been built to help with documentation like JSDoc - jsdoc.app/about-getting-started.html
However, because JavaScript has been so rapidly changing and it is a first programming language for millions of developers standards for commenting and variable declaration are absent or lax.
@@SteveGriffith-Prof3ssorSt3v3 Thanks Steve, this helps, I’ll add some strategic “reminder” comments to my code.
No dislike as of now WOW, Great Video!
Yeah. I have about 98% thumbs up on my videos
@@SteveGriffith-Prof3ssorSt3v3 You are Good Teacher
Great video 👍
Sir, I couldn't understand the difference between canvas pixels and css pixels. And what is the difference between width property defined in css and in javascript.
The canvas has a defined size - the width and height that you set in the HTML or JS. This defines how many pixels will be inside the Canvas.
With CSS you can stretch or squash the Canvas size. This changes the size on the screen, but not the number of pixels inside the Canvas that it will render.
@@SteveGriffith-Prof3ssorSt3v3 Thank you.
Very helpful
How do u put the word to the right