Other languages in pdfmake #562

mpsbhat · 2016-04-19T04:02:56Z

Is it possible to add other language support other than English (UTF-8) in pdfmake library? something like,

var dd = {
    content: [
        'ಕನ್ನಡ',              //Kannada
        'മലയാളം'       //Malayalam
    ]
}

The text was updated successfully, but these errors were encountered:

Gal-Brenner · 2017-01-31T12:19:35Z

any news regarding this?

liborm85 · 2017-01-31T12:44:30Z

I do not know these languages, but:
LTR languages are supported (is need a font file that supports this language)
RTL languages are not supported - pending issue #184

Gal-Brenner · 2017-01-31T12:49:45Z

Can you give me an example of how to accept for example English an another one? Thanks!!!

liborm85 · 2017-01-31T12:56:26Z

Manual of how to use custom font: https://github.com/bpampuch/pdfmake/wiki/Custom-Fonts---client-side

mpsbhat · 2017-01-31T13:26:57Z

Its working for few fonts but Lohith-kannada.ttf font not working and gives blank spaces. Also baraha-kannada.ttf font gives jumbled words.

Myself asked a question in Stack overflow here.

mpsbhat · 2017-03-01T04:57:44Z

@liborm85 , Myself tried with BARAHAKN.TTF, Nudi_05_k.ttf and lohit_kn.ttf Kannada fonts but each fonts giving jumbled sentences. Any workarounds to solve the issue?

liborm85 · 2017-05-07T14:51:01Z

Kannada currently not supported (see test report). Implementation is required to fontkit library, which pdfmake uses.

mpsbhat · 2017-05-21T10:51:17Z

@liborm85 Find the referenced issue above.

liborm85 · 2017-05-21T12:18:29Z

@mpsbhat That's good. As soon as the new version of fontkit, it will work in pdfmake also.

mpsbhat · 2017-05-21T12:33:49Z

@liborm85 , can we test it before release of new version of fontkit? Myself searching within the pdfmake files but didn't found the fontkit library call.

liborm85 · 2017-05-21T13:30:10Z

@mpsbhat pdfmake calls only the pdfkit library. Calling the fontkit library is up to pdfkit library.
Sorry, I don't know how to build fontkit from source code... :(

mpsbhat · 2017-05-21T13:33:19Z

Ok @liborm85 Thank you for the info.

liborm85 · 2017-05-21T14:12:45Z

Finally succeeded build :)

pdfmake + fontkit-dev with kannada/indic support:
pdfmake.zip

I don't know if it is correct build, but it looks like it works. :) I try it with this font: https://github.com/devongovett/fontkit/blob/indic/test/data/NotoSans/NotoSansKannada-Regular.ttf

mpsbhat · 2017-05-21T16:07:48Z

The above build gives blank pdf :(
We included above pdfmake.js and created a new vfs-fonts.js using the mentioned font.

The base64data as follows:
blob:null/096f394c-61cb-42d6-a3c1-58f9545286d5

liborm85 · 2017-05-21T17:05:45Z

Here is my full test script: pdfmake-indic-test.zip
This works for me, Try it.

mpsbhat · 2017-05-22T03:18:18Z

Splendid...!!!

Thanks @liborm85 :)

mpsbhat · 2017-05-27T04:45:15Z

How can we use both English & Kannada fonts simultaneously?

liborm85 · 2017-05-27T05:53:15Z

You create vfs_fonts.js file with multiple fonts. One for English and other for Kannada. See https://github.com/bpampuch/pdfmake/wiki/Custom-Fonts---client-side

devongovett · 2017-05-30T05:25:53Z

fontkit 1.7 has full support for indic scripts, including Kannada and 9 others. See foliojs/fontkit#99 for details.

liborm85 · 2017-05-30T17:44:57Z

New version pdfmake released.

mpsbhat · 2017-05-31T05:11:06Z

Uncaught Error: Font 'Roboto' in style 'normal' is not defined in the font section of the document definition.

When using new build.

liborm85 · 2017-05-31T06:22:03Z

On playground generating pdf works ok. Attach any sample script for reproduce problem.

mpsbhat · 2017-05-31T07:19:45Z

<html>
<head>

<script type="text/javascript" src="pdfmake.js"></script>
<script type="text/javascript" src="vfs_fonts.js"></script>
</head>
<body>
<button onclick="clickme();">Click</button>

