JSPDF how to use variable fonts - jspdf

I can happily use jspdf to add fonts to a pdf. For that so far I add a font for regular, one for italic, one for bold and one for bolditalic in my case.
Now I have some fonts that do not provide these different fonts but variable ttf-fonts and I struggle to use those with JSPDF.
So far my solution goes like this:
pdf.addFileToVFS(`${fontFamily}-bold.ttf`, fontBase64Data);
pdf.addFont(`${fontFamily.ttf}-bold.ttf, fontFamily, 'bold', 700);
where I read fontBase64 data from file (which works nicely for regaulr, italic etc) and do the same with the regular and italic fonts...
For variable fonts I tried to add a font with variable font weight with above code just use the fontBase64Data as I read it from the ttf file of variable font.
However that just leaves the font regular.
To my understanding that alos makes sense as the API of addFonts seems to associate a loaded font with a font weight it represents, but does not seem to apply a font weight to the font.
Since I want to use variable fonts however I seem to need to either
set a font as variable font, so weight would be automatically applied
apply a weight to the variable font via api and then define that as bold
So far I couldn't find any of that. Am I missing sth or are variable font weights currently not supported yet by jspdf?
Cheers
Tom

Related

Porting Arabic font to iOS System

I am just looking to get a better look for my iPad using custom font.
The default Arabic font for iOS8 devices is GeezaPro. and it's in .ttc format.
I am trying to replace it with my custom font.
I use DOSBOX to break system font ttc file into ttf files to make them editable.
Then i use FontLab Studio to replace system font glyphs with my custom font glyphs.
I just copy the glyph from custom font and paste them in the system font (using special paste option FontLab provide).
Then i use DOSBOX again to join these ttf files into ttc file.
That's worked for custom English fonts i used. but using it with arabic fonts show some issues.
The text letters appear separated in iOS apps and everywhere.(as you already know that Arabic language use joined letters and sometimes separated letters depending on the context. if the letter is the first letter it will use specific glyph, the same goes if the letter is in the middle or in the end using different glyph. while in English all letters are always remain separated no matter what. except for handwritten scripts.)
any idea how to fix?
some links:
tutorial I followed to port my fonts
the arabic font I am trying to accomplish (it's free and legit)
P.S: some may say use Bytafont library of fonts but i want to use this specific font. and arabic fonts also limited in the library (20 font only available).
Fonts are complex programs that run on embedded hardware interpreters and font engines (the same way game ROMs run on game hardware or in emulators), and don't just contain the pictures for each letter, but also all the instructions on how to position, combine, and substitute those letters based on what sequence of input it's being told to process.
For almost every font, just copying the glyph outlines is not enough, you also need to make sure that:
the original font's glyph ordering is preserved,
the GPOS table gets copied over (which determines mark positioning, kerning, etc), and
the GSUB table gets copied over (which handles glyph substitution, without which you can't even write Arabic. As an example, you need ـب, ـبـ, بـ or ب depending on context for the same "letter" bā’)
So you generally want to unpack the TTC (which as of OpenType 1.7 can be either truetype or postscript/type2, so that's a thing to remember for the future), then perform the replacements of glyphs (with order-preservation), as well as replacing the GPOS and GSUB tables (using FontForge or TTX) and then pack it back up into the TTC.

Force UIFont to Render as Monospaced

Is it possible to force a UIFont to be monospaced?
Specifically I'm using a font which does not contain monospaced numbers (tabular numerals). Creating a modified font object which is monospaced and adding that font to the numeric segments of attributed strings would work great.
Another solution may be to add custom attributes to an attributed string and modify what is handling the layout of the text to use a fixed size for glyphs in particular ranges.
Things that Haven't Worked:
There are a number of questions that propose solving similar problems by overriding -drawRect: or -drawTextInRect: on a UILabel (see: Is it possible to alter the letter-spacing/kerning of a font with Cocoa Touch?). This seems like an insane solution and would be prohibitively complex if a string mixes monospaced and not-monospaced fonts.
There are also number of questions which suggest, specifically in regards to numerals, creating a font with a font descriptor with certain font features enabled. (see Displaying proportionally spaced numbers (instead of monospace / tabular) on iOS). This seems only to work in fonts which include these features. The font I'm using does not include these features and they have no effect. The font features can be checked by using something like NSLog(#"%#", CTFontCopyFeatures ( ( __bridge CTFontRef ) myFont ));

MathJax overarrow too short

I am trying to place an overarrow over a piece of text in MathJax.
I am using a custom font that I declare in the code-
\(\overrightarrow{\style{font-family: mysans, TeX, Arial, sans-serif;}{\text{" + tString + "}}}\)"
It works ok for most letters- for capital W or M , using a couple in a row like "WWW" the overbar is too short.
For lowercase i , using a couple in a row, ie "iii" it is too long. My hunch is that MathJax is using a standard character width size to figure out the length of the overarrow and when the character is much longer or shorter than that size, it calculates the overarrow incorrectly. Is there any way around this?
Thanks!
First off, you generally cannot use custom fonts with MathJax. As the documentation says
Since browsers do not provide APIs to access font metrics, MathJax has to ship with the necessary font data; this font data is generated during development and cannot be generated on the fly. In addition, most fonts do not cover the relevant characters for mathematical layout. Finally, some fonts (e.g. Cambria Math) store important glyphs outside the Unicode range, making them inaccessible to JavaScript.
However, if you are only looking to use custom fonts in text elements, then there is a way to work around this: style the surrounding context and set mtextFontInherit:true for the output jax, cf. e.g. here for HTML-CSS.
Unfortunately, this won't actually help you right now. There's a minor regression in MathJax 2.5 (see this discussion leading to the result you describe). This will be fixed in 2.5.1 and in the mean time you could set noReflows:false for the HTML-CSS output.

sifr3 multiple font faces in one .swf? for fonts that don't have bold or italic weights?

I have a font which only has a regular weight… I’d like to use another font as the bold weight and another as the italic weight… and have sifr use the extra fonts as a replacement based on strong and or b tags
I’ve tried embedding the multiple fonts in the .swf but only the regular weight get’s applied when sifr is activated. If I have two separate .swf font files I can the text to generate in either font but can't seem to apply the bold version to the bold text in the sentence.
Is their a smarter way to do this? using sifr3 - r436 with CS3 Flash Professional to create the font files
Okay after an hour os do googling various terms I found this
http://discuss.joyent.com/viewtopic.php?id=24567
which answers my question - I now have the whole family embedded as I need
Thanks
R

Font wont export out

I can get sIFR to work but it will only display the bold version of the font I have exported. I checked the report and it seems to be stripping out any font weight that is not bolded in flash. I exported two different files to test, the first with regular and bold and the second with medium and semibold in both cases only the bolded weights were exported. Any ideas on how to fix this?
When exporting the Flash movie, make sure at least one character in the text field has the styles applied to it. Then it should export fine.
I had a similar problem - could not make the font 'bold' style work, and I even whanted my fonts BlackItalic to work. Messing around and reading your post and Marks answer made me try to apply the BlackItalic style to the very first word in the provided fla file. Keeping the css style 'font-weight: normal;' in the config java code was successful!
Until I read some new posts about this I will follow the work flow making individual swf files for every font style - normally I only want to use one or to styles anyway.

Resources