@sutton-signwriting/font-db

2.2.0
Need help reading this?

Font Database

@sutton-signwriting/font-db

Gitter version npm downloads

SignWriting

@sutton-signwriting/font-db is a javascript package for node that generates SVG and PNG images for individual symbols, complete signs, and structured text. The package covers the entire set of the International SignWritnig Alphabet 2010 (ISWA 2010).

This package supports both Formal SignWriting in ASCII (FSW) and SignWriting in Unicode (SWU) character sets, along with the style string. See draft-slevinski-formal-signwriting for detailed specification.

Author: https://SteveSlevinski.me
Channel: https://www.youtube.com/channel/UCXu4AXlG0rXFtk_5SzumDow
Sponsor: https://www.patreon.com/signwriting
Donate: https://donate.sutton-signwriting.io

Useful links

Install in existing NPM package

    npm install @sutton-signwriting/font-db

Install Font Database Package as stand-alone

    # download package
    git clone https://github.com/sutton-signwriting/font-db.git

    # install dependancies
    cd font-db
    npm install

    # test project
    npm run test
    npm run testit fsw
    npm run testit fsw-symbol-svg

    # create project documentation
    npm run docs

    # start built-in server
    npm run server

Usage

Using in code

    // import entire library
    const fontDb = require('@sutton-signwriting/font-db');

    // import individual module
    const fsw = require('@sutton-signwriting/font-db/fsw');

Using on the command line

    # works for script with FSW and SWU, Symbol and Sign, SVG and PNG.

    # output in the terminal
    node fsw/fsw-sign-svg M525x535S2e748483x510S10011501x466S2e704510x500S10019476x475-C

    # save to file
    node fsw/fsw-sign-svg M525x535S2e748483x510S10011501x466S2e704510x500S10019476x475-C output.svg

License

MIT

SignWriting General Interest

fsw

The fsw module contains functions for handling Formal SignWriitng in ASCII (FSW) characters. FSW characters definition

fsw

fsw.symbolSvgBody

Function that creates an SVG image from an FSW symbol key with an optional style string

fsw.symbolSvgBody(fswSym: string): string
Parameters
fswSym (string) an FSW symbol key with optional style string
Returns
string: symbol svg body
Example
// using promise.then
fsw.symbolSvgBody('S20500-C').then( svg => {
  console.log(svg)
})
// using async/await
const svg = await fsw.symbolSvgBody('S20500-C')

fsw.symbolSvg

Function that creates an SVG image from an FSW symbol key with an optional style string

fsw.symbolSvg(fswSym: string): string
Parameters
fswSym (string) an FSW symbol key with optional style string
Returns
string: symbol svg
Example
// using promise.then
fsw.symbolSvg('S20500-C').then( svg => {
  console.log(svg)
})
// using async/await
const svg = await fsw.symbolSvg('S20500-C')

fsw.symbolPng

Function that creates a binary PNG image from an FSW symbol key with an optional style string

fsw.symbolPng(fswSym: string, scale: {width: (number | undefined), height: (number | undefined)}?): ArrayBuffer
Parameters
fswSym (string) an FSW symbol key with optional style string
scale ({width: (number | undefined), height: (number | undefined)}?) options for scaling to specific width or height
Returns
ArrayBuffer: symbol png
Example
// using promise.then
fsw.symbolPng('S20500-C').then( png => {
  console.log(png)
})
// using promise.then with options which scales the image to 100 pixels width
fsw.symbolPng('S20500-C', { width: 100 }).then( png => {
  console.log(png)
})
// using async/await
const png = await fsw.symbolPng('S20500-C')
// using async/await with options which scales the image to 100 pixels width
const png = await fsw.symbolPng('S20500-C', { width: 100 })

fsw.symbolPngDataUrl

Function that creates a data url PNG image from an FSW symbol key with an optional style string

