Question

我正在努力使用一个Object3D，子网格应该看相机的位置它工作正常，如果相机是＆＃34;远＆＃34;离开，但如果相机移向物体则不行。

如果相机位置靠近物体位置，则第二个添加的平面旋转，直到相机看到计划的边缘。

而且我知道为什么这种行为只出现在第二个添加的平面上，而且只是相机靠近物体位置。

这是我到目前为止所拥有的创建对象：

var obj = new THREE.Object3D();
obj.position.set( x, y, z );
var Uniforms = {
    texturePrimary:     { type: "t", value: Texture },
    textureColorGraph:  { type: "t", value: ColorGraph },
    time:               { type: "f", value: 0 },
    color:  { type: "f", value: 0 }
};

obj.Uniforms = Uniforms;
obj.add( makeplane1( 3.2, Uniforms ) );
obj.add( makeplane2( 25, Uniforms ) );

obj.update = function( pos ){
    this.Uniforms.time.value = shaderTiming;
    $.each(this.children, function(i,mesh){
        if( mesh.name === "plane1" || mesh.name === "plane2"){
            var vec = mesh.parent.worldToLocal( pos );
            mesh.lookAt( vec );
        }
    });
};

function makePlane1( radius, uniforms ){
  var Geo = new THREE.PlaneGeometry( radius, radius );
  var Material = new THREE.ShaderMaterial(
      {
        uniforms:       uniforms,
        vertexShader:   shaders[1].vertex,
        fragmentShader: shaders[1].fragment,
        blending: THREE.AdditiveBlending,
        transparent: true
      };

var plane = new THREE.Mesh( Geo, Material );
plane.name = "plane1";
return plane;
);

function makePlane2( radius, uniforms ){
  var Geo = new THREE.PlaneGeometry( radius, radius );
  var Material = new THREE.ShaderMaterial(
      {
        uniforms:       uniforms,
        vertexShader:   shaders[2].vertex,
        fragmentShader: shaders[2].fragment,
        blending: THREE.AdditiveBlending,
        transparent: true
      };
);

var plane = new THREE.Mesh( Geo, Material );
plane.name = "plane2";
return plane;
}

我可以在this.lookAt( pos )中调用obj.update( pos )来旋转整个对象，但其他网格不应该以这种方式旋转，所以很遗憾没有选择。

两个平面的简单顶点着色器：

varying vec2 vUv;
void main() {
  gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );
  vUv = uv;
}

然后我在动画循环中调用：

$.each(scene.children, function(i, obj){
    if( obj.update !== undefined ) {
        shaderTiming = (time - startTime )/ 1000;
        obj.update( camera.getWorldPosition() );
    }   
});

编辑：我刚刚注意到，如果对象的位置不是(0,0,0)，则会发生此行为。如果是这样，它就像在任何相机位置那样工作。
此外，对象的简单距离计算也无法正常工作。

vec1 = this.position;
vec2 = camera.position;
var dist = Math.sqrt(Math.pow(vec1.x - vec2.x, 2) + Math.pow(vec1.y - vec2.y, 2) + Math.pow(vec1.z - vec2.z, 2));

感谢任何提示。

Answer 1

Object3D.lookAt()不支持具有旋转和/或翻译父级的对象。

three.js r.85

Three.js Object3d孩子看相机位置

1 个答案: