fabricjs IText - 清晰的字符特定样式

时间:2015-12-07 20:11:50

标签: fabricjs

我需要能够为整个IText对象设置fontFamily,即使它具有特定于字符的样式(代码示例和下面的jsfiddle)。请注意,更改fontFamily时,特定于字符的样式不会更改。有没有办法让我访问并清除这些样式,然后将样式应用于整个字符集?

http://jsfiddle.net/xmfw65qg/48/

var iTextSample = new fabric.IText('hello\nworld', {
styles: {
    0: {
      0: { textDecoration: 'underline', fontSize: 80 },
      1: { textBackgroundColor: 'red' }
    },
    1: {
      0: { textBackgroundColor: 'rgba(0,255,0,0.5)' },
      4: { fontSize: 20 }
    }
  }
});

1 个答案:

答案 0 :(得分:1)

http://jsfiddle.net/asturur/xmfw65qg/50/

您必须手动迭代样式对象并清除fontFamily属性。

function setFont(name, value) {
  var object = canvas.item(0);
  if (!object) return;
  if (object.styles) {
    var styles = object.styles;
    for (var row in styles) {
      for (var char in styles[row]) {
        if ('fontFamily' in styles[row][char]) {
          delete styles[row][char]['fontFamily'];
        }
      }
    }
  }

    object.set(name, value).setCoords();
    canvas.renderAll();
}

为什么这是必要的是另一回事。 我会在github存储库上打开一个问题。

编辑: 当fabricjs发布1.6.2时,一个导致原始样式对象在渲染过程中被更改的小错误已得到修复。