Question

如何在fabricjs文本中给文本提供渐变或斜角效果？

http://fabricjs.com/fabric-intro-part-2/
这里给出了形状和所有的例子，我把它与文本绑在一起但没有工作??

    hw[i] = new fabric.Text($(this).val(), {
                left : 100,
                top : 100,
                fontSize : 20
            });
 hw[i].setGradient('fill', {
  x1: 0,
  y1: 0,
  x2: 0,
  y2: circle.height,
  colorStops: {
    0: "red",
    1: "blue"
  } });

任何建议

Answer 1

你在这里给 y2 的 circle.height 值，试试 hw [i] .height 而不是

在我自己的测试中，我注意到需要移除物体宽度＆amp;所有x＆amp;的高度除以2 y属性，

var odx = obj.width  /2, ody = obj.height /2;

obj.setGradient('fill',{
    x1: gradient.start.x - odx,
    y1: gradient.start.y - ody,
    x2: gradient.end.x   - odx,
    y2: gradient.end.y   - ody,
    colorStops : colors
});

您可以找到具体的渐变文字示例here

对fabricjs画布中的文本的渐变/斜角效果

1 个答案: