optical-properties

    1.0.0 • Public • Published

    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

    Install

    npm i optical-properties

    DownloadsWeekly Downloads

    12,059

    Version

    1.0.0

    License

    MIT

    Last publish

    Collaborators

    • dfcreative