I was wondering if it’s programmatically possible to add thickness to a 2D pixelated image/sprite in ThreeJS? An example would be:
From:
To:
image sources:
You could do this in various ways.
One is by applying the texture (the image of the sword) to a mesh (the geometry of the sword). The geometry would then have a certain thickness and, when viewed from an angle, give the effect you desire.
Another option is to construct the sword out of “voxels” - which is just a fancy word for blocks, the size of a pixel - and color each voxel according to the sword look.
Either way you have to generate the geometry in threejs since everything is 3D.
Maybe add texture to 2d canvas, get pixels position, color and convert it into boxed meshes, merge meshes like in minecraft with deleting invisible sides or just merge.
2 Likes
yes its possible