fsw.symbolPngDataUrl(fswSym: string, scale: {width: (number | undefined), height: (number | undefined)}?): string
Parameters
fswSym (string) an FSW symbol key with optional style string
scale ({width: (number | undefined), height: (number | undefined)}?) options for scaling to specific width or height
Returns
string: symbol png
Example
// using promise.then
fsw.symbolPngDataUrl('S20500-C').then( png => {
  console.log(png)
})
// using promise.then with options which scales the image to 100 pixels width
fsw.symbolPngDataUrl('S20500-C', { width: 100 }).then( png => {
 console.log(png)
})
// using async/await
const png = await fsw.symbolPngDataUrl('S20500-C')
// using async/await with options which scales the image to 100 pixels width
const png = await fsw.symbolPngDataUrl('S20500-C', { width: 100 })

fsw.symbolNormalize

Function that normalizes a symbol with a minimum coordinate for a center of 500,500

fsw.symbolNormalize(fswSym: string): string
Parameters
fswSym (string) an FSW symbol key with optional coordinate and style string
Returns
string: normalized symbol
Example
// using promise.then
fsw.symbolNormalize('S20500-C').then( norm => {
  console.log(norm)
})
// using async/await
const norm = await fsw.symbolNormalize('S20500-C')

fsw.signSvgBody

Function that creates an SVG image from an FSW sign with an optional style string

fsw.signSvgBody(fswSign: string): string
Parameters
fswSign (string) an FSW sign with optional style string
Returns
string: sign svg body
Example
// using promise.then
fsw.signSvgBody('M525x535S2e748483x510S10011501x466S2e704510x500S10019476x475').then( svg => {
  console.log(svg)
})
// using async/await
const svg = await fsw.signSvgBody('M525x535S2e748483x510S10011501x466S2e704510x500S10019476x475')

fsw.signSvg

Function that creates an SVG image from an FSW sign with an optional style string

fsw.signSvg(fswSign: string): string
Parameters
fswSign (string) an FSW sign with optional style string
Returns
string: sign svg
Example
// using promise.then
fsw.signSvg('M525x535S2e748483x510S10011501x466S2e704510x500S10019476x475').then( svg => {
  console.log(svg)
})
// using async/await
const svg = await fsw.signSvg('M525x535S2e748483x510S10011501x466S2e704510x500S10019476x475')

fsw.signPng

Function that creates a binary PNG image from an FSW sign with an optional style string

fsw.signPng(fswSign: string, scale: {width: (number | undefined), height: (number | undefined)}?): ArrayBuffer
Parameters
fswSign (string) an FSW sign with optional style string
scale ({width: (number | undefined), height: (number | undefined)}?) options for scaling to specific width or height
Returns
ArrayBuffer: sign png
Example
// using promise.then
fsw.signPng('M525x535S2e748483x510S10011501x466S20544510x500S10019476x475').then( png => {
  console.log(png)
})
// using promise.then with options which scales the image to 100 pixels width
fsw.signPng('M525x535S2e748483x510S10011501x466S20544510x500S10019476x475', { width: 100 }).then(png => {
  console.log(png)
})
// using async/await
const png = await fsw.signPng('M525x535S2e748483x510S10011501x466S20544510x500S10019476x475')
// using async/await with options which scales the image to 100 pixels width
const png = await fsw.signPng('M525x535S2e748483x510S10011501x466S20544510x500S10019476x475', { width: 100 })

fsw.signPngDataUrl

Function that creates a data url PNG image from an FSW sign with an optional style string

fsw.signPngDataUrl(fswSign: string, scale: {width: (number | undefined), height: (number | undefined)}?): string
Parameters
fswSign (string) an FSW sign with optional style string
scale ({width: (number | undefined), height: (number | undefined)}?) options for scaling to specific width or height
Returns
string: sign png
Example
// using promise.then
fsw.signPngDataUrl('M525x535S2e748483x510S10011501x466S20544510x500S10019476x475').then( png => {
  console.log(png)
})
// using promise.then with options which scales the image to 100 pixels width
fsw.signPngDataUrl('M525x535S2e748483x510S10011501x466S20544510x500S10019476x475', { width: 100 }).then(png => {
 console.log(png)
})
// using async/await
const png = await fsw.signPngDataUrl('M525x535S2e748483x510S10011501x466S20544510x500S10019476x475')
// using async/await with options which scales the image to 100 pixels width
const png = await fsw.signPngDataUrl('M525x535S2e748483x510S10011501x466S20544510x500S10019476x475', { width: 100 })

