Can't get three.js DodecahedronGeometry on the screen

hi everyone,

i’m developing a 3D + 2D web operating system (a step up from a CMS i can tell you).

now, i want to display files as cubes (no problems there[2]), and folders as DodeCahedronGeometry instances with a custom material.

i’ve uploaded my sources;

which gets used here :

live demo is up at NicerApp WebOS Unified Interface
and you can stay up to date with GitHub - NicerEnterprises/NicerApp-WebOS-v6.y.z as well.

i’m new to the threejs world, but i am really committed towards becoming the first guy offering a true 3D + 2D WebOS.
and i could use some help with this puzzle, and probably some more as i build up this software.

What appears when you console log the DodecahedronGeometry mesh? Do the scale and size has reasonable values? Is both the geometry and the material defined?

In the shared snippets it looks like you’re creating a BoxGeometry of size 300x300x300, but DodecahedronGeometry with just the default size of 1x1x1.

How do you use var baseUVs = ...




from the
Collection of examples from

ok, you were right about the scaling… my world is 100 * 1000 large because i want to work with detailed textures even when zoomed in on details btw.

var g = new THREE.DodecahedronGeometry(250);
fixed the sizing problem

next problem : there’s no easy way to specify the color of the DodecahedronGeometry :frowning:
i’m gonna need a semi-transparent solution.

Not sure what you mean, world scale is unrelated to texture quality. Texture applied to 1x1x1 geometry will look the same as a texture applied to a 100x100x100 geometry after rasterization :thinking: Scale affects only size of one object relative to other objects - the only thing affecting texture quality is the resolution and anisotropy of the texture.

You can apply colors using materials - geometries on their own do not have colors etc. You can make material transparent by setting .transparent = true and setting .opacity to a value below 1.0.

i tried your solution for the materials, but unfortunately it doesn’t work yet…
i can get to be black and semi-transparent, but not a specific color…

The material.color is multiplied with whatever texture color you have assigned. Try removing the texture and see if material.color works correctly… if it does, then try adding texture back.

i removed map: from the material instance setup code, .color still doesn’t work :frowning:

the meshes stay black and semi-transparent.

ok, the solution turned out to be real simple… don’t use 0x0000FF, use #0000FF for the ‘emissive’ color

Well, you can use 0x0000ff, if you don’t put ' around it, turning it into a string, whereas it needs to be a hex number. 0x0000ff and '0x0000ff' are different things.