jquery - merge images from Raphael svg -


trying create
step 1 - let users upload images through ajax, raphael , raphael freetransform.

step 2 - click button show 1 image merge upload images. (question): have found similar post convert raphael svg 1 2 3,
i'm using canvg console.log: resource interpreted image transferred mime type text/html error: image "" not found.

please me find how solve it. or clue how reach same goal(convert several raphael svg images upload 1 png/jpeg) in other way?

thanks!

step 1

// upload images , ajax show in page var paper = raphael($('.upload_img')[0], 400, 200); $('.upload_btn').click(function(){     ...     $.ajax({         type: "post",         url: "index.php",         data: fd,         processdata: false,         contenttype: false,         success: function(html){             var session = ..., file = ... type = ...;              function register(el) {                 // toggle handle             };             var img = new image();             img.onload = function(){                 var r_img = paper.image('img/product/tmp/'+session+'/'+file+type, 0, 0, 200, 200);                 register(r_img);             };             img.src = 'img/product/tmp/'+session+'/'+file+type;         }     }); }); 

step 2

// merge , show $('.merge_btn').click(function(){     var upload_svg = $('.upload_img').html();     canvg('canvas', upload_svg);     console.log('upload_svg'+upload_svg); //<svg height="200" version="1.1" width="400" xmlns="http://www.w3.org/2000/svg" style="overflow-x: hidden; overflow-y: hidden; position: relative; "><desc></desc><defs></defs><image x="0" y="0" width="200" height="216.91973969631235" preserveaspectratio="none" href="img/product/tmp/bc4d26ceb620852db36074d351883539/6.jpeg"></image></svg>     // , error });   // these code if toggle show raphael freetransform svg handle, work convert several svg handle 1 image. still not found upload image merge 

if i'm not mistaking canvg function expects second parameter string containing path image file. in step 2 code does:

    var upload_svg = $('.upload_img').html(); // **** not return image path     canvg('canvas', upload_svg); 

i suggest try like:

    var upload_svg = $('.upload_img').attr('src');     canvg('canvas', upload_svg); 

that explain error - resource interpreted image transferred mime type text/html - expects image receives blank html. rest of code seems fine.


Comments

Popular posts from this blog

jquery - How can I dynamically add a browser tab? -

keyboard - C++ GetAsyncKeyState alternative -

android - java.net.UnknownHostException(Unable to resolve host “URL”: No address associated with hostname) -