2015-06-22 84 views
-2

我試圖讓3D線圖的工作... Here鼠標懸停時不與不同3dObjects

的點和線的工作不錯,但我想監聽點(球)鼠標懸停時不僅沒有上線或網格或其他網格對象...

對我有單獨的3D對象和包裝器他們都在不同的3D對象.. 即 網格物體都格 點對象都點 線 - 對象有所有行..

lineContainer = new THREE.Object3D(); 

       d3.select(lineContainer) 
        .selectAll() 
        .data(currentVal) 
       .enter().append(
        function (d, i) { 
        var LineMaterial = new THREE.LineBasicMaterial({color: d.color}); 
        var PI2 = Math.PI * 2; 
        var geometry = new THREE.Geometry(); 
        var k = -10; 
        d.points.forEach(function(p){ 
         var _x = x1(p.id); 
         var _y = y1(p.y); 
         var _z = (i+1)*10; 
         geometry.vertices.push(new THREE.Vector3(_x,_y,_z)); 
        }); 
        // for (var j = 0; j < 30; j++) { 
        //  var _point = new THREE.SphereGeometry(0.8); 
        //  var _pointmaterial = new THREE.MeshBasicMaterial({color: _color(i)}); 
        //  var sphere = new THREE.Mesh(_point, _pointmaterial); 
        //  sphere.position.set(_x,_y,_z); 
        //  parentTransform.add(sphere); 
        // };   
        var line = new THREE.Line(geometry, LineMaterial); 
        line.userdata = d.id; 
        line.material.linewidth = 2; 
        return line; 
        } 
       ); 

      mainContainer.add(lineContainer); 

      pointsContainer = new THREE.Object3D(); 
       d3.select(pointsContainer) 
        .selectAll() 
        .data(_allPoints) 
       .enter().append(
        function (d, i) { 
        var _x = x1(d.id); 
        var _y = y1(d.y); 
        var _z = d.z*10; 
        var _point = new THREE.SphereGeometry(1.8); 
        var _pointmaterial = new THREE.MeshBasicMaterial({color: d.color}); 
        var sphere = new THREE.Mesh(_point, _pointmaterial); 
        // sphere.classes = "points"; 
        sphere.position.set(_x,_y,_z); 
        sphere.userdata = d; 
        var _toolTipValue = ""+d.id+"("+d.line+")"; 
        var spritey = makeTextSprite(_toolTipValue, { fontsize: 14}); 
        spritey.position.set(_x-5,_y+8,_z); 
        spritey.visible = false; 
        d.bindedTip = spritey; 
        tooltipContainer.add(spritey); 
        return sphere; 
        }); 

      mainContainer.add(pointsContainer); 

      scene.add(mainContainer); 



function render() { 
      if(!tooltipShow){ 
      // find intersections 
      var vector = new THREE.Vector3(mouse.x, mouse.y, 0.5); 
      // vector.unproject(camera) 
      projector.unprojectVector(vector, camera); 
      raycaster = new THREE.Raycaster(camera.position, vector.sub(camera.position).normalize()); 

      // raycaster.setFromCamera(mouse, camera); 
      //lineintersect 

      // var intersects = raycaster.intersectObjects(lineContainer.children, true); 


      var pointIntersects = raycaster.intersectObjects(pointsContainer.children, true); 
      // console.log(pointIntersects); 
      if (pointIntersects.length > 0) { 
       console.log(pointIntersects) 
       if (currentPointIntersected !== undefined) { 

       } 

       if(currentPointIntersected != pointIntersects[ 0 ].object){ 
        currentPointIntersected = pointIntersects[ 0 ].object; 
        console.log(currentIntersected); 
         _allPoints.forEach(function(e,i){ 
          if(e.id && e.bindedTip){ 
           if(e.id == currentPointIntersected.userdata.id){ 
             e.bindedTip.visible = true; 
             e.bindedTip.getTexture().needsUpdate = true; 
             e.isHover = true; 

           }else{ 
             e.bindedTip.visible = false; 
             e.bindedTip.getTexture().needsUpdate = true;  
             e.isHover = false; 
           } 
          } 
         }); 
       } 
      } else { 
       if (currentPointIntersected !== undefined) { 
        currentPointIntersected.material.linewidth = 1; 
       } 
       currentPointIntersected = undefined; 

      } 
      } 

      renderer.render(scene, camera); 
      stats.update(); 
     } 

我有使用上THREEjs相同的代碼和相同的版本從here
但只能聽上級點不是在Z軸後方的點....

我怎麼能可以管理。 ..

+0

相關的代碼添加到這個問題。鏈接可能會打破 – Soana

+0

它是第一個鏈接中的大代碼,您可以獲取代碼,但嘗試顯示代碼 –

+0

您要在哪裏添加懸停行爲? – Soana

回答

0

我添加新的場景和渲染...和頂部的場景結合小鼠呈現兩個場景..和所有其他元素在另一個場景..