2016-08-14 53 views
0
var src=__dirname + '/test.svg'; 
fabric.PathGroup.fromObject({paths:src,toBeParsed:true},function(pg) { 
    var patternSourceCanvas = fabric.createCanvasForNode(pg.width, pg.height); 
    patternSourceCanvas.add(pg); 
    patternSourceCanvas.renderAll(); 
    var pcanvas= patternSourceCanvas.getElement(); 

    //uncomment these comments,you will get something 
    /*var pctx = pcanvas.getContext('2d') 
    pctx.beginPath(); 
    pctx.rect(0,0,10,10); 
    pctx.fillStyle='red'; 
    pctx.fill(); 
    pctx.beginPath(); 
    pctx.rect(10,10,10,10); 
    pctx.fillStyle='blue'; 
    pctx.fill(); 
    */ 
    var pattern = new fabric.Pattern({ 
     source: pcanvas, 
     repeat: 'repeat' 
    }); 
    canvas.setBackgroundColor(pattern, function() { canvas.renderAll(); 
     fs.writeFile(__dirname + '/text333.png', canvas.nodeCanvas.toBuffer()); 
    }); 
}) 

的是,已經加載並放入紋帆布SVG並不渲染,所以我沒有什麼背景 是錯誤的東西?使用SVG作爲節點的背景圖案是不工作

回答

0
var src=__dirname + '/test.svg'; 
fabric.PathGroup.fromObject({paths:src,toBeParsed:true},function(pg) { 
    //changed 
    var patternSourceCanvas = new fabric.StaticCanvas(null,{width:pg.width,height:pg.height}); 
    patternSourceCanvas.add(pg); 
    patternSourceCanvas.renderAll(); 
    var pcanvas= patternSourceCanvas.getElement(); 


    var pattern = new fabric.Pattern({ 
     source: pcanvas, 
     repeat: 'repeat' 
    }); 
    canvas.setBackgroundColor(pattern, function() { canvas.renderAll(); 
     fs.writeFile(__dirname + '/text333.png', canvas.nodeCanvas.toBuffer()); 
    }); 
}) 

好,固定由我自己