javascript - HTML5 How to call image in Canvas -

javascript - HTML5 How to call image in Canvas -

i have design canvas want phone call image in canvas. have gone through tutorials don't know how implement that. image high resolution want cut down image size , resolution javascript. help me.

<canvas id="mycanvas" width="600" height="400" style="border:1px solid #d3d3d3;"> browser not back upwards html5 canvas tag.</canvas> <script> var c=document.getelementbyid("mycanvas"); var ctx=c.getcontext("2d"); ctx.beginpath(); ctx.moveto(8,200); ctx.lineto(8,308); ctx.moveto(259,76); ctx.lineto(259,308); ctx.moveto(259,308); ctx.lineto(8,308); ctx.moveto(8,200); ctx.lineto(259,76); ctx.stroke(); var imageobj = new image(); imageobj.onload = function() { ctx.drawimage(imageobj, 69, 50); }; imageobj.src = 'img/logo.jpg', height='42', width='42'; </script>

i not able phone call image. help me how convert javascript in jquery?

thanks

you need utilize next syntax if want resize image too.

context.drawimage(img,x-position,y-position,width,height);

here updated jsfiddle example.

you can read more drawimage function in w3cschool's article.

javascript html5 canvas