Skip to content

zz85/threejs-term

Repository files navigation

Terminal Renderer for Three.js

This is an example of how you can run three.js in your terminal. Sysadmins can now run three.js in remote ssh sessions!

Using demo

threejs-term

Keys

m - Toggle Ascii Mode (plain -> color blocks -> color + ascii -> ascii colors)

b - Toggle Braille Mode

w - Toggle Wireframe Mode

o / p - Decrease / Increase Canvas Render Resolution

e - Switch bettwen various geometry objects

q, Ctrl-C, Esc - Quits app.

Ctrl-F12 - Developer's console

a - Camera Rotate Mode

s - Camera Scale Mode

d - Camera Position Mode

Updates

Dec 17 2023 - v3.0

  • Getting the original example to run in modern environments, including bunjs
  • Remove node-canvas dependency temporarily, use three-software-renderer

Install and Running

If you prefer to run it by git cloning environment, look at the development section.

$ npm install -g threejs-term # install and link binary
$ threejs-term # runs the demo

Troubleshooting

If npm install fails to compile Canvas bindings to Cairo, make sure your system have the necessary libraries. For mac homebrew users, you can simply run brew install cairo.

Features

  • Shows off using three.js in node based environments.
  • Terminal / ASCII based rendering
  • Screen resize detection aka "Responsive Design"!
  • Support mouse events
  • Emulate keypress
  • Toggle different ASCII rendering modes

Internals

This is built with some awesome libraries.

Development

Play with the source

Install dependencies

$ git clone https://github.com/zz85/threejs-term.git
$ npm i # Replace npm with yarn if you like
$ npm start # or node play.js

It's tricky to debug blessed apps (since console.log's gonna messup the terminal), so I'll pipe console.error messages to a log file and tail it elsewhere. log() helper function can also be used.

$ npm run dev # or node play.js 2>> logs.txt
$ tail -f logs.txt

Made by

Yet another random idea by the Graphics Noob