Merge Image using Javascript -


is possible merge pictures using javascript?

for example, if have 2 rectangle .jpg or .png images files of same size, possible can align side side , produce merged copy of 2 in new .jpg or .png image file?

you can use javascript 'merge' them 1 canvas, , convert canvas image.

var c=document.getelementbyid("mycanvas"); var ctx=c.getcontext("2d"); var imageobj1 = new image(); var imageobj2 = new image(); imageobj1.src = "1.png" imageobj1.onload = function() {    ctx.drawimage(imageobj1, 0, 0, 328, 526);    imageobj2.src = "2.png";    imageobj2.onload = function() {       ctx.drawimage(imageobj2, 15, 85, 300, 300);       var img = c.todataurl("image/png");       document.write('<img src="' + img + '" width="328" height="526"/>');    } }; 

due security, 2 images must on same domain javascript file (i.e http://123.com/1.png, http://123.com/2.png , http://123.com/script.js) otherwise function todataurl() rise error.


Comments

Popular posts from this blog

c# - How to set Z index when using WPF DrawingContext? -

razor - Is this a bug in WebMatrix PageData? -

android - layout with fragment and framelayout replaced by another fragment and framelayout -