1.0.4 • Published 1 year ago

canvas-multiline-emoji v1.0.4

Weekly downloads
-
License
GPL-3.0
Repository
github
Last release
1 year ago

Draws text in a rectangle on a canvas, on multiple lines.

Instalattion

To install use:

npm i canvas-multiline-emoji

Usage

Exports a single function that draws text on a canvas, breaking it into multiple lines if needed.

Also shrinks the font size to make in fit in the defined rectangle.

Returns the font size used

const fontSize = await drawText(canvas2Dcontext, text, options);

Example

import fs from 'node:fs';
import { Canvas } from 'canvas';
import { drawText } from 'canvas-multiline-emoji';

const canvas = new Canvas(500, 500);
const ctx = canvas.getContext('2d');
const text = 'The old rusted farm equipment 🤪 surrounded the house predicting its demise. He uses onomatopoeia as a weapon of mental destruction. 👍';
const options = {
    font: 'OpenSans',
    verbose: true,
    rect: {
        x: 50,
        y: 50,
        width: canvas.width - (50 * 2),
        height: canvas.height - (50 * 2),
    },
    minFontSize: 10,
    maxFontSize: 40,
    lineHeight: 1.2
};

const test = async () => {
    /* --- background --- */
    ctx.fillStyle = '#4a4aad';
    ctx.fillRect(0, 0, ctx.canvas.width, ctx.canvas.height);
    /* --- font color --- */
    ctx.fillStyle = '#ceceec';
    
    const fontSizeUsed = await drawText(ctx, text, options);
    console.log('Font size used: ', fontSizeUsed);

    const buffer = canvas.toBuffer();
    fs.writeFileSync('test.png', buffer);
};

test();

Options

The options type is defined as MultilineOptions and (almost) all its keys are optional.

ParameterDescriptionDefault
fontFont name / family to usesans-serif
rectRectangle object with x, y, width, height. Text will be drawn inside this.Canvas Size
minFontSizeMinimum font size to use.8
maxFontSizeMaximum font size to use.100
lineHeightMultiplicator for line height1
strokeDefines whether strokeText will be used instead of fillTextfalse
verboseDefines whether if should print debug infofalse
logFunctionCustome function for logging.console.log

Dependencies

This module requires some kind of Canvas object.

Inspired on: https://gitlab.com/davideblasutto/canvas-multiline-text

1.0.22

1 year ago

1.0.21

1 year ago

1.0.4

1 year ago

1.0.35

1 year ago

1.0.3

1 year ago

1.0.2

1 year ago

1.0.11

1 year ago

1.0.1

1 year ago

1.0.0

1 year ago