Want to add multiple font in Single fabric Text box, don't want to add new Text box

Question

I Want to add multiple font in Single fabric TextBox, don't want to add new Textbox.

var canvas = new fabric.Canvas('c');
var textbox = new fabric.Textbox('Test', {
    left: 50,
    top: 50,
    width: 150,
    fontSize: 20
});
canvas.add(textbox).setActiveObject(textbox);

Please give me solution.

Answer 1

You can use styles property of Textbox

var textbox = new fabric.Textbox('Test text', {
  left: 50,
  top: 50,
  width: 150,
  fontSize: 20,
  styles: {
    // first line of text i.e Test
    0: {
      //first letter of first line i.e T
      0: { fontFamily: 'Arial'},
      //second letter of first line i.e e
      1: { fontFamily: 'Impact'}
    },
  }
});

Here 0 key of styles indicate first line of your text and 0 key inside 0 object of style indicate first letter.