How to resize then crop an image with canvas

Question

I already know how to

-> resize an image:

var image = document.getElementById(\'myImage\'),
    canvas = document.createElement(\'canvas\'),
    ctx          


        

Answer 1

I took this tutorial as an example http://tympanus.net/codrops/2014/10/30/resizing-cropping-images-canvas/ and did the same thing in vanilla js. It probably needs some refacturing but it is working (at least on my windows labtop in chrome)

One html file:

 




 
  
 

    
    
    
    
    


    

    

Crop