Measure text width with canvas ↔️
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
lib
spec
.editorconfig
.gitignore
LICENSE
README.md
package.json
webpack.config.js
yarn.lock

README.md

measure-text-width

measure-text-width uses canvas to measure text width.

Installing

$ yarn add measure-text-width
# or
$ npm install --save measure-text-width

Usage

import CreateWidthMeasurer from 'measure-text-width';

const measureWidth = CreateWidthMeasurer(window)
  .setFont('12px Arial');

const stringWidth = measureWidth('Hello world!'); // 63

API

measure-text-width exports one function, CreateWidthMeasurer.

CreateWidthMeasurer(window = this)

Creates widthMeasurer.

widthMeasurer(text)

Measures and returns width of text in pixels, rounded to integer.

widthMeasurer.setFont(font)

Sets font for canvas, as in CSS spec.

widthMeasurer.useElementFont(element)

Sets font for canvas, extracting passed Element's font via getComputedStyle.

License

MIT © Dmitriy Semyushkin