SPELLNUMS

SpreadJS allows users to format or display the numbers as words, for example display ‘34’ as ‘thirty four’. This is done thanks to the SPELLNUMS custom function.

Syntax Argument Description arg (Required) - the value that will be transformed into words. You can input the SPELLNUMS function from the above code directly into a cell, or you can use the setFormula method to apply the formula. Usage notes The SPELLNUMS function is very easy to use. It requires a type number argument that represent the value you wish to convert into text. Note that, when your number has a fractional part it will be rounded up to the nearest integer. Benefits There might be various reasons to change digits stored as numbers to text. For example: in the invoice totals or when you have a text paragraph inside your spreadsheet (numbers can disrupt readability so for writing purpose is better to spell the numbers smaller than 100). This function allows you to convert a given number into words without having to create complicated custom functions and methods.
import * as React from 'react'; import { createRoot } from 'react-dom/client'; import './styles.css'; import { AppFunc } from './app-func'; import { App } from './app-class'; // 1. Functional Component sample createRoot(document.getElementById('app')).render(<AppFunc />); // 2. Class Component sample // createRoot(document.getElementById('app')).render(<App />);
import * as React from 'react'; import GC from '@mescius/spread-sheets'; import { SpreadSheets, Worksheet } from '@mescius/spread-sheets-react'; import './styles.css'; class NumbersToWords extends GC.Spread.CalcEngine.Functions.Function { constructor() { super("SPELLNUMS", 1, 1); } evaluate(arg) { let result = 1; if (arguments.length === 1 && !isNaN(arg)) { var string = Math.floor(arg).toString(), units, tens, scales, start, end, chunks, chunksLen, chunk, ints, i, word, words, and = 'and'; /* Remove spaces and commas */ string = string.replace(/[, ]/g, ""); if (parseInt(string) === 0) { return 'zero'; } units = ['', 'one', 'two', 'three', 'four', 'five', 'six', 'seven', 'eight', 'nine', 'ten', 'eleven', 'twelve', 'thirteen', 'fourteen', 'fifteen', 'sixteen', 'seventeen', 'eighteen', 'nineteen']; tens = ['', '', 'twenty', 'thirty', 'forty', 'fifty', 'sixty', 'seventy', 'eighty', 'ninety']; scales = ['', 'thousand', 'million', 'billion', 'trillion', 'quadrillion', 'quintillion', 'sextillion', 'septillion', 'octillion', 'nonillion', 'decillion', 'undecillion', 'duodecillion', 'tredecillion', 'quatttuor-decillion', 'quindecillion', 'sexdecillion', 'septen-decillion', 'octodecillion', 'novemdecillion', 'vigintillion', 'centillion']; start = string.length; chunks = []; while (start > 0) { end = start; chunks.push(string.slice((start = Math.max(0, start - 3)), end)); } chunksLen = chunks.length; if (chunksLen > scales.length) { return ''; } words = []; for (i = 0; i < chunksLen; i++) { chunk = parseInt(chunks[i]); if (chunk) { /* Split chunk into array of individual integers */ ints = chunks[i].split('').reverse().map(parseFloat); /* If tens integer is 1, i.e. 10, then add 10 to units integer */ if (ints[1] === 1) { ints[0] += 10; } /* Add scale word if chunk is not zero and array item exists */ if ((word = scales[i])) { words.push(word); } /* Add unit word if array item exists */ if ((word = units[ints[0]])) { words.push(word); } /* Add tens word if array item exists */ if ((word = tens[ints[1]])) { words.push(word); } /* Add 'and' string after units or tens integer if: */ if (ints[0] || ints[1]) { /* Chunk has a hundreds integer or chunk is the first of multiple chunks */ if (ints[2] || !i && chunksLen) { if (ints.length > 2) { words.push(and); } } } /* Add hundreds word if array item exists */ if ((word = units[ints[2]])) { words.push(word + ' hundred'); } } } return words.reverse().join(' '); } return "#VALUE!"; } } export function AppFunc() { const autoGenerateColumns = true; const spellNumbers = new NumbersToWords(); const initSpread = (spread) => { spread.suspendPaint(); let sheet = spread.getSheet(0); sheet.addCustomFunction(spellNumbers); sheet.setColumnWidth(0, 120); sheet.setColumnWidth(1, 120); sheet.setValue(0, 0, 'Number'); sheet.setValue(0, 1, 'Formula'); sheet.setValue(0, 2, 'Result'); sheet.setValue(1, 0, '23679'); sheet.setValue(1, 1, '=SPELLNUMS(A2)'); sheet.setFormula(1, 2, 'SPELLNUMS(A2)'); sheet.setValue(2, 0, '34'); sheet.setValue(2, 1, '=SPELLNUMS(A3)'); sheet.setFormula(2, 2, 'SPELLNUMS(A3)'); sheet.setValue(3, 0, '4567893400'); sheet.setValue(3, 1, '=SPELLNUMS(A4)'); sheet.setFormula(3, 2, 'SPELLNUMS(A4)'); spread.resumePaint(); } return <div class="sample-tutorial"> <div class="sample-spreadsheets"> <SpreadSheets workbookInitialized={spread => initSpread(spread)}> <Worksheet autoGenerateColumns={autoGenerateColumns}> </Worksheet> </SpreadSheets> </div> </div>; }
import * as React from 'react'; import GC from '@mescius/spread-sheets'; import { SpreadSheets, Worksheet } from '@mescius/spread-sheets-react'; import './styles.css'; const Component = React.Component; class NumbersToWords extends GC.Spread.CalcEngine.Functions.Function { constructor() { super("SPELLNUMS", 1, 1); } evaluate(arg) { let result = 1; if (arguments.length === 1 && !isNaN(arg)) { var string = Math.floor(arg).toString(), units, tens, scales, start, end, chunks, chunksLen, chunk, ints, i, word, words, and = 'and'; /* Remove spaces and commas */ string = string.replace(/[, ]/g, ""); if (parseInt(string) === 0) { return 'zero'; } units = ['', 'one', 'two', 'three', 'four', 'five', 'six', 'seven', 'eight', 'nine', 'ten', 'eleven', 'twelve', 'thirteen', 'fourteen', 'fifteen', 'sixteen', 'seventeen', 'eighteen', 'nineteen']; tens = ['', '', 'twenty', 'thirty', 'forty', 'fifty', 'sixty', 'seventy', 'eighty', 'ninety']; scales = ['', 'thousand', 'million', 'billion', 'trillion', 'quadrillion', 'quintillion', 'sextillion', 'septillion', 'octillion', 'nonillion', 'decillion', 'undecillion', 'duodecillion', 'tredecillion', 'quatttuor-decillion', 'quindecillion', 'sexdecillion', 'septen-decillion', 'octodecillion', 'novemdecillion', 'vigintillion', 'centillion']; start = string.length; chunks = []; while (start > 0) { end = start; chunks.push(string.slice((start = Math.max(0, start - 3)), end)); } chunksLen = chunks.length; if (chunksLen > scales.length) { return ''; } words = []; for (i = 0; i < chunksLen; i++) { chunk = parseInt(chunks[i]); if (chunk) { /* Split chunk into array of individual integers */ ints = chunks[i].split('').reverse().map(parseFloat); /* If tens integer is 1, i.e. 10, then add 10 to units integer */ if (ints[1] === 1) { ints[0] += 10; } /* Add scale word if chunk is not zero and array item exists */ if ((word = scales[i])) { words.push(word); } /* Add unit word if array item exists */ if ((word = units[ints[0]])) { words.push(word); } /* Add tens word if array item exists */ if ((word = tens[ints[1]])) { words.push(word); } /* Add 'and' string after units or tens integer if: */ if (ints[0] || ints[1]) { /* Chunk has a hundreds integer or chunk is the first of multiple chunks */ if (ints[2] || !i && chunksLen) { if (ints.length > 2) { words.push(and); } } } /* Add hundreds word if array item exists */ if ((word = units[ints[2]])) { words.push(word + ' hundred'); } } } return words.reverse().join(' '); } return "#VALUE!"; } } export class App extends Component { constructor(props) { super(props); this.autoGenerateColumns = true; } render() { return <div class="sample-tutorial"> <div class="sample-spreadsheets"> <SpreadSheets workbookInitialized={spread => this.initSpread(spread)}> <Worksheet autoGenerateColumns={this.autoGenerateColumns}> </Worksheet> </SpreadSheets> </div> </div>; } initSpread(spread) { spread.suspendPaint(); let sheet = spread.getSheet(0); this.spellNumbers = new NumbersToWords(); sheet.addCustomFunction(this.spellNumbers); sheet.setColumnWidth(0, 120); sheet.setColumnWidth(1, 120); sheet.setValue(0, 0, 'Number'); sheet.setValue(0, 1, 'Formula'); sheet.setValue(0, 2, 'Result'); sheet.setValue(1, 0, '23679'); sheet.setValue(1, 1, '=SPELLNUMS(A2)'); sheet.setFormula(1, 2, 'SPELLNUMS(A2)'); sheet.setValue(2, 0, '34'); sheet.setValue(2, 1, '=SPELLNUMS(A3)'); sheet.setFormula(2, 2, 'SPELLNUMS(A3)'); sheet.setValue(3, 0, '4567893400'); sheet.setValue(3, 1, '=SPELLNUMS(A4)'); sheet.setFormula(3, 2, 'SPELLNUMS(A4)'); spread.resumePaint(); } }
<!doctype html> <html style="height:100%;font-size:14px;"> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <link rel="stylesheet" type="text/css" href="$DEMOROOT$/en/react/node_modules/@mescius/spread-sheets/styles/gc.spread.sheets.excel2013white.css"> <!-- SystemJS --> <script src="$DEMOROOT$/en/react/node_modules/systemjs/dist/system.src.js"></script> <script src="systemjs.config.js"></script> <script> System.import('$DEMOROOT$/en/lib/react/license.js').then(function () { System.import('./src/app'); }); </script> </head> <body> <div id="app"></div> </body> </html>
.sample-tutorial { position: relative; height: 100%; overflow: hidden; } .sample-spreadsheets { width: 100%; height: 100%; overflow: hidden; float: left; } .options-container { float: right; width: 280px; padding: 12px; height: 100%; box-sizing: border-box; background: #fbfbfb; overflow: auto; } .option-row { font-size: 14px; padding: 5px; margin-top: 10px; } body { position: absolute; top: 0; bottom: 0; left: 0; right: 0; } #app { height: 100% }
(function (global) { System.config({ transpiler: 'plugin-babel', babelOptions: { es2015: true, react: true }, meta: { '*.css': { loader: 'css' } }, paths: { // paths serve as alias 'npm:': 'node_modules/' }, // map tells the System loader where to look for things map: { '@mescius/spread-sheets': 'npm:@mescius/spread-sheets/index.js', '@mescius/spread-sheets-react': 'npm:@mescius/spread-sheets-react/index.js', '@grapecity/jsob-test-dependency-package/react-components': 'npm:@grapecity/jsob-test-dependency-package/react-components/index.js', 'react': 'npm:react/cjs/react.production.js', 'react-dom': 'npm:react-dom/cjs/react-dom.production.js', 'react-dom/client': 'npm:react-dom/cjs/react-dom-client.production.js', 'scheduler': 'npm:scheduler/cjs/scheduler.production.js', 'css': 'npm:systemjs-plugin-css/css.js', 'plugin-babel': 'npm:systemjs-plugin-babel/plugin-babel.js', 'systemjs-babel-build':'npm:systemjs-plugin-babel/systemjs-babel-browser.js' }, // packages tells the System loader how to load when no filename and/or no extension packages: { src: { defaultExtension: 'jsx' }, "node_modules": { defaultExtension: 'js' }, } }); })(this);