【问题标题】:change text shadow style on canvas更改画布上的文本阴影样式
【发布时间】:2013-09-02 23:28:16
【问题描述】:

我正在使用织物来更改画布上文本对象的文本阴影,

  textShadow: 'rgba(0,0,0,0.3) 5px 5px 5px'

这在上面的代码中有效,但是当我尝试在单击另一个按钮时将其设置为另一个颜色阴影时,它不起作用。

$("#txt_strength").change(function () {
    console.log('strength called');

    var obj = canvas.getActiveObject();

    if (!obj) return;

    obj.set('textShadow ', 'green 1px 15px 4px');
    canvas.renderAll();

});

请推荐,

【问题讨论】:

    标签: javascript jquery html css fabricjs


    【解决方案1】:

    'textShadow' 后面有一个空格。将其更改为obj.set('textShadow', 'green 1px 15px 4px');,它应该可以工作。
    http://jsfiddle.net/Kienz/gvn3X/

    【讨论】:

    • 有什么方法可以只改变阴影颜色吗?或大小?实际上我想在不同的按钮上写这两个变化
    • 实际编号但我为此在 github 上打开了新问题:github.com/kangax/fabric.js/issues/819.
    • 现在可以了。删除了 fabric.Text.textShadow - 改为使用 fabric.Text.shadow (type = fabric.Shadow)。初始化阴影对象后,您可以单独操作阴影值: text.shadow.color = value;
    【解决方案2】:

    你现在可以使用了:

    obj.set({shadow: 'rgba(0,0,0, 0.3) 2px 2px 2px'});
    

    完整代码:

    $("#txt_strength").change(function () {
        console.log('strength called');
    
        var obj = canvas.getActiveObject();
    
        if (!obj) return;
    
        obj.set({shadow: 'rgba(0,0,0, 0.3) 2px 2px 2px'});
        canvas.renderAll();
    
    });
    

    【讨论】:

    • 您的代码对我有用,但如何将动态颜色应用于阴影。例如,在 JS 代码中,我将 rgba 代码存储在一个变量中,并且我想在您的语法中使用该变量而不是静态颜色。我怎样才能做到这一点?我在下面试过但没有用:obj.set({shadow:'2px 2px 2px'+convertedColor});其中“convertedColor”是一个变量,我在其中将 rgba 代码字符串化。
    猜你喜欢
    • 2014-01-21
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2015-07-31
    • 1970-01-01
    • 2016-04-15
    • 2020-09-26
    • 1970-01-01
    相关资源
    最近更新 更多