缺少Three.js LegacyGLTFLoader.js阴影

我有一个GLTF版本1.0模型，我正在使用LegacyGLTFLoader.js将其导入Three.js。当我这样做时，一切看起来都很好，只是模型没有接收阴影。我猜这是因为导入模型的材质是THREE.RawShaderMaterial，它不支持接收阴影（我认为）。如何修复此问题，以便导入的模型可以接收阴影

以下是示例代码：

// Construct scene.
var scene = new THREE.Scene();

// Get window dimensions.
var width = window.innerWidth;
var height = window.innerHeight;

// Construct camera.
var camera = new THREE.PerspectiveCamera(75, width/height);
camera.position.set(20, 20, 20);
camera.lookAt(scene.position);

// Construct renderer.
var renderer = new THREE.WebGLRenderer();
renderer.setSize(width, height);
renderer.shadowMapEnabled = true;
document.body.appendChild(renderer.domElement);

// Construct cube.
var cubeGeometry = new THREE.BoxGeometry(10, 1, 10);
var cubeMaterial = new THREE.MeshPhongMaterial({color: 0x00ff00});
var cube = new THREE.Mesh(cubeGeometry, cubeMaterial);
cube.castShadow = true;
cube.translateY(15);
scene.add(cube);

// Construct floor.
var floorGeometry = new THREE.BoxGeometry(20, 1, 20);
var floorMaterial = new THREE.MeshPhongMaterial({color: 0x00ffff});
var floor = new THREE.Mesh(floorGeometry, floorMaterial);
floor.receiveShadow = true;
scene.add(floor);

// Construct light.
var light = new THREE.DirectionalLight(0xffffff);
light.position.set(0, 20, 0);
light.castShadow = true;
scene.add(light);

// Construct light helper.
var lightHelper = new THREE.DirectionalLightHelper(light);
scene.add(lightHelper);

// Construct orbit controls.
new THREE.OrbitControls(camera, renderer.domElement);

// Construct GLTF loader.
var loader = new THREE.LegacyGLTFLoader();

// Load GLTF model.
loader.load(
    "https://dl.dropboxusercontent.com/s/5piiujui3sdiaj3/1.glb",
    function(event) {
        var model = event.scene.children[0];
        var mesh = model.children[0];
        mesh.receiveShadow = true;
        scene.add(model);
    },
    null,
    function(event) {
        alert("Loading model failed."); 
    }
);

// Animates the scene.
var animate = function () {
    requestAnimationFrame(animate);
    renderer.render(scene, camera);
};

// Animate the scene.
animate();

以下是我的资源：

下面是一个JSFIDLE：

---

解决此问题的一种方法是将

RawShaderMaterial

的实例替换为

MeshStandardMaterial

。要获得预期效果，必须将现有纹理应用于新材质，如下所示：

var newMaterial=new THREE.MeshStandardMaterial（{粗糙度：1，金属度：0}）；
newMaterial.map=child.material.uniforms.u_tex.value；

还必须计算各个几何体的法线数据，以便正确计算照明。如果不需要阴影，则无照明的

MeshBasicMaterial

实际上是更好的选择

更新小提琴：