将webGl渲染更改为Canvas渲染

Question

To make bounding box i use this code:

  'vtk_bounding_box': function(data) {  
                    if ((browser == 'explorer') ||(THIS_IS_TOUCH_DEVICE)) return;
                    var geometry = new THREE.Geometry();
                    var material = new THREE.MeshBasicMaterial({color: 0xFF0000,wireframe: true});
                    box_info = '';

                    for (var i = 0; i < 8; i++){
                        box_info += i+': x:'+ data[i].x +'y:'+ data[i].y +'z:'+ data[i].z
                        geometry.vertices.push( new THREE.Vector3( data[i].x - FocalPoint[0],  data[i].y - FocalPoint[1], data[i].z - FocalPoint[2]));                
                    }                   

                    //Making Bounding Box
                    geometry.faces.push( new THREE.Face4(0,1,2,3));                   
                    geometry.faces.push( new THREE.Face4(2,3,4,7)); 
                    geometry.faces.push( new THREE.Face4(4,5,6,7)); 
                    geometry.faces.push( new THREE.Face4(5,6,1,0));
                    geometry.faces.push( new THREE.Face4(1,2,7,6)); 
                    geometry.faces.push( new THREE.Face4(0,3,4,5));

                    mesh = new THREE.Mesh( geometry, material);                 
                    scene.add( mesh );
                },

and when i change type of rendering from webGl to canvas?And when i rotate this, part of model just disappears sometime. I want to say that it can show full model? but after some rotation in can drow only few lines

Answer 1

To make it work in CanvasRenderer you need to make the material double-sided. In r.50, you do that like so:

var material = new THREE.MeshBasicMaterial( { color: 0xFF0000, wireframe: true, side: THREE.DoubleSide } );