CODEWITHSUNDEEP
javascriptd3.js3dthree.js
Amit Rana
Amit Rana

Reputation: 1117

3D Lines disappear sometimes

I am building 3d line chart from data

here is the code Demo

the part of code that generate line is 

     parentTransform = new THREE.Object3D();
            var _color = d3.scale.category10();
            for (var i = 5; i > 0; i--) {
                var material = new THREE.LineBasicMaterial({
                    // color: 0x0000ff,linewidth: 30
                     color: _color(i), linewidth: 50
                });
                var PI2 = Math.PI * 2;

                var geometry = new THREE.Geometry();
                var k = -10;
                    for (var j = 0; j < 80; j=j+10) {
                        var _x = j;
                        var _y = (Math.floor(Math.random() * (50 - 10 + 1)) + 10);
                        var _z = i*5;

                        geometry.vertices.push(new THREE.Vector3(_x,_y,_z));
                        var _point = new THREE.SphereGeometry(0.8);
                        var material = new THREE.MeshBasicMaterial( {color: _color(i)} );
                        var sphere = new THREE.Mesh( _point, material );
                        sphere.position.set(_x,_y,_z);
                        parentTransform.add( sphere );
                    };           
                var line = new THREE.Line(geometry, material);
                line.material.linewidth = 2;
                parentTransform.add(line);
            };
            scene.add( parentTransform );

Sometime When I start to rotate/zoom line disappear.. only point stay there

also I wanted to add 3 axis walls any help ? I have experience with d3.js and new at Three.js so any help will be most welcome

Upvotes: 0

Views: 241

Answers (1)

WestLangley
WestLangley

Reputation: 104763

You are defining the variable material in two places, and consequently you are passing MeshBasicMaterial instead of LineBasicMaterial to the THREE.Line constructor.

three.js r.71

Upvotes: 1

Related Questions