fsw.signNormalize

Function that normalizes an FSW sign for a center of 500,500

fsw.signNormalize(fswSign: string): string
Parameters
fswSign (string) an FSW sign with optional style string
Returns
string: normalized sign
Example
// using promise.then
fsw.signNormalize('M525x535S2e748483x510S10011501x466S2e704510x500S10019476x475').then( norm => {
  console.log(norm)
})
// using async/await
const norm = await fsw.signNormalize('M525x535S2e748483x510S10011501x466S2e704510x500S10019476x475')

fsw.columnSvg

Function that creates an SVG image for a column of FSW

fsw.columnSvg(fswColumn: ColumnData, options: ColumnOptions): string
Parameters
fswColumn (ColumnData) an array of objects with information about FSW signs and punctuation
options (ColumnOptions) an object of column options
Returns
string: column svg
Example
const columnData = [
  {"x":56,"y":20,"minX":481,"minY":471,"width":37,"height":58,"lane":0,"padding":0,"segment":"sign","text":"AS14c20S27106M518x529S14c20481x471S27106503x489","zoom":1},
  {"x":57,"y":118,"minX":482,"minY":468,"width":36,"height":65,"lane":0,"padding":0,"segment":"sign","text":"AS18701S1870aS2e734S20500M518x533S1870a489x515S18701482x490S20500508x496S2e734500x468","zoom":1},
  {"x":39,"y":203,"minX":464,"minY":496,"width":72,"height":8,"lane":0,"padding":0,"segment":"symbol","text":"S38800464x496","zoom":1}
];
const columnOptions = {"height": 250, "width": 150};
// using promise.then
fsw.columnSvg(columnData, columnOptions).then( svg => {
  console.log(svg)
})
// using async/await
const svg = await fsw.columnSvg(columnData, columnOptions)

fsw.columnsSvg

Function that creates an array of SVG column images for an FSW text

fsw.columnsSvg(fswText: string, options: ColumnOptions): Array<string>
Parameters
fswText (string) a text of FSW signs and punctuation
options (ColumnOptions) an object of column options
Returns
Array<string>: array of svg columns
Example
const fswText = "AS14c20S27106M518x529S14c20481x471S27106503x489 AS18701S1870aS2e734S20500M518x533S1870a489x515S18701482x490S20500508x496S2e734500x468 S38800464x496";
const columnOptions = {"height": 250, "width": 150};
// using promise.then
fsw.columnsSvg(fswText, columnOptions).then( svgs => {
  console.log(svgs)
})
// using async/await
const svgs = await fsw.columnsSvg(fswText, columnOptions)

fsw.columnPng

Function that creates an PNG image for a column of FSW

fsw.columnPng(fswColumn: ColumnData, options: ColumnOptions): ArrayBuffer
Parameters
fswColumn (ColumnData) an array of objects with information about FSW signs and punctuation
options (ColumnOptions) an object of column options
Returns
ArrayBuffer: column png
Example
const columnData = [
  {"x":56,"y":20,"minX":481,"minY":471,"width":37,"height":58,"lane":0,"padding":0,"segment":"sign","text":"AS14c20S27106M518x529S14c20481x471S27106503x489","zoom":1},
  {"x":57,"y":118,"minX":482,"minY":468,"width":36,"height":65,"lane":0,"padding":0,"segment":"sign","text":"AS18701S1870aS2e734S20500M518x533S1870a489x515S18701482x490S20500508x496S2e734500x468","zoom":1},
  {"x":39,"y":203,"minX":464,"minY":496,"width":72,"height":8,"lane":0,"padding":0,"segment":"symbol","text":"S38800464x496","zoom":1}
];
const columnOptions = {"height": 250, "width": 150};
// using promise.then
fsw.columnPng(columnData, columnOptions).then( png => {
  console.log(png)
})
// using async/await
const png = await fsw.columnPng(columnData, columnOptions)

