diff --git a/index.d.ts b/index.d.ts index 6f6629f..679ee9f 100644 --- a/index.d.ts +++ b/index.d.ts @@ -6,6 +6,7 @@ export declare type TinySDFOptions = { fontFamily?: string; fontWeight?: string; fontStyle?: string; + lang?: string; }; export default class TinySDF { diff --git a/index.js b/index.js index 5a56c46..b452b7f 100644 --- a/index.js +++ b/index.js @@ -8,11 +8,13 @@ export default class TinySDF { cutoff = 0.25, fontFamily = 'sans-serif', fontWeight = 'normal', - fontStyle = 'normal' + fontStyle = 'normal', + lang = null } = {}) { this.buffer = buffer; this.cutoff = cutoff; this.radius = radius; + this.lang = lang; // make the canvas size big enough to both have the specified buffer around the glyph // for "halo", and account for some glyphs possibly being larger than their font size @@ -67,6 +69,7 @@ export default class TinySDF { if (glyphWidth === 0 || glyphHeight === 0) return glyph; const {ctx, buffer, gridInner, gridOuter} = this; + if (this.lang) ctx.lang = this.lang; ctx.clearRect(buffer, buffer, glyphWidth, glyphHeight); ctx.fillText(char, buffer, buffer + glyphTop); const imgData = ctx.getImageData(buffer, buffer, glyphWidth, glyphHeight); diff --git a/test/test.js b/test/test.js index ad4484f..3a9481f 100644 --- a/test/test.js +++ b/test/test.js @@ -105,3 +105,13 @@ test('does not return negative-width glylphs', () => { assert.equal(glyph.glyphWidth, 0); assert.equal(glyph.width, 6); // zero-width glyph with 3px buffer }); + +/* +test('renders Chinese and Japanese versions of characters', () => { + const sdf1 = new MockTinySDF({lang: 'zh'}); + const glyph1 = sdf1.draw('门'); + const sdf2 = new MockTinySDF({lang: 'ja'}); + const glyph2 = sdf2.draw('门'); + assert.notDeepStrictEqual(glyph1.data, glyph2.data); +}); +*/