从Raphael svg合并图像
从Raphael svg合并图像
提问于 2013-05-15 03:40:37
试图创造
第一步-让用户上传图片通过Ajax，Raphael和Raphael免费转换。
步骤2-单击按钮显示来自合并上传图像的一个图像。(问题)：我发现了类似的文章，关于皈依Raphael svg 1 2 3，
所以我也在使用Canvg，但是得到了console.log：Resource interpreted as image but transferred with MIME type text/html error: image "" not found。
请帮我找出解决办法。或者任何线索，如何达到相同的目标(转换几个Raphael图像从上传到一个png/jpeg)的其他方式？
谢谢!
第一步
// upload images and 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;
}
});
});第二步
// merge and 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>
// and get error
});
// These code If toggle show Raphael freetransform svg handle, it is work convert several svg handle to one image. but still not found upload image to merge回答 1
Stack Overflow用户
发布于 2013-06-15 21:26:02
如果我没有弄错，canvg函数希望第二个参数是包含图像文件路径的String。但是，在步骤2中，您的代码可以：
var upload_svg = $('.upload_img').html(); // **** this does not return the image path
canvg('canvas', upload_svg);我建议你试试这样的方法：
var upload_svg = $('.upload_img').attr('src');
canvg('canvas', upload_svg);这将解释错误-- Resource interpreted as image but transferred with MIME type text/html --它需要一个图像，但接收到空白的HTML。剩下的代码看起来很好。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/16556447
复制相关文章
相似问题
腾讯云开发者