fsw.columnPngDataUrl

Function that creates a data url PNG image from an FSW sign with an optional style string

fsw.columnPngDataUrl(fswSign: string): string
Parameters
fswSign (string) an FSW sign with optional style string
Returns
string: column png
Example
const columnData = [
  {"x":56,"y":20,"minX":481,"minY":471,"width":37,"height":58,"lane":0,"padding":0,"segment":"sign","text":"AS14c20S27106M518x529S14c20481x471S27106503x489","zoom":1},
  {"x":57,"y":118,"minX":482,"minY":468,"width":36,"height":65,"lane":0,"padding":0,"segment":"sign","text":"AS18701S1870aS2e734S20500M518x533S1870a489x515S18701482x490S20500508x496S2e734500x468","zoom":1},
  {"x":39,"y":203,"minX":464,"minY":496,"width":72,"height":8,"lane":0,"padding":0,"segment":"symbol","text":"S38800464x496","zoom":1}
];
const columnOptions = {"height": 250, "width": 150};
// using promise.then
fsw.columnPngDataUrl(columnData, columnOptions).then( png => {
  console.log(png)
})
// using async/await
const png = await fsw.columnPngDataUrl(columnData, columnOptions)

fsw.columnsPng

Function that creates an array of PNG column images for an FSW text

fsw.columnsPng(fswText: string, options: ColumnOptions): Array<ArrayBuffer>
Parameters
fswText (string) a text of FSW signs and punctuation
options (ColumnOptions) an object of column options
Returns
Array<ArrayBuffer>: array of PNG data urls
Example
const fswText = "AS14c20S27106M518x529S14c20481x471S27106503x489 AS18701S1870aS2e734S20500M518x533S1870a489x515S18701482x490S20500508x496S2e734500x468 S38800464x496";
const columnOptions = {"height": 250, "width": 150};
// using promise.then
fsw.columnsPng(fswText, columnOptions).then( pngs => {
  console.log(pngs)
})
// using async/await
const pngs = await fsw.columnsPng(fswText, columnOptions)

fsw.columnsPngDataUrl

Function that creates an array of PNG column images for an FSW text

fsw.columnsPngDataUrl(fswText: string, options: ColumnOptions): Array<string>
Parameters
fswText (string) a text of FSW signs and punctuation
options (ColumnOptions) an object of column options
Returns
Array<string>: array of PNG data urls
Example
const fswText = "AS14c20S27106M518x529S14c20481x471S27106503x489 AS18701S1870aS2e734S20500M518x533S1870a489x515S18701482x490S20500508x496S2e734500x468 S38800464x496";
const columnOptions = {"height": 250, "width": 150};
// using promise.then
fsw.columnsPng(fswText, columnOptions).then( pngs => {
  console.log(pngs)
})
// using async/await
const pngs = await fsw.columnsPng(fswText, columnOptions)

swu

The swu module contains functions for handling Formal SignWriitng in ASCII (SWU) characters. SWU characters definition

swu

swu.symbolSvgBody

Function that creates an SVG image from an SWU symbol key with an optional style string

swu.symbolSvgBody(swuSym: string): string
Parameters
swuSym (string) an SWU symbol key with optional style string
Returns
string: symbol svg body
Example
// using promise.then
swu.symbolSvgBody('񀀁-C').then( svg => {
  console.log(svg)
})
// using async/await
const svg = await swu.symbolSvgBody('񀀁-C')

swu.symbolSvg

Function that creates an SVG image from an SWU symbol key with an optional style string

swu.symbolSvg(swuSym: string): string
Parameters
swuSym (string) an SWU symbol key with optional style string
Returns
string: symbol svg
Example
// using promise.then
swu.symbolSvg('񀀁-C').then( svg => {
  console.log(svg)
})
// using async/await
const svg = await swu.symbolSvg('񀀁-C')

swu.symbolPng

Function that creates a binary PNG image from an SWU symbol key with an optional style string

