FromHTML custom font #37

Zeus6221 · 2018-04-17T22:07:58Z

Hi, actually I used the code example, but when I try to use a personalized font, this doesn't work whit fromHTML function.

I saw the code inside jspdf.customfonts.debug.js and I think that the issue can be inside the ResolveFont function, this because this function always returns font-family "times", nevertheless other css properties works correctly (color for example).
this is my code:

I added the PersonalizedFont.ttf file to the fonts folder and also I modified the default_vfs.js file whit my font in base64, in this case the doc.text(15, 15, 'Hello world'); takes the correct font but the, doc.fromHTML does't.

Could you please help whit this problem.

$(document).ready(function () {

            var doc = new jsPDF();

            var specialElementHandlers = {
                '#editor': function (element, renderer) {
                    return true;
                }
            };

            $('#cmd').click(function () {

                var doc = new jsPDF();
                doc.addFont('PersonalizedFont.ttf', 'PersonalizedFont', 'normal');
                doc.setFont('PersonalizedFont');
                var html = "<!DOCTYPE html>\
                                <html>\
                                <head>\
                                        <style>\
                                            @font-face {\
                                                font-family: GamjaFlower;\
                                                src: url('./fonts/PersonalizedFont.ttf');\
                                                font-weight: bold;\
                                            }\
                                            p   {\
                                                    font-family: GamjaFlower;\
                                                    color: blue;\
                                                }\
                                        </style>\
                                </head>\
                                <body>\
                                 <p>\
                                        Lorem ipsum dolor sit amet, consectetur adipisicing elit,\
                                        sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.\
                                        Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris\
                                        nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor\
                                        in reprehenderit in voluptate velit esse cillum dolore eu fugiat\
                                        nulla pariatur. Excepteur sint occaecat cupidatat non proident,\
                                        sunt in culpa qui officia deserunt mollit anim id est laborum.\
                                        Hola mundo FromHTML\
                                        </p>\
                                </body>\
                                </html>";
                doc.fromHTML(html, 15, 15, {
                    'width': 170,
                    'elementHandlers': specialElementHandlers
                });


                doc.addFont('PersonalizedFont.ttf', 'PersonalizedFont', 'normal');
                doc.setFont('PersonalizedFont');
                doc.text(15, 15, 'Hello world');
                doc.save('PersonalizedFont.pdf');
            });
        });

nataliawww · 2018-05-08T09:13:05Z

+1

danielhultman · 2018-09-06T15:02:47Z

+1

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

FromHTML custom font #37

FromHTML custom font #37

Zeus6221 commented Apr 17, 2018

nataliawww commented May 8, 2018

danielhultman commented Sep 6, 2018

FromHTML custom font #37

FromHTML custom font #37

Comments

Zeus6221 commented Apr 17, 2018

nataliawww commented May 8, 2018

danielhultman commented Sep 6, 2018