asciitable.js

Software
Cover image

Generate a ASCII Table from a bidimensional array of strings

Live Test:Β https://jsfiddle.net/Victornpb/3j7wt2a1/show/

Source

const matrix = [
    ['ID', '^Price', '^Amount', '^Column D', '^Column E'],
    null, // horizontal line
    ['1', '$ 100.00', '0', 'Very long text on this cell', '^1'],
    ['2', '$ 100.00', '10', '<Left aligned', '^123'],
    ['3', '$ 100.00', '100', '^Centered', '^12345'],
    ['4', '$ 100.00', '1000', '>Right aligned', '123456789'],
];

const table = asciitable(matrix);
| ID |  Price   | Amount  |          Column D           | Column E  |
|----|----------|---------|-----------------------------|-----------|
|  1 | $ 100.00 |       0 | Very long text on this cell |     1     |
|  2 | $ 100.00 |      10 | Left aligned                |    123    |
|  3 | $ 100.00 |     100 |          Centered           |   12345   |
|  4 | $ 100.00 |    1000 |               Right aligned | 123456789 |

Default style generates a table compatible with GitHub flavored md

ID Price Amount Column D Column E
1 100 0 Very long text on this cell 1
2 100 10 Left aligned 123
3 100 100 Centered 12345
4 100 1000 Right aligned 123456789

Installation

NPM

npm install asciitable.js

Yarn

yarn add asciitable.js

CDN

<script type="text/javascript" src="https://unpkg.com/asciitable.js/"></script>

Packages

File Module Type Transpiled Source Maps
dist/asciitable.d.ts es No No
dist/asciitable.esm.mjs esm No No

Customizable style

Customizer:Β https://jsfiddle.net/Victornpb/3j7wt2a1/

| ID |  Price   | Amount  |          Column D           | Column E  |
|β€”β€”β€”β€”|β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”|β€”β€”β€”β€”β€”β€”β€”β€”β€”|β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”|β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”|
|  1 | $ 100.00 |       0 | Very long text on this cell |     1     |
|  2 | $ 100.00 |      10 | Left aligned                |    123    |
|  3 | $ 100.00 |     100 |          Centered           |   12345   |
|  4 | $ 100.00 |    1000 |               Right aligned | 123456789 |



ID| Price  |Amount |         Column D          |Column E 
--|--------|-------|---------------------------|---------
 1|$ 100.00|      0|Very long text on this cell|    1    
 2|$ 100.00|     10|Left aligned               |   123   
 3|$ 100.00|    100|         Centered          |  12345  
 4|$ 100.00|   1000|              Right aligned|123456789
    


|ID| Price  |Amount |         Column D          |Column E |
|--+--------+-------+---------------------------+---------|
| 1|$ 100.00|      0|Very long text on this cell|    1    |
| 2|$ 100.00|     10|Left aligned               |   123   |
| 3|$ 100.00|    100|         Centered          |  12345  |
| 4|$ 100.00|   1000|              Right aligned|123456789|



β”‚ ID β”‚  Price   β”‚ Amount  β”‚          Column D           β”‚ Column E  β”‚
│────┼──────────┼─────────┼─────────────────────────────┼───────────│
β”‚  1 β”‚ $ 100.00 β”‚       0 β”‚ Very long text on this cell β”‚     1     β”‚
β”‚  2 β”‚ $ 100.00 β”‚      10 β”‚ Left aligned                β”‚    123    β”‚
β”‚  3 β”‚ $ 100.00 β”‚     100 β”‚          Centered           β”‚   12345   β”‚
β”‚  4 β”‚ $ 100.00 β”‚    1000 β”‚               Right aligned β”‚ 123456789 β”‚



β•‘ ID β”‚  Price   β”‚ Amount  β”‚          Column D           β”‚ Column E  β•‘
║────┼──────────┼─────────┼─────────────────────────────┼───────────║
β•‘  1 β”‚ $ 100.00 β”‚       0 β”‚ Very long text on this cell β”‚     1     β•‘
β•‘  2 β”‚ $ 100.00 β”‚      10 β”‚ Left aligned                β”‚    123    β•‘
β•‘  3 β”‚ $ 100.00 β”‚     100 β”‚          Centered           β”‚   12345   β•‘
β•‘  4 β”‚ $ 100.00 β”‚    1000 β”‚               Right aligned β”‚ 123456789 β•‘



ID    Price     Amount             Column D             Column E  
──── ────────── ───────── ───────────────────────────── ───────────
  1   $ 100.00         0   Very long text on this cell       1     
  2   $ 100.00        10   Left aligned                     123    
  3   $ 100.00       100            Centered               12345   
  4   $ 100.00      1000                 Right aligned   123456789 
    
    
    
ID    Price     Amount             Column D             Column E  

