1

I'm using fabric.js in my site. suppose if I need to add any text in canvas, I write - like-

var text1 = new fabric.Text('Fabric', {
  left: 90,
  top: 570,
  angle: -5,
  fontFamily: 'Helvetica',
  fontSize: 20,
  fill: 'red'
})

but I need all available fonts (like - times new roman, Helvetica) in a list so that I can select the font at run time, I tried to google it but I got nothing. I wonder if anybody help me. Thank in advance.

Paolo Moretti
  • 54,162
  • 23
  • 101
  • 92
user3475571
  • 11
  • 1
  • 2
  • This is related: http://stackoverflow.com/questions/3368837/list-every-font-a-users-browser-can-display. In short, you can't do it in pure JavaScript. Here's a Flash + JS solution: https://github.com/gabriel/font-detect-js. – Paolo Moretti Apr 01 '14 at 13:27
  • dear, I don't want to detect any font, I need the list of fonts provided by fabric.js. – user3475571 Apr 01 '14 at 13:57
  • fabric.js it's not a magic wand, it doesn't provide any font, it's a simple JS library to edit HTML5 canvas elements. And in canvas you can change the font by setting the [`font`](https://developer.mozilla.org/en-US/docs/Web/CSS/font) property: https://developer.mozilla.org/en/docs/Drawing_text_using_a_canvas – Paolo Moretti Apr 01 '14 at 14:52

1 Answers1

1

fabricjs doens't provide any fonts for you. Instead, it uses a html5 canvas and therefore have the font the browser provides for you.

If you need to list available fonts during runtime you can test out the following.

Of you can import you own using font-face.

Community
  • 1
  • 1
Victor Axelsson
  • 1,420
  • 1
  • 15
  • 32