1.0.0 • Published 3 years ago

optical-properties v1.0.0

Weekly downloads
10,065
License
MIT
Repository
github
Last release
3 years ago

optical-properties unstable

Get optical params of a character, canvas or image data. Useful to do kerning, normalize size or adjust vertical/horizontal alignment.

optical-properties

See demo.

Usage

npm install optical-properties

const optics = require('optical-properties')

let w = canvas.width, h = canvas.height, ctx = canvas.getContext('2d')

//get optical params
let {bounds, center, radius} = optics('▲', {size: h, fontSize: h/2})

//make sure radius of char is at least half of canvas height
let scale = h*.5 / (radius*2)

//optical center shift from the real center
let diff = [w*.5 - center[0], h*.5 - center[1]]

//draw normalized character
ctx.font = size*cale + 'px sans-serif'
ctx.fillText('▲', w*.5 + diff[0]*scale, h*.5 + diff[1]*scale)

API

let props = optics(char|canvas|imageData, options?)

Measures optical properties of a character, canvas or imageData based on options. Canvas is expected to be rectangular.

Options:

  • size − size of canvas to use, bigger is slower but more precise and vice-versa. Defaults to 200.
  • fontFamily − font family to use for the character, defaults to sans-serif.
  • fontSize − size of glyph, defaults to 100.

Returns object with properties:

  • center − coordinates of optical center as [cx, cy].
  • bounds − character bounding box [left, top, right, bottom].
  • radius − distance from the optical center to the outmost point.

Credits

© 2017 Dima Yv. MIT License