{"_id":"optical-properties","_rev":"1-148a97e3cc02338ef9a22897854635d4","name":"optical-properties","description":"Calculate optical properties of a character, imageData or canvas","dist-tags":{"latest":"1.0.0"},"versions":{"1.0.0":{"name":"optical-properties","version":"1.0.0","description":"Calculate optical properties of a character, imageData or canvas","main":"index.js","scripts":{"test":"budo test","build":"browserify test.js -g babelify | indexhtmlify | metadataify | github-cornerify > demo/index.html"},"repository":{"type":"git","url":"git+https://github.com/dfcreative/optical-properties.git"},"keywords":["optical","font","typeface","canvas","visual","center","mass","bitmap","align"],"author":{"name":"Dima Yv","email":"dfcreative@gmail.com"},"license":"MIT","bugs":{"url":"https://github.com/dfcreative/optical-properties/issues"},"homepage":"https://github.com/dfcreative/optical-properties#readme","devDependencies":{"babelify":"^7.3.0","enable-mobile":"^1.0.7"},"gitHead":"e78573b61d06712e3bf4561b0bb6cb0a8096bd1d","_id":"optical-properties@1.0.0","_npmVersion":"5.0.2","_nodeVersion":"6.2.0","_npmUser":{"name":"dfcreative","email":"df.creative@gmail.com"},"dist":{"integrity":"sha512-XnBQYbIIzDVr7U3L7d3xyAEqp1W+HTkqmw/G4L/Ae/+dq57bT1jqW2uDwV0wCUzO8gsTDIZhGQsGrMb17VSkEA==","shasum":"c3a694bbab7cc4587070886c47f43c8c3a6cceae","tarball":"https://registry.npmjs.org/optical-properties/-/optical-properties-1.0.0.tgz","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCXF6sey7P8X2IWDASEsrejDjMUI1OURoirKLwTuMfCsAIgeWRQ4TBZuqNcjo8XRsLXsIUP3EepTT/7WedXKxNIQa8="}]},"maintainers":[{"name":"dfcreative","email":"df.creative@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/optical-properties-1.0.0.tgz_1496971778403_0.8424742978531867"}}},"readme":"# optical-properties [![unstable](https://img.shields.io/badge/stability-unstable-green.svg)](http://github.com/badges/stability-badges)\r\n\r\nGet optical params of a character, canvas or image data. Useful to do kerning, normalize size or adjust vertical/horizontal alignment.\r\n\r\n![optical-properties](https://github.com/dfcreative/optical-properties/blob/gh-pages/index.png?raw=true)\r\n\r\nSee [demo](https://dfcreative.github.io/optical-properties).\r\n\r\n## Usage\r\n\r\n[![npm install optical-properties](https://nodei.co/npm/optical-properties.png?mini=true)](https://npmjs.org/package/optical-properties/)\r\n\r\n```js\r\nconst optics = require('optical-properties')\r\n\r\nlet w = canvas.width, h = canvas.height, ctx = canvas.getContext('2d')\r\n\r\n//get optical params\r\nlet {bounds, center, radius} = optics('▲', {size: h, fontSize: h/2})\r\n\r\n//make sure radius of char is at least half of canvas height\r\nlet scale = h*.5 / (radius*2)\r\n\r\n//optical center shift from the real center\r\nlet diff = [w*.5 - center[0], h*.5 - center[1]]\r\n\r\n//draw normalized character\r\nctx.font = size*cale + 'px sans-serif'\r\nctx.fillText('▲', w*.5 + diff[0]*scale, h*.5 + diff[1]*scale)\r\n\r\n```\r\n\r\n## API\r\n\r\n### let props = optics(char|canvas|imageData, options?)\r\n\r\nMeasures optical properties of a character, canvas or imageData based on options. Canvas is expected to be rectangular.\r\n\r\nOptions:\r\n\r\n* `size` − size of canvas to use, bigger is slower but more precise and vice-versa. Defaults to `200`.\r\n* `fontFamily` − font family to use for the character, defaults to `sans-serif`.\r\n* `fontSize` − size of glyph, defaults to `100`.\r\n\r\nReturns object with properties:\r\n\r\n* `center` − coordinates of optical center as `[cx, cy]`.\r\n* `bounds` − character bounding box `[left, top, right, bottom]`.\r\n* `radius` − distance from the optical center to the outmost point.\r\n\r\n\r\n## Credits\r\n\r\n© 2017 Dima Yv. MIT License\r\n","maintainers":[{"name":"dfcreative","email":"df.creative@gmail.com"}],"time":{"modified":"2022-05-12T07:11:17.960Z","created":"2017-06-09T01:29:41.023Z","1.0.0":"2017-06-09T01:29:41.023Z"},"homepage":"https://github.com/dfcreative/optical-properties#readme","keywords":["optical","font","typeface","canvas","visual","center","mass","bitmap","align"],"repository":{"type":"git","url":"git+https://github.com/dfcreative/optical-properties.git"},"author":{"name":"Dima Yv","email":"dfcreative@gmail.com"},"bugs":{"url":"https://github.com/dfcreative/optical-properties/issues"},"license":"MIT","readmeFilename":"readme.md"}