FabricJS：キャンバスにSVGを追加するが、エクスポート時には表示されない

Question

FabricJSを使用してキャンバスオブジェクトにSVGを追加し、それをデータURLイメージにエクスポートしてユーザーにイメージを保存させようとしています。私がtoDataURLメソッドを呼び出してイメージをチェックすると、空のイメージに過ぎません。また、toSVG（）メソッドをチェックして、サグが存在するかどうかを確認しましたが、エクスポートされたSVGには含まれていません。

これを示すためにfiddleを作成しました。

この例では、ボタンをクリックしたときに矢印が表示され、私はcanvas.toDataURL()を呼び出してブラウザで確認し、空の画像を示しています。 canvas.toSVG()を呼び出すと、フィドルに表示されている矢印svgのないSVGも返されます。

誰かが正しい方向に向いていますか？

ありがとうございます！

Answer 1

コールバックにコールを入れる必要があります。そうでない場合は、データがロードされる前に発生します。

fabric.loadSVGFromString(svgString, function(results, options) { 
    var arrow = results[0]; 
    canvas.add(arrow); 
    console.log(canvas.toDataURL()); 
    console.log(canvas.toSVG()); 
    }); 

それともas a fiddle