1   $ 100.00         0   Very long text on this cell       1     
2   $ 100.00        10   Left aligned                     123    
3   $ 100.00       100            Centered               12345   
4   $ 100.00      1000                 Right aligned   123456789 


| ID '  Price   ' Amount  '          Column D           ' Column E  |
|'''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''|
|  1 ' $ 100.00 '       0 ' Very long text on this cell '     1     |
|  2 ' $ 100.00 '      10 ' Left aligned                '    123    |
|  3 ' $ 100.00 '     100 '          Centered           '   12345   |
|  4 ' $ 100.00 '    1000 '               Right aligned ' 123456789 |



 ID |  Price   | Amount  |          Column D           | Column E  
~~~~+~~~~~~~~~~+~~~~~~~~~+~~~~~~~~~~~~~~~~~~~~~~~~~~~~~+~~~~~~~~~~~
  1 | $ 100.00 |       0 | Very long text on this cell |     1     
  2 | $ 100.00 |      10 | Left aligned                |    123    
  3 | $ 100.00 |     100 |          Centered           |   12345   
  4 | $ 100.00 |    1000 |               Right aligned | 123456789 



| ID |  Price   | Amount  |          Column D           | Column E  |
|````|``````````|`````````|`````````````````````````````|```````````|
|  1 | $ 100.00 |       0 | Very long text on this cell |     1     |
|  2 | $ 100.00 |      10 | Left aligned                |    123    |
|  3 | $ 100.00 |     100 |          Centered           |   12345   |
|  4 | $ 100.00 |    1000 |               Right aligned | 123456789 |



|| ID ||  Price   || Amount  ||          Column D           || Column E  ||
||====||==========||=========||=============================||===========||
||  1 || $ 100.00 ||       0 || Very long text on this cell ||     1     ||
||  2 || $ 100.00 ||      10 || Left aligned                ||    123    ||
||  3 || $ 100.00 ||     100 ||          Centered           ||   12345   ||
||  4 || $ 100.00 ||    1000 ||               Right aligned || 123456789 ||



:β•‘[ ID ]||[  Price   ]||[ Amount  ]||[          Column D           ]||[ Column E  ]β•‘:
:β•‘-=-=-=β”Όβ”Ό-=-=-=-=-=-=β”Όβ”Ό-=-=-=-=-=-β”Όβ”Ό-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-β”Όβ”Ό-=-=-=-=-=-=-β•‘:
:β•‘[  1 ]||[ $ 100.00 ]||[       0 ]||[ Very long text on this cell ]||[     1     ]β•‘:
:β•‘[  2 ]||[ $ 100.00 ]||[      10 ]||[ Left aligned                ]||[    123    ]β•‘:
:β•‘[  3 ]||[ $ 100.00 ]||[     100 ]||[          Centered           ]||[   12345   ]β•‘:
:β•‘[  4 ]||[ $ 100.00 ]||[    1000 ]||[               Right aligned ]||[ 123456789 ]β•‘:

Horizontal Line

You can add a horizontal line, by just adding aΒ nullΒ row.

Alignment

You can align text right, left, and center. Just prepend the string with one of the following characters:

  • <Β to align Left
  • >Β to align Right
  • ^Β to align Center

Example

"<I'm aligned left"
">I'm aligned right"
"^I'm centered"

Customizations

Check out the Theme generator fiddle ->Β https://jsfiddle.net/Victornpb/3j7wt2a1/show/

Options

It does allow a fairly amount of customization, by changing the defaults via options parameter.

Defaults:

{
    row: {
        paddingLeft: "|", //before first column
        paddingRight: "|", //after last column
        colSeparator: "|", //between each column
        lineBreak: "\n"
    },
    cell: {
        paddingLeft: " ",
        paddingRight: " ",
        defaultAlignDir: 1 //left=-1 center=0 right=1
    },
    hr: { //horizontal line
        str: "β€”",
        colSeparator: "|"
    }
}

Dependencies

This module does not depend on anything. You can use it on a browser or node enviroment.

Compability

It should work on anything that supports ECMAScript3 or above. Including IE6.

Suggestions / Questions

File aΒ issueΒ on this repository.

License

The code is available under theΒ MITΒ license.

Links

favicon GitHub\ Generate a ASCII Table from a bidimensional array of strings - GitHub - victornpb/asciitable.js: Generate a ASCII Table from a bidimensional array of strings\ https://github.com/victornpb/asciitable.js

image asciitable.js\ Generate a ASCII Table from a bidimensional array of strings. Latest version: 2.0.1, last published: a month ago. Start using asciitable.js in your project by running npm i asciitable.js. There is 1 other project in the npm registry using asciitable.js.\ https://www.npmjs.com/package/asciitable.js