Question

我正在创建一个程序，在鼠标单击时填充地面上的块的世界（坐标基于我计算的鼠标点击坐标）。创建新块时，它不应与预先生成的块相交。我用THREE.Raycaster完成了这个检查。基本上我是从块的中心向其顶点的所有方向投射光线。

var ln = preview.geometry.vertices.length;

//for each vertices we throw a ray
for(var i = 0; i < ln; i++){
    var pr_vertex = preview.geometry.vertices[i].clone();
    var gl_vertex = pr_vertex.applyMatrix4(preview.matrix);
    var dr_vector = gl_vertex.sub(preview.position);

    var ray = new THREE.Raycaster(preview.position, dr_vector.clone().normalize());
    var intersects = ray.intersectObjects(objmanager.getAllObject(), true);

    //if there is intersection
    if(intersects.length > 0 && intersects[0].distance < dr_vector.length()){
        //hide preview material
        preview.material.opacity = 0;
        //exit checking
        break;
    }
}

preview是对象的名称。这段代码已经很完美了。问题是，只有当光线与被测对象的正面相交时，Raycaster.intersectObjects才有效。我在运行代码时测试了它，如果光线从测试对象外面开始，它们相交就好了。但是当射线从测试块的内部开始时，它没有捕获与被测块的表面的交点。我认为这是因为intersectObjects只与被测对象的前表面一起工作。这是真的吗？

直观地说，我尝试使用THREE.DoubleSide（制作双面对象）来解决这个问题。但它产生了一个错误，因为着色器无法初始化。

Could not initialise shader
VALIDATE_STATUS: false, gl error [0] three.js:25254
    buildProgram three.js:25254
    initMaterial three.js:23760
    setProgram three.js:23830
    renderBuffer three.js:22371
    renderObjects three.js:23061
    render three.js:22935
    animLoop

我正在使用THREE.MeshLambertMaterial。当我使用MeshBasicMaterial时，Raycaster.intersectObjects根本不起作用。

所以我现在遇到了障碍。有什么想法可以解决这个问题吗？不管怎样，或者我必须手动测试碰撞与每个物体的个别面孔（我担心这会很难达到性能）。

提前谢谢。

===============

编辑：我忘了提，我正在使用最新的three.js版本，应该是r63左右

Answer 1

如果你设置：

object.material.side = THREE.DoubleSided

你应该在两个表面都受到打击。

Answer 2

如果双面，你将有两个交叉点：

public void clickButton(View v){
    Bitmap myBitmap = ((BitmapDrawable)myImageView.getDrawable()).getBitmap();

    Bitmap newBitmap = addGradient(myBitmap);
    myImageView.setImageDrawable(new BitmapDrawable(getResources(), newBitmap));
}


public Bitmap addGradient(Bitmap originalBitmap) {
    int width = originalBitmap.getWidth();
    int height = originalBitmap.getHeight();
    Bitmap updatedBitmap = Bitmap.createBitmap(width, height, Bitmap.Config.ARGB_8888);
    Canvas canvas = new Canvas(updatedBitmap);

    canvas.drawBitmap(originalBitmap, 0, 0, null);

    Paint paint = new Paint();
    LinearGradient shader = new LinearGradient(0, 0, 0, height, 0xFFF0D252, 0xFFF07305, Shader.TileMode.CLAMP);
    paint.setShader(shader);
    paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_IN));
    canvas.drawRect(0, 0, width, height, paint);

    return updatedBitmap;
}

Three.js Raycaster.intersectObjects仅检测前表面上的交叉点

2 个答案: