CODEWITHSUNDEEP
javascriptascii
zesty
zesty

Reputation: 97

How do you input an ASCII art image into the console in JS?

I'm trying to make this ASCII image shown in the console:

_______                                       
\  ___ `'.            /|                 .--. 
 ' |--.\  \           ||                 |__| 
 | |    \  '          ||                 .--. 
 | |     |  '         ||  __        __   |  | 
 | |     |  | _    _  ||/'__ '.  .:--.'. |  | 
 | |     ' .'| '  / | |:/`  '. '/ |   \ ||  | 
 | |___.' /'.' | .' | ||     | |`" __ | ||  | 
/_______.'/ /  | /  | ||\    / ' .'.''| ||__| 
\_______|/ |   `'.  | |/\'..' / / /   | |_    
           '   .'|  '/'  `'-'`  \ \._,\ '/    
            `-'  `--'            `--'  `"

However, I'm getting multiple errors since I do not know how you would input this to make it show up in the console when I activate the code.

Upvotes: 6

Views: 22613

Answers (7)

Adrian Netto
Adrian Netto

Reputation: 1

The solution I found was create an txt file that contains the ascii art, and use the fs module, like this

const fs = require('fs');

fs.readFile('./ascii.txt', 'utf8', (err, data) => {
  if (err) {
    console.error('Error reading the file:', err);
    return;
  }
  console.log(data);
});

Upvotes: 0

Michael Eliot
Michael Eliot

Reputation: 1186

Try String.raw

const asciiArt = String.raw`
___      .-""-.      ___
\  "-.  /      \  .-"  /
 > -=.\/        \/.=- <
 > -='/\        /\'=- <