<script type="text/javascript">
function clickme() {
pdfMake.fonts = {
mfont: {
     normal: 'NotoSansKannada-Regular.ttf',
     bold: 'NotoSansKannada-Regular.ttf',
     italics: 'NotoSansKannada-Regular.ttf',
     bolditalics: 'NotoSansKannada-Regular.ttf'
   }

}; 
var dd = {
    content: [
        {
            text:'Test'
        },
{
text : 'ಕನ್ನಡ ',
font: 'mfont'
}

    ]
};
pdfMake.createPdf(dd).open();
}
</script>
</body>
</html>

liborm85 · 2017-05-31T07:37:10Z

This could not work in an older version.
Default font in pdfmake is Roboto. And here is Roboto font required:

        {
            text:'Test'
        },

But in pdfMake.fonts Roboto isn't defined, therefore the error.

mpsbhat · 2017-05-31T08:50:49Z

We have used the latest build of pdfmake.

Do we use like this?

{
text : 'Test ',
font: 'Roboto'
}

after defining

Roboto: {
                normal: 'Roboto-Regular.ttf',
                bold: 'Roboto-Medium.ttf',
                italics: 'Roboto-Italic.ttf',
                bolditalics: 'Roboto-Italic.ttf'
        }

Also tried setdefaultstyle attribute. But no use.

liborm85 · 2017-05-31T09:34:47Z

Roboto is default font is no need to define it in text element.

Here is my test script: test.zip.gz Try it.
If you want to use another default font, use defaultStyle (is shown in zip) and edit pdfMake.fonts (details here)

mpsbhat · 2017-05-31T11:46:12Z

Thank you @liborm85 ..!!! Got it...!!!
But if we give pdfMake.createPdf(dd).open(); it will generate blank pdf.
One more we are trying to have pdf with a text something like

 {
     text:'Test ಕನ್ನಡ'
    },

That is combination of two fonts which coming from server side through ajax call. What will be the work around for this combination?

liborm85 · 2017-05-31T12:01:26Z

open() is only supported in some browsers, see #800

text combination with two fonts:

    {
      text : [
        {
          text: 'Test '
        },
        {
          text : 'ಕನ್ನಡ ',
          font: 'mfont'
        }
      ]
    },

mpsbhat · 2017-05-31T12:08:30Z

We just wondering if there is something text like say Test ಕನ್ನಡ Test which is coming dynamically from server as a combination of two or more fonts.

We will try it out the above solutions and let you know if any hurdles.

Thanks a lot @liborm85 and @devongovett for great support...!!!

niravparsana94 · 2020-02-16T05:57:35Z

@mpsbhat did you found any solution for multiple language in same sentence?
I have to same issue, i have 'Comments' field coming from server, and it can be in any langauge.

mpsbhat · 2020-02-26T02:53:55Z

@mpsbhat did you found any solution for multiple language in same sentence?
I have to same issue, i have 'Comments' field coming from server, and it can be in any langauge.

Yes, we followed the steps given above by @liborm85 for custom fonts and it's working fine by updating vfs_fonts.js file with required fonts. Also we have to refer the font in doc definition object as mentioned based on language like {text: [{text: "ENGLISH", font: font1}, {text: "NON ENGLISH", font: font2}]};

noeurphireak · 2020-07-03T07:30:40Z

@mpsbhat could u please show ur working result ? I also faced this issue as well when multiple languages is in the same sentence like this : Khmer ខ្មែរ

rumman0786 · 2020-12-15T09:22:53Z

@mpsbhat could u please show ur working result ? I also faced this issue as well when multiple languages is in the same sentence like this : Khmer ខ្មែរ

@noeurphireak Did you guys find a solution that would work for multiple language text in the same sentence?
@mpsbhat For a static Text your approach would work as you are defining font word by word. But how would you know which language a user has entered in case of dynamic content? without detecting each word's language cannot specify the desired font.

mpsbhat · 2020-12-27T15:22:01Z

@rumman0786 @noeurphireak
We are ended with something like below. We used to check ASCII character by splitting each string by charachter. One drawback of this is, it is impacting on rendering time for long pages as individual characters are converted into object with font name. Please suggest if someone found better options.

Note: we had created vfs-font.js file as explained and initialized the font reference at the beginning of javascript.

   var test = "ಕನ್ನಡ... ಜೈ ಭಾರತಾಂಬೆ...";
 		var test2 = "ಕನ್ನಡEnglishಒಟ್ಟಿಗೆ... ಜೈ ಭಾರತಾಂಬೆ I'm Bharatheeya...";

	  var dd = {
		        content: [
		          {text: test+ '\n\n', style: 'defaultStyle'},      //////////// This is pure kannada
			{text: 'Only english\n\n'},			    //////////// Only english	
			{text: test2+ '\n\n'},				    //////////// Mix without parsing
			{text: check_font(test2+ '\n\n')},		    /////////// Mix with kannada parsing - U can use check_font function wherevere required to parse kannada font, just pass the string to function and it will return the object by adding fonts based on ASCII character.
		        ],
		        styles: {
		            defaultStyle: {
		                fontSize: 14,
		                font: 'font_kn'
		            }
		        }
		    };

            function download_pdf() {
		console.log(dd);
  		pdfMake.createPdf(dd).print();
                //pdfMake.createPdf(dd).download("test.pdf");
            }


