The latest articles on DEV Community by Jakub Bednár (@fuco). https://dev.to/fuco https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F1155851%2Fbf67dc48-9357-4390-9b1b-0018c931a592.png https://dev.to/fuco en Jakub Bednár Thu, 07 Sep 2023 15:44:16 +0000 https://dev.to/fuco/advanced-html-canvas-tutorials-for-image-editor-l9o https://dev.to/fuco/advanced-html-canvas-tutorials-for-image-editor-l9o <p>Hello there! Do any of you guys happen to have some good resources for learning HTML Canvas? I have worked on a few things already, but I still lack experience with Canvas 😃 I would like to know how to handle canvas like a photo editor, meaning creating one canvas as a background and placing an image as a second canvas element inside of it, where the image can be masked in various ways, moved around the screen, zoomed in, etc. For example, <a href="http://www.remini.ai">www.remini.ai</a> has a similar editor, or <a href="http://www.canva.com">www.canva.com</a> itself.</p> <p>As for resources, I've already searched around a bit, but I haven't seen explanations of similar features like zooming, and so on. I know there are libraries like panzoom, but I need to build a lot of functionality around it, and panzoom definitely won't be enough for me. I want to learn it because of future scaling of the Canvas feature itself, and I don't think that any library will be that helpful for me. </p> <p>Thank you very much for reading !</p> webdev javascript tutorial react