Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/three.js/2.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 为什么我的行星几何体没有收到阴影?_Javascript_Three.js - Fatal编程技术网

Javascript 为什么我的行星几何体没有收到阴影?

Javascript 为什么我的行星几何体没有收到阴影?,javascript,three.js,Javascript,Three.js,我正在使用three.js创建一个场景,其中包含一个模型。我有一架模型坐的飞机,聚光灯照在模型上 模型由许多不同的对象组成。所有对象都设置为接收和投射阴影。阴影从模型的其他区域投射到模型本身上 但是,该平面不会接收阴影。我不知道为什么 我已调整了聚光灯.shadowCameraNear和聚光灯.shadowCameraFar属性,以确保模型和平面都在阴影区域内。还是没什么 下面是模型的屏幕截图,聚光灯可见。 我已启用阴影贴图并将其设置为软贴图: renderer.shadowMap.enabl

我正在使用three.js创建一个场景,其中包含一个模型。我有一架模型坐的飞机,聚光灯照在模型上

模型由许多不同的对象组成。所有对象都设置为接收和投射阴影。阴影从模型的其他区域投射到模型本身上

但是,该平面不会接收阴影。我不知道为什么

我已调整了聚光灯.shadowCameraNear和聚光灯.shadowCameraFar属性,以确保模型和平面都在阴影区域内。还是没什么

下面是模型的屏幕截图,聚光灯可见。

我已启用阴影贴图并将其设置为软贴图:

renderer.shadowMap.enabled = true; // Shadow map enabled
renderer.shadowMap.type = THREE.PCFSoftShadowMap;
我的代码如下:

<script>

    if ( ! Detector.webgl ) Detector.addGetWebGLMessage();

    var container, stats, controls;
    var camera, scene, renderer, sceneAnimationClip ;

    var clock = new THREE.Clock();

    var mixers = [];
    var globalObjects = [];         

    init();

    function init() {

        var loader = new THREE.TextureLoader();

        container = document.createElement( 'div' );
        document.body.appendChild( container );

        // Scene
        scene = new THREE.Scene();
        scene.fog = new THREE.Fog( 0xffffff, 50, 100 );

        // Camera
        camera = new THREE.PerspectiveCamera( 30, (window.innerWidth / window.innerHeight), 1, 10000 );
        camera.position.x = 1000;
        camera.position.y = 50;
        camera.position.z = 1500;
        scene.add( camera );

        // LIGHTS
        var spotLight = new THREE.SpotLight( 0xffffff,1 );
        spotLight.position.set( 5, 5, 6 );

        spotLight.castShadow = true;

        spotLight.target.position.set(-1, 0, 2 );
        spotLight.shadowDarkness = 0.5;             
        spotLight.shadowCameraNear = 4; 
        spotLight.shadowCameraFar = 25;

        scene.add( spotLight );

        // Camera helper for spotlight
        var helper = new THREE.CameraHelper( spotLight.shadow.camera );
        scene.add( helper );

        // ground
        var geometry = new THREE.PlaneGeometry( 30, 30 );
        geometry.receiveShadow = true;
        var material = new THREE.MeshBasicMaterial( {color: 0xcccccc, side: THREE.DoubleSide} );
        material.receiveShadow = true;
        var floor = new THREE.Mesh( geometry, material );
        floor.receiveShadow = true;
        floor.position.y = -1;
        floor.rotation.x = Math.PI / 2;
        scene.add( floor );

        // stats
        stats = new Stats();
        container.appendChild( stats.dom );

        // model
        var manager = new THREE.LoadingManager();
        manager.onProgress = function( item, loaded, total ) {
            console.log( item, loaded, total );
        };

        // BEGIN Clara.io JSON loader code
        var i = 0;
        var objectLoader = new THREE.ObjectLoader();
        objectLoader.load("final-master-20170426.json", function ( object ) {

            var textureLoader = new THREE.TextureLoader();

            object.traverse( function ( child )
            {
                if ( child instanceof THREE.Mesh ) { 
                    var material = child.material.clone();

                    material.shininess = 0;
                    material.wireframe = false;
                    material.normalScale = new THREE.Vector2( 1, 1 );

                    /* Roof Glass */
                    if(child.name == 'Roof_Glass') {
                        material.shininess = 100;
                        material.alphaMap = grayscale;
                        material.transparent = true;
                    }

                    // Beading
                    if(child.name.endsWith('_Beading')) {
                        material.color.setHex( 0x1e1e1e );
                        material.shininess = 100;
                    }

                    /* Pillars */
                    if(
                        child.name.indexOf('Pillar') == 0 ||
                        child.name == 'Main_Frame' || 
                        child.name == 'Main_Cross_Supports' ||
                        child.name == 'roof_batons' ||
                        child.name == 'Roof_Flashings'                              
                    ) {
                        material.color.setHex( 0x1e1e1e );
                        material.shininess = 100;
                    }

                    /* Lamps */
                    if(child.name.indexOf('Lamp') == 0) {
                        material.color.setHex( 0x1e1e1e );
                        material.shininess = 100;
                    }
                    // Set shadows for everything
                    material.castShadow = true;
                    material.receiveShadow = true;

                    child.material = material;

                    material = undefined;

                    globalObjects[child.name] = child;

                    console.log(child);
                }
            });
            object.position.y = -1;
            object.position.x = 0;

            scene.add( object );
            scene.fog = new THREE.Fog( 0xffffff, 50, 100 );

            i++;
        } );
        // END Clara.io JSON loader code

        renderer = new THREE.WebGLRenderer({
            'antialias': true   
        });
        renderer.setPixelRatio( window.devicePixelRatio );
        renderer.setSize( window.innerWidth, window.innerHeight );
        renderer.setClearColor( scene.fog.color );

        container.appendChild( renderer.domElement );

        renderer.gammaInput = true;
        renderer.gammaOutput = true;
        renderer.shadowMap.enabled = true; // Shadow map enabled
        renderer.shadowMap.type = THREE.PCFSoftShadowMap;

        // controls, camera
        controls = new THREE.OrbitControls( camera, renderer.domElement );
        controls.target.set( 0, 0, 0 );
        controls.maxPolarAngle = Math.PI * 0.5;
        camera.position.set( 8, 3, 10 );
        controls.update();

        window.addEventListener( 'resize', onWindowResize, false );

        animate();

    }

    function onWindowResize() {

        camera.aspect = window.innerWidth / window.innerHeight;
        camera.updateProjectionMatrix();

        renderer.setSize( window.innerWidth, window.innerHeight );

    }

    //

    function animate() {

        requestAnimationFrame( animate );
        stats.update();
        render();

    }

    function render() {

        var delta = 0.75 * clock.getDelta();
        camera.lookAt( scene.position );
        renderer.render( scene, camera );

    }