swu.symbolPng(swuSym: string, scale: {width: (number | undefined), height: (number | undefined)}?): ArrayBuffer
Parameters
swuSym (string) an SWU symbol key with optional style string
scale ({width: (number | undefined), height: (number | undefined)}?) options for scaling to specific width or height
Returns
ArrayBuffer: symbol png
Example
// using promise.then
swu.symbolPng('񀀁-C').then( png => {
  console.log(png)
})
// using promise.then with options which scales the image to 100 pixels width
swu.symbolPng('񀀁-C', { width: 100 }).then( png => {
  console.log(png)
})
// using async/await
const png = await swu.symbolPng('񀀁-C')
// using async/await with options which scales the image to 100 pixels width
const png = await swu.symbolPng('񀀁-C', { width: 100 })

swu.symbolPngDataUrl

Function that creates a data url PNG image from an SWU symbol key with an optional stle string

swu.symbolPngDataUrl(swuSym: string, scale: {width: (number | undefined), height: (number | undefined)}?): string
Parameters
swuSym (string) an SWU symbol key with optional style string
scale ({width: (number | undefined), height: (number | undefined)}?) options for scaling to specific width or height
Returns
string: symbol png
Example
// using promise.then
swu.symbolPndDataUrl('񀀁-C').then( png => {
  console.log(png)
})
// using promise.then with options which scales the image to 100 pixels width
swu.symbolPndDataUrl('񀀁-C', { width: 100 }).then( png => {
 console.log(png)
})
// using async/await
const png = await swu.symbolPndDataUrl('񀀁-C')
// using async/await with options which scales the image to 100 pixels width
const png = await swu.symbolPndDataUrl('񀀁-C', { width: 100 })

swu.symbolNormalize

Function that normalizes a symbol with a minimum coordinate for a center of 500,500

swu.symbolNormalize(swuSym: string): string
Parameters
swuSym (string) an SWU symbol with optional coordinate and style string
Returns
string: normalized symbol
Example
// using promise.then
swu.symbolNormalize('񆇡-C').then( norm => {
  console.log(norm)
})
// using async/await
const norm = await swu.symbolNormalize('񆇡-C')

swu.signSvgBody

Function that creates an SVG image from an SWU sign with an optional style string

swu.signSvgBody(swuSign: string): string
Parameters
swuSign (string) an SWU sign with optional style string
Returns
string: sign svg body
Example
// using promise.then
swu.signSvgBody('𝠃𝤟𝤩񋛩𝣵𝤐񀀒𝤇𝣤񋚥𝤐𝤆񀀚𝣮𝣭').then( svg => {
  console.log(svg)
})
// using async/await
const svg = await swu.signSvgBody('𝠃𝤟𝤩񋛩𝣵𝤐񀀒𝤇𝣤񋚥𝤐𝤆񀀚𝣮𝣭')

swu.signSvg

Function that creates an SVG image from an SWU sign with an optional style string

swu.signSvg(swuSign: string): string
Parameters
swuSign (string) an SWU sign with optional style string
Returns
string: sign svg
Example
// using promise.then
swu.signSvg('𝠃𝤟𝤩񋛩𝣵𝤐񀀒𝤇𝣤񋚥𝤐𝤆񀀚𝣮𝣭').then( svg => {
  console.log(svg)
})
// using async/await
const svg = await swu.signSvg('𝠃𝤟𝤩񋛩𝣵𝤐񀀒𝤇𝣤񋚥𝤐𝤆񀀚𝣮𝣭')

swu.signPng

Function that creates a binary PNG image from an SWU sign with an optional style string

