How to distort an image using HTML 5 Canvas

Question

How to distort an image using HTML 5 Canvas

Asked 9 years, 1 month ago

Viewed 270 times

1

I need to apply this image:

In different shapes, such as cups, bracelets, T-shirts, such as these examples

I tried with component of AspJpeg, but I saw with the developers who made this component that it is not possible to round the way it needs, only straight application.

Now I’m studying a way to be by HTML5 tagged Canvas, but I’m not getting it.

Personal thank you!

Gustavo, do you want the edges of the image to be rounded, that’s all? http://www.1stwebdesigner.com/wp-content/uploads/2010/03/html5-css3-generators/border-radius-html5-css3-tools-generators.jpg . See if it’s something similar you want (rectangle)

– mauricio caserta

2015/10/02 at 20:33
No, what I need is for the image to also be in the format, bend together

– Gustavo Sapienza

2015/10/03 at 23:29

1 answer

Browser other questions tagged html5 asp canvas

You are not signed in. Login or sign up in order to post.

by MarceloBarbosa • **221** points · Answer 1 · 2015-11-17T18:16:31+00:00

To do this requires a very large job as it requires a point-to-point modification.

Look at this demonstration I could find DEMO

Source: https://stackoverflow.com/questions/22377416/how-to-warp-image