fabricjsを使用した画像に塗りつぶしの色を挿入する方法

Question

画像内の色を塗りつぶすためのfabric.js関数はありますか？

絵のために黒い線と白い背景でイメージをロードしたいと思います。

は、私は、ユーザーごとに異なる色で、入力色が白い部分

もう一つの疑問

で画像に色を追加します： にはどうすれば自動的に画像キャンバスと同じ大きさのサイズを変更できますか？

https://jsfiddle.net/gislef/s3rvoon6/

fabric.Object.prototype.transparentCorners = false; 
    fabric.Object.prototype.padding = 5; 


    var $ = function(id){return document.getElementById(id)}; 


    var canvas = this.__canvas = new fabric.Canvas('c'); 
    canvas.setHeight(300); 
     canvas.setWidth(500); 

    fabric.Image.fromURL('http://coloring.thecolor.com/color/images/Fish2.gif', function(oImg) { 
    canvas.add(oImg); 
}); 

Answer 1

を行うことができますキャンバスの高さと幅に画像のサイズを変更するには：

fabric.Image.fromURL('http://coloring.thecolor.com/color/images/Fish2.gif', function(oImg) { 
    oImg.scaleToWidth(canvas.getWidth()); 
    //oImg.scaleToHeight(canvas.getHeight()); 
    canvas.add(oImg); 
}); 

そのようなものは今のところありません塗りつぶしの色について。 白を別の色に置き換えるように変更できるremoveWhiteフィルタがありますが、これは白のゾーンの代わりにすべての白を削除します。

子供向けのぬりえの本のように見えるアプリケーションを目指している場合は、svgアセットを使用してシェイプで色付けしようとする必要があります。 これは、アプリケーションで使用する前に、独自のアセットを慎重に作成する必要があることを意味します。