Automattic / Automattic/node-canvas

Using variations of a font.

Open
#1,666 1 comment 0 reactions 0 assignees View on GitHub
Text & Fonts
Dominant language
JavaScript
Stars
10.7k
Forks
1.2k
Avg merge
4d 8h
Merged PRs (30d)
1

Description

## Issue or Feature

I want to use Bahnschrift, a constant width font which comes with Windows 10 (Owned by Microsoft). The font comes in many variations, ranging from "Bahnschrift" to "Bahnschrift SemiCondensed" to "Bahnshcrift SemiBold Condensed". All of these fonts are shared within a single .ttf file.

I can access all of these fonts while hosting my application locally on my PC, but as soon as It is hosted by a third party (Heroku), the fonts are no longer available. I looked into this and found some documentation on `registerFont()`. I've managed to get the regular Bahnschrift font to work while being hosted on Heroku, but none of the variations within the font family. Below is the code that, both fonts are shown when locally hosted, but if not, only the bottom one shows up in the right font. How can I fix this?

## Steps to Reproduce

```js
registerFont('./assets/fonts/bahnschrift-main.ttf', {family: 'bahnschrift'})

const canvas = createCanvas(640, 192)
const ctx = canvas.getContext('2d')

ctx.fillStyle = '#ffffff'
ctx.font = '48px "bahnschrift semicondensed"';
ctx.fillText(`Hello World`, 0, canvas.height/2)
ctx.font = '48px "bahnschrift"';
ctx.fillText(`Hello World Again`, 0, canvas.height)
```

## Your Environment
* Version of node-canvas - 2.6.1
* Environment - node 12.18.1 on Windows 10

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.