babylonjs：多元素不工作的多陰影

Question

我試圖使用Babylonjs得到正確的陰影。沒有任何的喜悅：對

這裏是陰影的資源，我發現

• Babylonjs wiki: Shadows
• framework for building 3D games with HTML5 and WebGL

，但「對元素元素」的陰影我不能發現任何東西。 :(

這是我在它的嘗試： 我的消息來源鬆散的基礎上Babylonjs維基：17-陰影

我有2個燈和3個對象 我得到球后產生陰影，但後來我也得到一個假象在球的前面

►直播代碼：。 jsfiddle.net/codemeasandwich/z64Ba

我感謝你的幫助，因爲我一直是這樣掙扎了一會兒

function createSceneTuto(engine) { 
    var scene = new BABYLON.Scene(engine); 

    //freeCamera is a FPS like camera where you control the camera with the cursors keys and the mouse 
    //touchCamera is a camera controlled with touch events (it requireshand.jsto work) 
    //arcRotateCamera is a camera that rotates around a given pivot. It can be controlled with the mouse or touch events (and it also requires hand.js to work) 

    // ArcRotateCamera >> Camera turning around a 3D point (here Vector zero) 
    // Parameters : name, alpha, beta, radius, target, scene 
    var camera = new BABYLON.ArcRotateCamera("Camera", 0, 0, 90, BABYLON.Vector3.Zero(), scene); 
    camera.setPosition(new BABYLON.Vector3(30, 30, 30)); 

    // pointLight (like the sun for instance) which emits lights in every direction from a specific position 
    // directionalLight which emits lights from the infinite towards a specific direction 
    var light = new BABYLON.DirectionalLight("Dir0", new BABYLON.Vector3(-1,0, 0), scene); 


     var light0 = new BABYLON.PointLight("Omni0", new BABYLON.Vector3(1, 10, 100), scene); 
       light0.diffuse = new BABYLON.Color3(0,1, 0); 
       light0.specular = new BABYLON.Color3(1, 1, 1); 

    var box = BABYLON.Mesh.CreateBox("Box", 3, scene); 
    var torus = BABYLON.Mesh.CreateTorus("torus", 5, 1, 20, scene); 
// var plan = BABYLON.Mesh.CreatePlane("Plane", 50.0, scene); 
    //  plan.position.z = -40 
    var sphere = BABYLON.Mesh.CreateSphere("Sphere", 15, 20, scene); 

    // Shadows 
    var shadowGenerator = new BABYLON.ShadowGenerator(1024, light); 
    var shadowGenerator0 = new BABYLON.ShadowGenerator(1024, light0); 

     shadowGenerator.getShadowMap().renderList.push(box); 
     shadowGenerator.getShadowMap().renderList.push(torus); 
     shadowGenerator.getShadowMap().renderList.push(sphere); 

     shadowGenerator0.getShadowMap().renderList.push(box); 
     shadowGenerator0.getShadowMap().renderList.push(torus); 
     shadowGenerator0.getShadowMap().renderList.push(sphere); 

     box.receiveShadows = true; 
     torus.receiveShadows = true; 
     sphere.receiveShadows = true; 

    var alphaTorus = 0, alphaBox =0; 
     scene.registerBeforeRender(function() { 
     torus.rotation.x += 0.02; 
     torus.position = new BABYLON.Vector3(Math.cos(alphaTorus) * 15, 0, Math.sin(alphaTorus) * 15); 
     alphaTorus += 0.003; 

     box.position = new BABYLON.Vector3(Math.cos(alphaBox) * 15, 0, Math.sin(alphaBox) * 15); 
     alphaBox += 0.01; 
    }); 

    return scene; 
} 

►以上燈的方向燈

var light = new BABYLON.DirectionalLight("Dir0", new BABYLON.Vector3(-1,0, 0), scene); 
light.position = new BABYLON.Vector3(0, 0, 20); 
light.intensity = 0.5; 

var light0 = new BABYLON.DirectionalLight("Omni0", new BABYLON.Vector3(0,0,-1), scene); 
light0.position = new BABYLON.Vector3(25, 0, 0);  
light.intensity = 0.5; 

Answer 1

只有方向燈可以投射陰影，他們也需要一個位置，從那裏陰影來

我更新維基定義若要加此重要信息:)

只有方向ligths可以投射陰影： var light = new BABYLON.DirectionalLight（「dir01」，new BABYLON.Vector3（-1，-2，-1），scene）;

您還必須爲燈光定義一個位置（因爲Babylon.js必須定義一個視點來創建陰影貼圖）： light.position = new BABYLON.Vector3（20，40，20）;

請注意，您必須移動位置來定義可以看到陰影的區域。