I am facing a challenge with the default cube's appearance in wireframe mode, as it is made up of triangles instead of squares.
To combat this, I created my own geometry which looks satisfactory. However, I have noticed that the raycaster does not function as effectively with my custom objects compared to the pre-built cubes.
var cube = new THREE.Line( getCube( 5,5, 5), new THREE.LineDashedMaterial( { color: 0x000000,dashSize: 1, gapSize: 0.1, linewidth: 2 } ),THREE.LinePieces );
The function getCube() returns:
var geometry = new THREE.Geometry()
For a visual example, refer to: http://jsfiddle.net/QHjSM/12/
The six color filled boxes on the top are default THREE.CubeGeometry boxes, which can be selected accurately using the raycaster. The wireframe boxes below are my custom geometry.
There are some challenges: When attempting to click outside a box, it may inadvertently select the box instead. Additionally, clicking directly in the center of a box may not register the selection. Another issue is that clicking near one box may result in the selection of a neighboring box.
Despite trying various geometry.compute methods, the issue persists and I am uncertain if there is a better solution.