Custom font not working

[galcott]

I am using the latest version of jsPDF, and trying to use a custom font from Google but it does not work.
I import the font here (the one I'm trying to use is Inconsolata).
<link href="https://fonts.googleapis.com/css?family=Source+Serif+Pro|Inconsolata" rel="stylesheet">

I try to add it with this code and it does show up in the output from getFontList, but the PDF doesn't use that font.
doc.addFont('Inconsolata','Inconsolata','regular'); console.log(doc.getFontList()); doc.setFont('Inconsolata');

In addition, I get the following error message on the console (which does not appear if I go back to an old version of jsPDF):
jspdf.min.js:102 Uncaught TypeError: Cannot set property 'adler32cs' of undefined at t (jspdf.min.js:102) at jspdf.min.js:102 at jspdf.min.js:1 at jspdf.min.js:1 t @ jspdf.min.js:102 (anonymous) @ jspdf.min.js:102 (anonymous) @ jspdf.min.js:1 (anonymous) @ jspdf.min.js:1

[Uzlopak]

Webfonts are not supported.

[galcott]

Then what fonts are supported by addFont?

[Uzlopak]

Currently none. But with 1.4.0 we will have ttf support. But they have to be base64 encoded etc..

[galcott]

When will that be available?

[galcott]

I see that 1.4.0 is released but there doesn't seem to be any documentation on how to use the custom fonts. Can you give a complete example?

[Uzlopak]

sure, check examples/basic.html, last tab.

[galcott]

I can't get this to work with the font I want to use, which is Inconsolata from Google Fonts. I encoded it using this site: https://www.giftofspeed.com/base64-encoder/.

I modified the demoUsingTTFFont function to use that font, shown below.

Attached is the PDF that I got. I tried a couple of other fonts and got an empty PDF. So what is the problem here?
test.pdf

`
function demoUsingTTFFont() {
var Inconsolata="Removed by Aras"
var doc = new jsPDF();

doc.addFileToVFS("Inconsolata.ttf", Inconsolata);

doc.addFont('Inconsolata.ttf', 'Inconsolata', 'normal');

doc.setFont('Inconsolata'); // set font

doc.setFontSize(10);
doc.text("This is a test of custom font Inconsolata", 10, 10);

doc.save('test.pdf');

}
`

[AgoloMohamedElHamamsy]

Don't use the site converter use the /fontconver/fontconverter.html As mentioned in the docs:

To add the font to jsPDF use our fontconverter in /fontconver/fontconverter.html . The fontconverter will create a js-file with the content of the provided ttf-file as base64 encoded string and additional code for jsPDF. You just have to add this generated js-File to your project. You are then ready to go to use setFont-method in your code and write your UTF-8 encoded text.

[caspervanpomeren]

Don't use the site converter use the /fontconver/fontconverter.html As mentioned in the docs:

To add the font to jsPDF use our fontconverter in /fontconver/fontconverter.html . The fontconverter will create a js-file with the content of the provided ttf-file as base64 encoded string and additional code for jsPDF. You just have to add this generated js-File to your project. You are then ready to go to use setFont-method in your code and write your UTF-8 encoded text.

Which docs are you reading? Because I can't find this quote anywhere.

[Uzlopak]

https://github.com/MrRio/jsPDF/blob/master/README.md#use-of-utf-8--ttf

[caspervanpomeren]

That was fast, thanks! Can't believe I missed that (also a bit strange that google can't find that text).

[Uzlopak]

I wrote it few days ago and I rephrased a little right now.

[caspervanpomeren]

That explains it. Do you know if there is any way I can contribute to the docs (more examples / updating etc?). I am not quite ready to help with coding, but I do think I can add to the docs even though I am quite new to all of this.

[damianed]

I am having a problem with the setFont method, I generate the js file with /fontconver/fontconverter.html and import it, but when I try to set the font and the write something in the pdf-file, nothing appears.