</script>

如果(!Detector.webgl)Detector.addGetWebGLMessage();
var容器、stats、控件;
var摄影机、场景、渲染器、sceneAnimationClip;
var clock=新的三个时钟();
var混频器=[];
var globalObjects=[];
init();
函数init(){
var loader=new THREE.TextureLoader();
container=document.createElement('div');
文件.正文.附件(容器);
//场面
场景=新的三个。场景();
scene.fog=新的3.fog(0xffffff,50100);
//摄像机
摄像头=新的三个透视摄像头(30,(window.innerWidth/window.innerHeight),11000);
摄像机位置x=1000;
摄像机位置y=50;
摄像机位置z=1500;
场景。添加(摄影机);
//灯光
var spotLight=新的三个聚光灯(0xffffff,1);
聚光灯。位置。设置(5,5,6);
spotLight.castShadow=true;
聚光灯.target.position.set(-1,0,2);
聚光灯.阴影暗度=0.5;
spotLight.shadowCameraNear=4;
spotLight.shadowCameraFar=25;
场景。添加(聚光灯);
//聚光灯的摄影机辅助对象
var helper=new THREE.CameraHelper(spotLight.shadow.camera);
场景.添加(助手);
//地面
var几何=新的三个平面几何(30,30);
geometry.receiveShadow=true;
var material=新的三个.MeshBasicMaterial({color:0xCCCC,side:THREE.DoubleSide});
material.receiveShadow=true;
var地板=新的三个网格(几何体、材质);
floor.receiveShadow=true;
楼层位置y=-1;
floor.rotation.x=Math.PI/2;
场景。添加(楼层);
//统计数据
统计数据=新统计数据();
container.appendChild(stats.dom);
//模型
var-manager=new-THREE.LoadingManager();
manager.onProgress=功能(项目、已加载、总计){
控制台日志(项目、已加载、总计);
};
//开始Clara.io JSON加载程序代码
var i=0;
var objectLoader=new THREE.objectLoader();
加载(“final-master-20170426.json”,函数(对象){
var textureLoader=new THREE.textureLoader();
遍历(函数(子对象)
{
if(三个.Mesh的子实例){
var material=child.material.clone();
材料光泽度=0;
material.wireframe=假;
material.normalScale=新的三个向量2(1,1);
/*屋顶玻璃*/
如果(child.name==“屋顶玻璃”){
材料光泽度=100;
material.alphaMap=灰度;
material.transparent=true;
}
//串珠
if(child.name.endsWith(“'u Beading')){
材料。颜色。设置十六进制(0x1E);
材料光泽度=100;
}
/*支柱*/
如果(
child.name.indexOf('支柱')==0||
child.name=='Main|u Frame'|
child.name=='Main\u Cross\u Supports'||
child.name==“屋顶警棍”||
child.name==“屋顶防水板”
) {
材料。颜色。设置十六进制(0x1E);
材料光泽度=100;
}
/*灯*/
if(child.name.indexOf('Lamp')==0){
材料。颜色。设置十六进制(0x1E);
材料光泽度=100;
}
//为一切设置阴影
material.castShadow=true;
material.receiveShadow=true;
child.material=material;
材料=未定义;
GlobalObject[child.name]=子对象;
console.log(子级);
}
});
object.position.y=-1;
object.position.x=0;
场景。添加(对象);
scene.fog=新的3.fog(0xffffff,50100);
i++;
} );
//结束Clara.io JSON加载程序代码
renderer=new THREE.WebGLRenderer({
“反别名”:true
});
renderer.setPixelRatio(window.devicePixelRatio);
renderer.setSize(window.innerWidth、window.innerHeight);
renderer.setClearColor(scene.fog.color);
container.appendChild(renderer.doElement);
renderer.gammaInput=true;
renderer.gammaOutput=true;
renderer.shadowMap.enabled=true;//已启用阴影贴图
renderer.shadowMap.type=THREE.PCFSoftShadowMap;
//控制装置、照相机
控件=新的三个.轨道控件(摄影机、渲染器.doElement);
controls.target.set(0,0,0);
controls.maxPolarAngle=Math.PI*0.5;
C