Search code examples
htmltextcanvasfabricjs

Interactive text fields with Fabric.js

I've been playing with Fabric.js a lot in the last few weeks, but regarding text fields I've only found it possible to set the text on creation.

Is there any possible way to make an interactive text field, or do I have to find a workaround to achieve that? (With interactive text field I mean an area of the canvas I can click on and write directly into it.)

Solution

  • The latest version of fabric.js includes a class IText which incorporates the interaction for editing and selection of text dynamically. try the code below with the latest version of fabric.js

    canvas.add(new fabric.IText('Tap and Type', { 
  fontFamily: 'arial black',
  left: 100, 
  top: 100 ,
}));