-
Notifications
You must be signed in to change notification settings - Fork 1.2k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Add support for letterspacing #1615
base: master
Are you sure you want to change the base?
Conversation
- pango has a PANGO_VARIANT_SMALL_CAPS variant that can be added to the font description, but setting it doesn't cause text to be rendered in small-caps, even if the font supports it - adding the appropriate opentype features to the layout's attributes list will use the font's small-caps glyphs if it provides them
- the font-variant state will get out of sync with the fontDescription across context-saves & restores unless we keep a copy of the PangoAttrList around
- the pango NEWS file suggests 1.37.1 was where the `pango_attr_font_features_new` call was added...
- it can be enabled if/when the pango version is updated
- textTracking can be set to a positive or negative integer corresponding to the number of thousandths-of-an-em to add or remove between glyphs - the value defaults to 0 - it is part of the context state and is affected by save() and restore() - since it is expressed in em-units, spacing will remain proportional if the font size or family are changed
@@ -392,6 +393,14 @@ canvas.toDataURL('image/jpeg', {...opts}, (err, jpeg) => { }) // see Canvas#crea | |||
canvas.toDataURL('image/jpeg', quality, (err, jpeg) => { }) // spec-following; quality from 0 to 1 | |||
``` | |||
|
|||
### CanvasRenderingContext2D#textTracking |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Is this present in the spec for CanvasRenderingContext2D
, or supported by any browsers?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
No, this would be an extension since HTML Canvas makes no provisions for setting letterspacing. See @zbjornson's summary of current browser behaviors here: #1014 (comment)
Any updates on this? |
Sorry for dropping the ball on this one. It seems like there now is a ref: https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/letterSpacing Would you be able to tweak this PR to match that? I think that it would be okay to only support |
still waiting for this feature |
64ed3d8
to
ff0f2ab
Compare
Building on the changes in #1611 (in particular the addition of a
PangoAttrList
to the context state), adding support for tracking/letterspacing required minimal additions.The main change is a new context attribute which I've been calling
textTracking
, both as a way to avoid confusion with the cssletter-spacing
property and as a way to signal the units that it uses. In page layout apps, ‘tracking’ is typically a positive or negative integer that expresses the additional space to add or remove in terms of 1/1000 of an em.Using em-based units has the nice effect of keeping the spacing proportions constant even if the font size changes. Expressing the size in thousandths is helpful since typical amounts of letterspacing to add are usually in the range of
50
-250
(which is more awkward to express in css units:0.05em
–0.25em
).As with the other
ctx.text*
attributes, thetextTracking
value is part of the context state and behaves as expected acrosssave()
andrestore()
calls.