【问题标题】:Three.js - shadows rendering on cube but not on imported json mesh objectThree.js - 在立方体上渲染阴影,但不在导入的 json 网格对象上
【发布时间】:2015-11-10 20:41:04
【问题描述】:

我正试图让我的赛车在地板上投下阴影。阴影在立方体中起作用(立方体正在投射阴影),但赛车(导入的 json 网格对象)没有投射阴影。我怎样才能让赛车投下阴影?这与在材料上烘烤的 json 文件有关吗?代码obj.castShadow = true; 是否真的需要放在obj 的一个孩子上?在这种情况下,哪个孩子?我在这里做错了什么?

Here's the json fileHere's a link to a demo

下面是相关代码:

    var loader = new THREE.ObjectLoader();  
    loader.load("models/ferrari-f1-race-car.json", function (obj) {
        obj.castShadow = true;
        obj.scale.set(50,50,50);
        obj.position.x = 30;
        obj.rotation.y = Math.PI/1;
        scene.add (obj);
    });

    boxgeometry = new THREE.BoxGeometry(100, 100, 100);
    boxmaterial = new THREE.MeshLambertMaterial({
        color: 0x0aeedf
    });
    var cube = new THREE.Mesh(boxgeometry, boxmaterial);
    cube.castShadow = true;
    cube.position.x = -80;
    cube.position.y = 50;
    cube.position.z = 0;
    scene.add(cube);

    function createFloor(){ 
        floor = new THREE.Mesh(new THREE.PlaneBufferGeometry(1000,500), new THREE.MeshBasicMaterial({color: 0x8594a2}));
        floor.rotation.x = -Math.PI/2;
        floor.position.y = -0;
        floor.castShadow = false;
        floor.receiveShadow = true;
        scene.add(floor);
    }

【问题讨论】:

    标签: javascript 3d three.js shadow mesh


    【解决方案1】:

    投射阴影的成本很高,并且在自定义对象上没有得到很好的支持,经常会出现错误。

    最好的解决方案是在汽车下方的透明平面上绘制阴影纹理。如果您需要旋转汽车或灯光并需要精确的阴影,这可能是个问题,因为纹理不会随角度而变化。由作者决定使用技巧(旋转相机或使用偏斜的阴影)。那仍然可以提供很棒的效果图,检查http://helloracer.com/racer-s/ 和使用的简单图像:

    更令人印象深刻:

    对于这个逼真的演示http://www.littleworkshop.fr/renaultespace/

    【讨论】:

    • 谢谢。顺便说一句,这些都是很棒的演示链接,你和这些项目有什么关系吗?太棒了!
    猜你喜欢
    • 1970-01-01
    • 2017-03-29
    • 1970-01-01
    • 1970-01-01
    • 2016-09-26
    • 1970-01-01
    • 2012-03-06
    • 1970-01-01
    • 2014-05-18
    相关资源
    最近更新 更多