2016-12-23 52 views
0

我正在使用fabricjs画布进行设计。使用java脚本下载图像文件。但下载后无法看到图像边框。下载的图像没有边框

代码示例:

<canvas id="c" runat="server" style="border:2px solid black;" ></canvas> 
<img alt="" src="" id="finalImge" runat="server" style="border:2px solid black;" /> 
function DownloadDesign() 
{ 
    var canvas = document.getElementById('c').fabric; 
    var img = document.getElementById('finalImge'); 
    img.src = canvas.toDataURL("image/png"); 
    var a = $("<a>").attr("href", img.src).attr("download", "Design.png").appendTo("body"); 
    a[0].click(); 
    a.remove(); 
} 
+0

将边框应用于画布,然后尝试下载 示例:canvas .style.border ='1px solid#000'; – pareshm

+0

我也试过,但..但下载后的图像没有边界.. –

+0

@pareshm ..我添加边框到画布后出现此错误。错误:未捕获TypeError:无法设置未定义的属性'border' –

回答

0

添加边框例如: http://jsfiddle.net/yvqmp1so/

var boundingBox = new fabric.Rect({ 
    fill: "transparent", 
    width: 590, 
    height: 590, 
    stroke: "red", 
    strokeWidth: 10, 
    selectable: false 
}); 
canvas.add(boundingBox); 
+0

@neopheus ...谢谢..它适用于我.. –

0

这是正常的

你的边界是不是在画布

,如果你想在边境,你必须在画布

+0

@ neopheus ..但我该怎么做?我正在使用fabricjs –