Skip to content

Render Japanese text with furigana into a PNG buffer.

License

Notifications You must be signed in to change notification settings

mistval/render-furigana

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

46 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Render Furigana

Render Japanese text with furigana to a PNG buffer.

You can specify the furigana yourself, or you can have the script do it automatically, using kuroshiro.

Cairo is required for image rendering. If you don't have it installed, see canvas' page for instructions: https://www.npmjs.com/package/canvas

Examples

const renderFurigana = require('render-furigana');
const fs = require('fs');
const kanjiFont = '40px IPAMincho';
const furiganaFont = '20px IPAMincho';

renderFurigana('暴走した「西武バス」踏切内進入の一部始終', kanjiFont, furiganaFont).then(pngBuffer => {
  fs.writeFileSync('./output.png', pngBuffer);
});

Result: Result 1 png

renderFurigana([{kanji: 'word1', furigana: 'one'}, {kanji: '  '}, {kanji: 'word-two', furigana: 'two'}], kanjiFont, furiganaFont).then(pngBuffer => {
  fs.writeFileSync('./output.png', pngBuffer);
});

Result: Result 2 png

let options = {
  backgroundColor: 'rgba(255, 0, 0, 1)',
  textColor: 'rgba(0, 0, 255, 1)',
}

renderFurigana('青と赤', kanjiFont, furiganaFont, options).then(pngBuffer => {
  fs.writeFileSync('./output.png', pngBuffer);
});

Result: Result 3 png

Options

You can pass in an options object as the fourth argument. The defaults are:

{
  maxWidthInPixels: 1000,
  minWidthInPixels: 0,
  maxHeightInPixels: Number.MAX_SAFE_INTEGER,
  minHeightInPixels: 0,
  leftPaddingInPixels: 10,
  rightPaddingInPixels: 10,
  topPaddingInPixels: 10,
  bottomPaddingInPixels: 10,
  paddingBetweenFuriganaAndKanjiInPixels: 3,
  paddingBetweenLinesInPixels: 10,
  backgroundColor: 'white',
  textColor: 'black'
}

Text will wrap when it hits the maximum width.