search

sinclairzx81 / zero

A 3D renderer written in JavaScript and rendered to the terminal.
Other
2.41k stars 143 forks source link

Use as three.js renderer #1

Closed GavanWilhite closed 4 years ago

GavanWilhite commented 4 years ago

Hey, how difficult do you think it would be to add this as an alternative renderer for three.js?

sinclairzx81 commented 4 years ago

Hah, that's a neat idea ! The performance might be a bit rough tho :)

I think the main cross over point would be this projects triangle rasterizer + vertex | fragment shader setup. It should be possible to lift out the rasterizer (basically everything under ./src/engine/raster) and implement in a THREE Renderer type (feeding the rasterizer geometry buffers from THREE AttributeBuffers).

This project does use a similar Scene Graph setup to what THREE is using. For an example of implementing a Renderer over the top of the Rasterizer, have a look at this code which is just recursively traversing the graph and feeding in Mesh data. I'd imagine a THREE version to look very similar. (using THREE's own Scene, Mesh, Object3D, Material, etc etc types instead)

As for the shader | material setup, there is a simple vertex | fragment shader used for this demo here. Certainly implementing per pixel lighting (perhaps Blinn-Phong) in JavaScript would be an interesting experiment :D

zalo commented 4 years ago

Alternatively, if you didn’t mind keeping the GPU/WebGL, it’s possible a post-process version could be formed from this example: https://threejs.org/examples/webgl_effects_ascii.html

I could see replacing the char sequence used here to match Zero’s: https://github.com/mrdoob/three.js/blob/master/examples/webgl_effects_ascii.html#L58

(And then modifying it to output to a terminal rather than a div.)

sinclairzx81 commented 4 years ago

@zalo Hi. Yeah that's certainly doable :) Still, I'm pretty keen to keep things running in pure software for this particular project. Mainly to keep the project as a reference / starting point for those who may be interested in plain old software rasterization.

Besides, a GPU implementation wouldn't be as fun :D

sinclairzx81 commented 4 years ago

Going to close this one off. Implementing a THREEJS Renderer for the terminal would be pretty great, but probably best implemented in a separate project. Cheers guys.