swu.signPng(swuSign: string, scale: {width: (number | undefined), height: (number | undefined)}?): ArrayBuffer
Parameters
swuSign (string) an SWU sign with optional style string
scale ({width: (number | undefined), height: (number | undefined)}?) options for scaling to specific width or height
Returns
ArrayBuffer: sign png
Example
// using promise.then
swu.signPng('𝠃𝤟𝤩񋛩𝣵𝤐񀀒𝤇𝣤񆈥𝤐𝤆񀀚𝣮𝣭').then( png => {
  console.log(png)
})
// using promise.then with options which scales the image to 100 pixels width
swu.signPng('𝠃𝤟𝤩񋛩𝣵𝤐񀀒𝤇𝣤񆈥𝤐𝤆񀀚𝣮𝣭', { width: 100 }).then( png => {
 console.log(png)
})
// using async/await
const png = await swu.signPng('𝠃𝤟𝤩񋛩𝣵𝤐񀀒𝤇𝣤񆈥𝤐𝤆񀀚𝣮𝣭')
// using async/await with options which scales the image to 100 pixels width
const png = await swu.signPng('𝠃𝤟𝤩񋛩𝣵𝤐񀀒𝤇𝣤񆈥𝤐𝤆񀀚𝣮𝣭', { width: 100 })

swu.signPngDataUrl

Function that creates a data url PNG image from an SWU sign with an optional style string

swu.signPngDataUrl(swuSign: string, scale: {width: (number | undefined), height: (number | undefined)}?): string
Parameters
swuSign (string) an SWU sign with optional style string
scale ({width: (number | undefined), height: (number | undefined)}?) options for scaling to specific width or height
Returns
string: sign png
Example
// using promise.then
swu.signPngDataUrl('𝠃𝤟𝤩񋛩𝣵𝤐񀀒𝤇𝣤񆈥𝤐𝤆񀀚𝣮𝣭').then( png => {
  console.log(png)
})
// using promise.then with options which scales the image to 100 pixels width
swu.signPngDataUrl('𝠃𝤟𝤩񋛩𝣵𝤐񀀒𝤇𝣤񆈥𝤐𝤆񀀚𝣮𝣭', { width: 100 }).then( png => {
  console.log(png)
})
// using async/await
const png = await swu.signPngDataUrl('𝠃𝤟𝤩񋛩𝣵𝤐񀀒𝤇𝣤񆈥𝤐𝤆񀀚𝣮𝣭')
// using async/await with options which scales the image to 100 pixels width
const png = await swu.signPngDataUrl('𝠃𝤟𝤩񋛩𝣵𝤐񀀒𝤇𝣤񆈥𝤐𝤆񀀚𝣮𝣭', { width: 100 })

swu.signNormalize

Function that normalizes an SWU sign for a center of 500,500

swu.signNormalize(swuSign: string): string
Parameters
swuSign (string) an SWU sign with optional style string
Returns
string: normalized sign
Example
// using promise.then
swu.signNormalize('𝠃𝤟𝤩񋛩𝣵𝤐񀀒𝤇𝣤񋚥𝤐𝤆񀀚𝣮𝣭').then( norm => {
  console.log(norm)
})
// using async/await
const norm = await swu.signNormalize('𝠃𝤟𝤩񋛩𝣵𝤐񀀒𝤇𝣤񋚥𝤐𝤆񀀚𝣮𝣭')

swu.columnSvg

Function that creates an SVG image for a column of SWU

swu.columnSvg(swuColumn: ColumnData, options: ColumnOptions): string
Parameters
swuColumn (ColumnData) an array of objects with information about SWU signs and punctuation
options (ColumnOptions) an object of column options
Returns
string: column svg
Example
const columnData = [
  {"x":56,"y":20,"minX":481,"minY":471,"width":37,"height":58,"lane":0,"padding":0,"segment":"sign","text":"𝠀񁲡񈩧𝠃𝤘𝤣񁲡𝣳𝣩񈩧𝤉𝣻","zoom":1},
  {"x":57,"y":118,"minX":482,"minY":468,"width":36,"height":65,"lane":0,"padding":0,"segment":"sign","text":"𝠀񃊢񃊫񋛕񆇡𝠃𝤘𝤧񃊫𝣻𝤕񃊢𝣴𝣼񆇡𝤎𝤂񋛕𝤆𝣦","zoom":1},
  {"x":39,"y":203,"minX":464,"minY":496,"width":72,"height":8,"lane":0,"padding":0,"segment":"symbol","text":"񏌁𝣢𝤂","zoom":1}
];
const columnOptions = {"height": 250, "width": 150};
// using promise.then
swu.columnSvg(columnData, columnOptions).then( svg => {
  console.log(svg)
})
// using async/await
const svg = await swu.columnSvg(columnData, columnOptions)

