jsPDF fontStyles not working in custom Font

user_13868683 0
Viewed 291

I have downloaded Calibri_bolditalic.ttf font and using it in jsPdf. In the genereted pdf, I can see font as Calibri but the font style appears to be normal. I want that to be appear in bold and italic font Styles.

This is my code: -

let doc = new jsPDF("p", "pt", "a4");
    doc.addImage(Header, "PNG", 20, 20, 550, 40, "header", "NONE", 0);

    doc.addFileToVFS(
      "./fonts/Calibri_bolditalic.ttf",
      "calibri_bolditalicbase64format"
    );
    doc.addFont("Calibri.ttf", "Calibri", "bolditalic");

    doc.setFont("Calibri", "bolditalic");
    doc.setFontSize(12);
    doc.setTextColor("#361755");
    doc.text("Lorem ipsum dolar sit amet", 20, 80);

ScreenShot of generated pdf:- enter image description here

jspdf reactjs pdf-generation javascript
1 Answers

As per Documentation below is your api methods and params so you need to split italic to 2nd param & Bold to 3rd param

doc.setFont(fontName, fontStyle, fontWeight) → {jsPDF}

Param 1- fontName string Font name or family. Example: "times".

Param 2- fontStyle string Font style or variant. Example: "italic".

Param 3- fontWeight number | string Weight of the Font. Example: "normal" | 400

doc.setFont("Calibri", "italic", "400")

API Doc Ref image

user_105388420
Related