javascript - getImageData convert to toDataURL HTML5 -


Is there a way to get image data from getImageData to toDataURL in HTML5?

  var pixeladata = CTXGetimageData (X - (linewidth / 2), Y - (linewidth / 2), linewidth, linewidth);   

The position of the mouse pointer on the x and y canvas is, I am creating the drawing app to get image data from the current canvas and put it in a new canvas. Any ideas from that image data I want to create patterns with createPattern ? Please help me

You need getImageData to copy a part of canvas 1 on canvas 2 is not.

(getImageData is slow)

Just create a floating canvas and make a picture of the canvas image in a temporary canvas.

Then use the canvas to create a pattern for canvas 2.

  var pattern = ctx2.createPattern (patterncanvas, 'repeat');   

All canvas 1 patterns will be used as this is also easy to do so:

  var pattern = ctx2.createPattern (canvas 1, 'Repeat');   

Example code and demo:

  var canvas1 = document.getElementById ("canvas1"); Var ctx1 = canvas1.getContext ("2D"); Var canvas2 = document. GetElementById ("canvas2"); Var ctx2 = canvas2.getContext ("2D"); Var pattern consonant = document.createElement ("canvas"); Var pattern CTX = PatternCanvas.GetConttex ("2D"); Var img = new image (); img.onload = Start; Img.src = "https://dl.dropboxusercontent.com/u/139992952/stackoverflow/facesSmall.png"; Start the function () {ctx1.drawImage (IMG, 0,0); patternCanvas.width = 80; patternCanvas.height = 47; PatternCtx.drawImage (canvas1,0,0,80,47,0,0,80,47); Var Pattern = ctx2.createPattern (patternCanvas, 'repeat'); Ctx2.fillStyle = Pattern; Ctx2.fillRect (0,0, canvas2.width, canvas2.height); }    

Comments

Popular posts from this blog

Pass DB Connection parameters to a Kettle a.k.a PDI table Input step dynamically from Excel -

multithreading - PhantomJS-Node in a for Loop -

c++ - MATLAB .m file to .mex file using Matlab Compiler -