swu.columnsSvg

Function that creates an array of SVG column images for an SWU text

swu.columnsSvg(swuText: string, options: ColumnOptions): Array<string>
Parameters
swuText (string) a text of SWU signs and punctuation
options (ColumnOptions) an object of column options
Returns
Array<string>: array of svg columns
Example
const swuText = "𝠀񁲡񈩧𝠃𝤘𝤣񁲡𝣳𝣩񈩧𝤉𝣻 𝠀񃊢񃊫񋛕񆇡𝠃𝤘𝤧񃊫𝣻𝤕񃊢𝣴𝣼񆇡𝤎𝤂񋛕𝤆𝣦 񏌁𝣢𝤂";
const columnOptions = {"height": 250, "width": 150};
// using promise.then
swu.columnsSvg(swuText, columnOptions).then( svgs => {
  console.log(svgs)
})
// using async/await
const svgs = await swu.columnsSvg(swuText, columnOptions)

swu.columnPng

Function that creates an PNG image for a column of SWU

swu.columnPng(swuColumn: ColumnData, options: ColumnOptions): ArrayBuffer
Parameters
swuColumn (ColumnData) an array of objects with information about SWU signs and punctuation
options (ColumnOptions) an object of column options
Returns
ArrayBuffer: column png
Example
const columnData = [
  {"x":56,"y":20,"minX":481,"minY":471,"width":37,"height":58,"lane":0,"padding":0,"segment":"sign","text":"𝠀񁲡񈩧𝠃𝤘𝤣񁲡𝣳𝣩񈩧𝤉𝣻","zoom":1},
  {"x":57,"y":118,"minX":482,"minY":468,"width":36,"height":65,"lane":0,"padding":0,"segment":"sign","text":"𝠀񃊢񃊫񋛕񆇡𝠃𝤘𝤧񃊫𝣻𝤕񃊢𝣴𝣼񆇡𝤎𝤂񋛕𝤆𝣦","zoom":1},
  {"x":39,"y":203,"minX":464,"minY":496,"width":72,"height":8,"lane":0,"padding":0,"segment":"symbol","text":"񏌁𝣢𝤂","zoom":1}
];
const columnOptions = {"height": 250, "width": 150};
// using promise.then
swu.columnPng(columnData, columnOptions).then( png => {
  console.log(png)
})
// using async/await
const png = await swu.columnPng(columnData, columnOptions)

swu.columnPngDataUrl

Function that creates a data url PNG image from an SWU sign with an optional style string

swu.columnPngDataUrl(swuSign: string): string
Parameters
swuSign (string) an SWU sign with optional style string
Returns
string: column png
Example
const columnData = [
  {"x":56,"y":20,"minX":481,"minY":471,"width":37,"height":58,"lane":0,"padding":0,"segment":"sign","text":"𝠀񁲡񈩧𝠃𝤘𝤣񁲡𝣳𝣩񈩧𝤉𝣻","zoom":1},
  {"x":57,"y":118,"minX":482,"minY":468,"width":36,"height":65,"lane":0,"padding":0,"segment":"sign","text":"𝠀񃊢񃊫񋛕񆇡𝠃𝤘𝤧񃊫𝣻𝤕񃊢𝣴𝣼񆇡𝤎𝤂񋛕𝤆𝣦","zoom":1},
  {"x":39,"y":203,"minX":464,"minY":496,"width":72,"height":8,"lane":0,"padding":0,"segment":"symbol","text":"񏌁𝣢𝤂","zoom":1}
];
const columnOptions = {"height": 250, "width": 150};
// using promise.then
swu.columnPngDataUrl(columnData, columnOptions).then( png => {
  console.log(png)
})
// using async/await
const png = await swu.columnPngDataUrl(columnData, columnOptions)

swu.columnsPng

