【问题标题】:How to add a map to a light source in ThreeJS?如何在 ThreeJS 中将地图添加到光源?
【发布时间】:2021-04-01 22:46:14
【问题描述】:

所以我正在尝试制作一个简单的太阳系,并且我正在尝试弄清楚如何使太阳成为光源以及向其添加图像地图以使其看起来像太阳。我的代码使它成为光源,但我看不到太阳,它只是一个黑色圆圈。有什么可以帮助的想法吗?

        //Adding the sun
        geometry1 = new THREE.SphereGeometry( 100, 32, 32 );
        light = new THREE.PointLight( 0xffffff, 1, 5000 );
        material1 = new THREE.MeshStandardMaterial( {
            // emissive: 0xff00ff,
            // emissiveIntensity: 1,
            map: THREE.ImageUtils.loadTexture('sun.jpg'),
            color: 0xffffff,
            side: THREE.FrontSide
        });
        light.add(new THREE.Mesh(geometry1, material1));
        light.position.set(0,0,0);
        light.castShadow = true;

这是场景的样子,您可以看到地球有来自太阳的光。

这是制作太阳的代码,然后我将其添加到场景中。谢谢大家!

【问题讨论】:

    标签: javascript three.js light


    【解决方案1】:

    你应该添加skinning: true

    geometry1 = new THREE.SphereGeometry( 100, 32, 32 );
    light = new THREE.PointLight( 0xffffff, 1, 5000 );
    material1 = new THREE.MeshStandardMaterial( {
        // emissive: 0xff00ff,
        // emissiveIntensity: 1,
        skinning: true,
        map: THREE.ImageUtils.loadTexture('sun.jpg'),
        color: 0xffffff,
        side: THREE.FrontSide
    });
    light.add(new THREE.Mesh(geometry1, material1));
    light.position.set(0,0,0);
    light.castShadow = true;
    

    【讨论】:

    • 如果不起作用,请尝试在 THREE.DoubleSide 上替换 THREE.FrontSide
    猜你喜欢
    • 2018-04-28
    • 1970-01-01
    • 1970-01-01
    • 2019-12-01
    • 2021-10-12
    • 2019-10-21
    • 2018-02-22
    • 1970-01-01
    相关资源
    最近更新 更多