photopea / Typr.js

Typr.js - process fonts in Javascript
MIT License
914 stars 73 forks source link

Translation of canvas #13

Closed ghost closed 7 years ago

ghost commented 7 years ago

I'm trying to do something similar to the demo.

In https://github.com/photopea/Typr.js/blob/gh-pages/demo/index.html#L160 how did you calculate the translation:

ctx.translate(50,320);

Was this just by trial and error or is there a formula that can be used?

photopea commented 7 years ago

It was a "trial by error". You can draw text anywhere you want. In glyph coordinates, zero is at the baseline and Y goes up (X to the right).

If you want the top of the text be at the top of the canvas, you should caluclate it from values in the font tables (OS/2 etc.).