javascript - drawImage (canvas) is not working -


i want draw multiple canvases on single canvas using drawimage() method not working code

<html>  <head>   <script>     window.onload = function() {     var context1= document.getelementbyid("canvas1").getcontext("2d");     var context2  = document.getelementbyid("canvas2").getcontext("2d");     var context3  = document.getelementbyid("canvas3").getcontext("2d");      context1.font = "20pt calibri";     context1.fillstyle = "blue";     context1.filltext("hello ", 50, 25);      context2.font = "20pt calibri";     context2.fillstyle = "red";     context2.filltext("world!", 100, 25);      var imageobj = new image();      imageobj.onload = function() {       context3.drawimage(context1.canvas, 50, 25);       context3.drawimage(context2.canvas, 100, 25);         };   };  </script>  </head> <body> <canvas id="canvas1" class="canvas" width="200" height="50"></canvas> <canvas id="canvas2" class="canvas" width="200" height="50"></canvas> <canvas id="canvas3" class="canvas" width="200" height="50"></canvas> </body> </html>​ 

js fiddle http://jsfiddle.net/4xt2j/2/

your images have no source. add 1 if want see something. onload function cannot called long don't have src.

and must provide image drawimage function :

 var imageobj = new image();  imageobj.onload = function() {    context3.drawimage(imageobj, 50, 25);    context3.drawimage(imageobj, 100, 25);  };  imageobj.src = "somefile.png"; 

if you're trying draw canvas1 , canva2 on context3, outside imageobj.onload function never called : http://jsfiddle.net/kcyve/

a precision following question in comment :

my code in fiddle uses context1.canvas. works because context instance of canvasrenderingcontext2d , has property named canvas "back-reference canvas element context created".


Comments

Popular posts from this blog

django - How can I change user group without delete record -

java - Need to add SOAP security token -

java - EclipseLink JPA Object is not a known entity type -