Javascript fabric.js中的文本掩码（目标输出）

使用

目标输出

填充模式添加文本的正确方法是什么？我正在尝试在背景图像上应用文本掩码

到目前为止，这是我的简单方法。我还没有添加背景，但我仍然希望红色面具被打掉：

<canvas id="logo" width="600" height="250"></canvas>

---

小提琴。

这就是你要找的吗

    $(document).ready(function(){
    var canvas = new fabric.Canvas('logo');
    canvas.backgroundColor="green";
    var mask = new fabric.Rect({
        left: 0,
        top: 0,
        width: 600,
        height: 200,
        fill: 'blue'
    });
    canvas.add(mask);

    var text = new fabric.Text("TEST TEXT", {
        fontSize: 120,
        fontFamily: 'Arial',
        stroke: "black",
        fill: 'none',
        fillRule: 'destination-out'
    });
    canvas.add(text);

});

    $(document).ready(function(){
    var canvas = new fabric.Canvas('logo');
    canvas.backgroundColor="green";
    var mask = new fabric.Rect({
        left: 0,
        top: 0,
        width: 600,
        height: 200,
        fill: 'blue'
    });
    canvas.add(mask);

    var text = new fabric.Text("TEST TEXT", {
        fontSize: 120,
        fontFamily: 'Arial',
        stroke: "black",
        fill: 'none',
        fillRule: 'destination-out'
    });
    canvas.add(text);

});