There is a function :

var h = Hermite.init('hermite-worker.js'); h.resize({ source: document.getElementById('image'), // any canvas or image elements, jQuery or native width: 400, height: 600, output: 'image', // [optional] `image` or `canvas`. If not entered output is same as input element. quality: 0.7, // [optional] applicable for `image` output only }, function(output) { //your callback }); 

I try to input the value of the previously created canvas as follows:

 canvas.getContext('2d').drawImage(img, X, Y, W, H, 0, 0, canvas.width, canvas.height); canvas.toDataURL("image/jpeg", 1.0); h.resize({ source: canvas, width: 400, height: 600, output: 'image', quality: 0.7, }, function(output) { //your callback }); 

... and I get an Uncaught TypeError: h.resize is not a function error Uncaught TypeError: h.resize is not a function Obviously, the function works before the canvas is written. If, on the input, not a canvas, but an image through the construction

 var image = new Image(); image.onload = function(){ h.resize({ source: image, ... 

That function works correctly. I tried a lot, including solutions like

 $.when( canvas.toDataURL("image/jpeg", 1.0) ).then(function(){ h.resize({ source: canvas, 

... but still the same result as an error.

I ask for help and advice on what to change in the code so that the function waits for the creation of the canvas, and then gets its value as input?

  • How did you not like the transfer of data to Image from the canvas and reading from there? - user207618
  • in a particular case, the original Image is not visible, created a copy of it, merged a canvas into it, but the function does not pick it up at the input. And there is no error, and it does not work. - 118_64

1 answer 1

I ask for help and advice on what to change in the code so that the function waits for the creation of the canvas, and then gets its value as input?

in this way, the function will be called after creating all the canvas

  $(window).load(function() { canvas.getContext('2d').drawImage(img, X, Y, W, H, 0, 0, canvas.width, canvas.height); canvas.toDataURL("image/jpeg", 1.0); h.resize({ source: canvas, width: 400, height: 600, output: 'image', quality: 0.7, }, function(output) { //your callback }); }); 

All that is connected with processing canvas and receiving information from the form transfer to

$ (window) .load (function () {...}

  • no error is issued, but the function does not pick up the canvas - 118_64
  • Updated the answer, try it. - Nikolay
  • the same result - 118_64