function check_font(str) {
    var parts = str.split('');
    arr = [];
    for (var i = 0; i < parts.length; i++) {
        var s = str.charAt(i);

        // while the next char is not a swara/vyanjana or previous char was a virama 
        while (((i + 1) < str.length && str.charCodeAt(i + 1) < 0xC85 || str.charCodeAt(i + 1) > 0xCB9 || str.charCodeAt(i) === 0xCCD) && str.charAt(i + 1).match(/[a-z]/i) === null) {
            s += str.charAt(i + 1);
            i++;
        }
        if (s.match(/[a-z]/i)) {
            arr.push({
                text: s
            });
        } else {
            arr.push({
                text: s,
                font: 'font_kn'
            });
        }
    }
    return arr;
}

imPrashik · 2023-03-07T08:44:21Z

try using "Arial_Unicode_MS", this font supports many languages.

WikiPedia

nagashreehr · 2024-05-04T12:01:38Z

@mpsbhat @liborm85 I followed all the steps that are given in the pdfmake documentation, I want to generate a pdf in Kannada and I have used the Noto Sans Kannada font file and I'm getting an issue as
"Error: Uncaught (in promise): File 'NotoSansKannada.ttf' not found in virtual file system"

mpsbhat · 2024-05-10T03:24:39Z

The default vfs file cannot be used directly for custom fonts. You should build one as mentioned in the documentation.

nagashreehr · 2024-05-10T03:42:33Z

@mpsbhat yes I have Executed the command node build-vfs.js "./examples/fonts to build the font file

liborm85 closed this as completed May 7, 2017

mpsbhat mentioned this issue May 7, 2017

Kannada font support in fontkit foliojs/fontkit#91

Closed

Other languages in pdfmake #562

Other languages in pdfmake #562

Comments

mpsbhat commented Apr 19, 2016 • edited

Gal-Brenner commented Jan 31, 2017

liborm85 commented Jan 31, 2017 • edited

Gal-Brenner commented Jan 31, 2017

liborm85 commented Jan 31, 2017

mpsbhat commented Jan 31, 2017

mpsbhat commented Mar 1, 2017 • edited

liborm85 commented May 7, 2017

mpsbhat commented May 21, 2017

liborm85 commented May 21, 2017

mpsbhat commented May 21, 2017

liborm85 commented May 21, 2017

mpsbhat commented May 21, 2017

liborm85 commented May 21, 2017

mpsbhat commented May 21, 2017 • edited

liborm85 commented May 21, 2017

mpsbhat commented May 22, 2017 • edited

mpsbhat commented May 27, 2017

liborm85 commented May 27, 2017

devongovett commented May 30, 2017

liborm85 commented May 30, 2017

mpsbhat commented May 31, 2017

liborm85 commented May 31, 2017

mpsbhat commented May 31, 2017

liborm85 commented May 31, 2017

mpsbhat commented May 31, 2017

liborm85 commented May 31, 2017

mpsbhat commented May 31, 2017 • edited

liborm85 commented May 31, 2017 • edited

mpsbhat commented May 31, 2017 • edited

niravparsana94 commented Feb 16, 2020

mpsbhat commented Feb 26, 2020 • edited

noeurphireak commented Jul 3, 2020

rumman0786 commented Dec 15, 2020

mpsbhat commented Dec 27, 2020 • edited

imPrashik commented Mar 7, 2023

nagashreehr commented May 4, 2024 • edited

mpsbhat commented May 10, 2024

nagashreehr commented May 10, 2024 • edited

mpsbhat commented Apr 19, 2016 •

edited

liborm85 commented Jan 31, 2017 •

edited

mpsbhat commented Mar 1, 2017 •

edited

mpsbhat commented May 21, 2017 •

edited

mpsbhat commented May 22, 2017 •

edited

mpsbhat commented May 31, 2017 •

edited

liborm85 commented May 31, 2017 •

edited

mpsbhat commented May 31, 2017 •

edited

mpsbhat commented Feb 26, 2020 •

edited

mpsbhat commented Dec 27, 2020 •

edited

nagashreehr commented May 4, 2024 •

edited

nagashreehr commented May 10, 2024 •

edited