Function that creates an array of PNG column images for an SWU text

swu.columnsPng(swuText: string, options: ColumnOptions): Array<ArrayBuffer>
Parameters
swuText (string) a text of SWU signs and punctuation
options (ColumnOptions) an object of column options
Returns
Array<ArrayBuffer>: array of PNG data urls
Example
const swuText = "𝠀񁲡񈩧𝠃𝤘𝤣񁲡𝣳𝣩񈩧𝤉𝣻 𝠀񃊢񃊫񋛕񆇡𝠃𝤘𝤧񃊫𝣻𝤕񃊢𝣴𝣼񆇡𝤎𝤂񋛕𝤆𝣦 񏌁𝣢𝤂";
const columnOptions = {"height": 250, "width": 150};
// using promise.then
swu.columnsPng(swuText, columnOptions).then( pngs => {
  console.log(pngs)
})
// using async/await
const pngs = await swu.columnsPng(swuText, columnOptions)

swu.columnsPngDataUrl

Function that creates an array of PNG column images for an SWU text

swu.columnsPngDataUrl(swuText: string, options: ColumnOptions): Array<string>
Parameters
swuText (string) a text of SWU signs and punctuation
options (ColumnOptions) an object of column options
Returns
Array<string>: array of PNG data urls
Example
const swuText = "𝠀񁲡񈩧𝠃𝤘𝤣񁲡𝣳𝣩񈩧𝤉𝣻 𝠀񃊢񃊫񋛕񆇡𝠃𝤘𝤧񃊫𝣻𝤕񃊢𝣴𝣼񆇡𝤎𝤂񋛕𝤆𝣦 񏌁𝣢𝤂";
const columnOptions = {"height": 250, "width": 150};
// using promise.then
swu.columnsPng(swuText, columnOptions).then( pngs => {
  console.log(pngs)
})
// using async/await
const pngs = await swu.columnsPng(swuText, columnOptions)

StyleObject

The elements of a style string

StyleObject

Type: object

Properties
colorize (boolean) : boolean to use standardized colors for symbol groups
padding (number) : integer value for padding around symbol or sign
background (string) : css name or hex color for background
detail (array) : array for css name or hex color for line and optional fill
zoom (number) : decimal value for zoom level
detailsym (Array<object>) : custom colors for individual symbols
  • detailsym.index number

    symbol index in sign box

  • detailsym.detail array

    array for css name or hex color for line and optional fill

classes (string) : list of class names separated with spaces used for SVG
id (string) : id name used for SVG

ColumnOptions

ColumnOptions

Type: object

Properties
height (number) : the height of the columns
width (number) : the widths of the columns
offset (number) : the lane offset for left and right lanes
pad (number) : amount of padding before and after signs as well as at top, left, and right of columns
margin (number) : amount of space at bottom of column that is not available
dynamic (boolean) : enables variable width columns
background (string) : background color for columns
style (StyleObject) : an object of style options
punctuation (object) : an object of punctuation options
  • punctuation.spacing boolean

    enables special spacing for punctuation with no space above and custom space below

  • punctuation.pad number

    the amount of spacing after a punctuation if punctuation spacing is enabled

  • punctuation.pull boolean

    prevents line breaks before punctuation by reducing spacing between signs in a column

ColumnData

ColumnData

Type: Array<ColumnSegment>

ColumnSegment

ColumnSegment

Type: object

Properties
x (number) : the x position in the column
y (number) : the y position in the column
minX (number) : the min x value within the segment
minY (number) : the min y value within the segment
width (number) : the width of the text segment
height (number) : the height of the text segment
lane (number) : Left as -1, Middle as 0, Right as 1
padding (number) : the padding of the text segment affects colored background
segment (string) : "sign" or "symbol"
text (string) : the text of the sign or symbol with optional style string
zoom (number) : the zoom size of the segment

svg2png

Convert SVG to PNG

svg2png(svg: string, scale: any): Promise<Buffer>
Parameters
svg (string) SVG string
scale (any = {})
Returns
Promise<Buffer>: PNG buffer