/__.-'  \      /  '-.__\
         '-..-'

    ____
  .' /  '.
 /  (  .-'\
|'.__\/__  |
|    /\  '.|
 \.-'  )  /
  '.__/_.'

      ____
    .' /:::.
   /  (:::-'\
  |:\__\/__  |
  |::::/\:::\|
   \::'  )::/
     '.__/::'
`
console.log(asciiArt)

Upvotes: 1

alex devassy
alex devassy

Reputation: 607

Found this amazing online converter which can be used to escape JavaScript string

Copy paste ASCII text to freeformatter, copy the escaped string to console.log("");

console.log("\r\n\u2591\u2588\u2588\u2588\u2588\u2588\u2557\u2591\u2591\u2588\u2588\u2588\u2588\u2588\u2557\u2591\u2588\u2588\u2588\u2557\u2591\u2591\u2588\u2588\u2557\u2591\u2588\u2588\u2588\u2588\u2588\u2588\u2557\u2591\u2588\u2588\u2588\u2588\u2588\u2557\u2591\u2588\u2588\u2557\u2591\u2591\u2591\u2591\u2591\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2557\u2591\u2591\u2591\u2588\u2588\u2557\u2591\u2591\u2591\u2591\u2591\u2591\u2588\u2588\u2588\u2588\u2588\u2557\u2591\u2591\u2588\u2588\u2588\u2588\u2588\u2588\u2557\u2591\r\n\u2588\u2588\u2554\u2550\u2550\u2588\u2588\u2557\u2588\u2588\u2554\u2550\u2550\u2588\u2588\u2557\u2588\u2588\u2588\u2588\u2557\u2591\u2588\u2588\u2551\u2588\u2588\u2554\u2550\u2550\u2550\u2550\u255D\u2588\u2588\u2554\u2550\u2550\u2588\u2588\u2557\u2588\u2588\u2551\u2591\u2591\u2591\u2591\u2591\u2588\u2588\u2554\u2550\u2550\u2550\u2550\u255D\u2591\u2591\u2591\u2588\u2588\u2551\u2591\u2591\u2591\u2591\u2591\u2588\u2588\u2554\u2550\u2550\u2588\u2588\u2557\u2588\u2588\u2554\u2550\u2550\u2550\u2550\u255D\u2591\r\n\u2588\u2588\u2551\u2591\u2591\u255A\u2550\u255D\u2588\u2588\u2551\u2591\u2591\u2588\u2588\u2551\u2588\u2588\u2554\u2588\u2588\u2557\u2588\u2588\u2551\u255A\u2588\u2588\u2588\u2588\u2588\u2557\u2591\u2588\u2588\u2551\u2591\u2591\u2588\u2588\u2551\u2588\u2588\u2551\u2591\u2591\u2591\u2591\u2591\u2588\u2588\u2588\u2588\u2588\u2557\u2591\u2591\u2591\u2591\u2591\u2588\u2588\u2551\u2591\u2591\u2591\u2591\u2591\u2588\u2588\u2551\u2591\u2591\u2588\u2588\u2551\u2588\u2588\u2551\u2591\u2591\u2588\u2588\u2557\u2591\r\n\u2588\u2588\u2551\u2591\u2591\u2588\u2588\u2557\u2588\u2588\u2551\u2591\u2591\u2588\u2588\u2551\u2588\u2588\u2551\u255A\u2588\u2588\u2588\u2588\u2551\u2591\u255A\u2550\u2550\u2550\u2588\u2588\u2557\u2588\u2588\u2551\u2591\u2591\u2588\u2588\u2551\u2588\u2588\u2551\u2591\u2591\u2591\u2591\u2591\u2588\u2588\u2554\u2550\u2550\u255D\u2591\u2591\u2591\u2591\u2591\u2588\u2588\u2551\u2591\u2591\u2591\u2591\u2591\u2588\u2588\u2551\u2591\u2591\u2588\u2588\u2551\u2588\u2588\u2551\u2591\u2591\u255A\u2588\u2588\u2557\r\n\u255A\u2588\u2588\u2588\u2588\u2588\u2554\u255D\u255A\u2588\u2588\u2588\u2588\u2588\u2554\u255D\u2588\u2588\u2551\u2591\u255A\u2588\u2588\u2588\u2551\u2588\u2588\u2588\u2588\u2588\u2588\u2554\u255D\u255A\u2588\u2588\u2588\u2588\u2588\u2554\u255D\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2557\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2557\u2588\u2588\u2557\u2588\u2588\u2588\u2588\u2588\u2588\u2588\u2557\u255A\u2588\u2588\u2588\u2588\u2588\u2554\u255D\u255A\u2588\u2588\u2588\u2588\u2588\u2588\u2554\u255D\r\n\u2591\u255A\u2550\u2550\u2550\u2550\u255D\u2591\u2591\u255A\u2550\u2550\u2550\u2550\u255D\u2591\u255A\u2550\u255D\u2591\u2591\u255A\u2550\u2550\u255D\u255A\u2550\u2550\u2550\u2550\u2550\u255D\u2591\u2591\u255A\u2550\u2550\u2550\u2550\u255D\u2591\u255A\u2550\u2550\u2550\u2550\u2550\u2550\u255D\u255A\u2550\u2550\u2550\u2550\u2550\u2550\u255D\u255A\u2550\u255D\u255A\u2550\u2550\u2550\u2550\u2550\u2550\u255D\u2591\u255A\u2550\u2550\u2550\u2550\u255D\u2591\u2591\u255A\u2550\u2550\u2550\u2550\u2550\u255D\u2591")

Result

░█████╗░░█████╗░███╗░░██╗░██████╗░█████╗░██╗░░░░░███████╗░░░██╗░░░░░░█████╗░░██████╗░
██╔══██╗██╔══██╗████╗░██║██╔════╝██╔══██╗██║░░░░░██╔════╝░░░██║░░░░░██╔══██╗██╔════╝░
██║░░╚═╝██║░░██║██╔██╗██║╚█████╗░██║░░██║██║░░░░░█████╗░░░░░██║░░░░░██║░░██║██║░░██╗░
██║░░██╗██║░░██║██║╚████║░╚═══██╗██║░░██║██║░░░░░██╔══╝░░░░░██║░░░░░██║░░██║██║░░╚██╗
╚█████╔╝╚█████╔╝██║░╚███║██████╔╝╚█████╔╝███████╗███████╗██╗███████╗╚█████╔╝╚██████╔╝
░╚════╝░░╚════╝░╚═╝░░╚══╝╚═════╝░░╚════╝░╚══════╝╚══════╝╚═╝╚══════╝░╚════╝░░╚═════╝░

Upvotes: 4

Shadow
Shadow

Reputation: 41

You could also just use figlet. Make sure to install it first using npm i figlet

const figlet = require("figlet")
figlet.text("Text", function (err, data){
 console.log(data)
})

The code above is a function to send text to the module "figlet" and get the text back as ascii art. Try changing the "text" to see your outcome.

Upvotes: 4

Dimitri Kopriwa
Dimitri Kopriwa

Reputation: 14385

You can use the template string literal: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals

It can be done using the backtick charactere, example:

console.log(`%c
_______                                       
\  ___ \`'.            /|                 .--. 
 ' |--.\  \           ||                 |__| 
 | |    \  '          ||                 .--. 
 | |     |  '         ||  __        __   |  | 
 | |     |  | _    _  ||/'__ '.  .:--.'. |  | 
 | |     ' .'| '  / | |:/\`  '. '/ |   \ ||  | 
 | |___.' /'.' | .' | ||     | |\`" __ | ||  | 
/_______.'/ /  | /  | ||\    / ' .'.''| ||__| 
\_______|/ |   \`'.  | |/\'..' / / /   | |_    
           '   .'|  '/'  \`'-'\`  \ \._,\ '/    
            \`-'  \`--'            \`--'  \`" 
`, `font-family: monospace`);

You must arrange the ASCII:

  • escape every backticks, otherwise it will terminate the string.
  • font used by the console is different than the one used by the ASCII image (monospace), in Chrome you can set the fonts, otherwise, you'll need to arrange the ASCII image to fit the console font.

To view the font change, use the real console and not the one from StackOverflow

Upvotes: 8

Rocky Sims
Rocky Sims

Reputation: 3608

You need to escape both the back tick characters and the back slash characters.

const str = `_______                                       
\\  ___ \`'.            /|                 .--. 
 ' |--.\\  \\           ||                 |__| 
 | |    \\  '          ||                 .--. 
 | |     |  '         ||  __        __   |  | 
 | |     |  | _    _  ||/'__ '.  .:--.'. |  | 
 | |     ' .'| '  / | |:/\`  '. '/ |   \\ ||  | 
 | |___.' /'.' | .' | ||     | |\`" __ | ||  | 
/_______.'/ /  | /  | ||\\    / ' .'.''| ||__| 
\\_______|/ |   \`'.  | |/\\'..' / / /   | |_    
           '   .'|  '/'  \`'-'\`  \\ \\._,\\ '/    
            \`-'  \`--'            \`--'  \`" `;
console.log(str);

Upvotes: 3

Barmar
Barmar

Reputation: 781868

Use a template literal to embed newlines in the string. You'll need to escape the backticks that are in the string.

console.log(`_______                                       
\  ___ \`'.            /|                 .--. 
 ' |--.\  \           ||                 |__| 
 | |    \  '          ||                 .--. 
 | |     |  '         ||  __        __   |  | 
 | |     |  | _    _  ||/'__ '.  .:--.'. |  | 
 | |     ' .'| '  / | |:\`  '. '/ |   \ ||  | 
 | |___.' /'.' | .' | ||     | |\`" __ | ||  | 
/_______.'/ /  | /  | ||\    / ' .'.''| ||__| 
\_______|/ |   \`'.  | |/\'..' / / /   | |_    
           '   .'|  '/'  \`'-'\`  \ \._,\ '/    
            \`-'  \`--'            \`--'  \`" `);

Upvotes: 11

Related Questions