I try to use fabricjs on a node server to create svgs. My problem is that the toSVG() function of the canvas does not recognize the fonts correctly and it calculates the character positions according to the wrong font.
used Versions:
Node: 6.10
"canvas": "1.6.5"
"fabric": "1.7.14"
AFAIK: Newer '1.7.*' versions of fabric, also do not calculate the positions correctly.
It is working for PNGs according to the tutorial (fabric-intro-part-4).
canvas.contextContainer.addFont(font);
canvas.contextTop.addFont(font);
To generate PNG or SVG:
canvas.toDataURL({
format: 'png',
});
canvas.toSVG();
And the PNG output is correctly positioned (see example), but using toSVG() does not apply the (custom) fonts correctly.
In the example you can see that custom fonts are not displayed correctly (the correct font is used for display, because the fonts are installed on my current system, but not on the node server that creates the SVG!)
My next option is to compare source code of toDataURL(...) and IText toSVG(), but I am not sure whether that will help in any way.
Since the function to generate the SVG is executed in AWS Lambda I can not install the Fonts in the Linux OS (AFAIK).
Do you have ideas or are there any tutorials or bug reports that I have missed?
Is there anything like contextTop or contextContainer, where I can add custom fonts, so they are applied in the toSVG() function?
I am thankful for any suggestions.
Example: Ilustration of the Issue
PS: In the browser toSvg() knows the fonts because the browser loads them, therefore the positioning is correct!
Also asked in: https://groups.google.com/forum/#!topic/fabricjs/mff7Pr4fkGY
Bug- report: https://github.com/kangax/fabric.js/issues/4355
Reproduction example: https://github.com/willKo/BugTest