ThreeJS不会施放任何阴影

时间:2015-11-11 20:06:52

标签: javascript three.js

我在使用ThreeJS时遇到了一些麻烦。我有一些立方体,应该在下面的平面上投下阴影,但它们没有 - 我已经谷歌搜索了几个小时的解决方案并尝试了我能找到的一切,但我无法得到它工作

我在所有对象上使用MeshPhongMaterial,并且已将.castShadow.receiveShadow添加到所有适当的对象中。我用SpotLight指向地面 - 它点亮了立方体和地面,但立方体没有投射阴影。这是一个立方体和地面的例子:

  var cubeGeometry = new THREE.CubeGeometry(20, 20, 20);
  cube1 = new THREE.Mesh(cubeGeometry, material);
  cube1.shading = THREE.FlatShading;
  cube1.castShadow = true;
  cube1.receiveShadow = true;
  var groundGeometry = new THREE.PlaneGeometry(200, 200);
  var groundMaterial = new THREE.MeshPhongMaterial({color: 0xf0dc3f});
  ground = new THREE.Mesh(groundGeometry, groundMaterial);
  ground.shading = THREE.FlatShading;
  ground.position.y = -30;
  ground.rotation.x = Math.PI / 2;
  ground.rotation.z = Math.PI / 4;
  ground.receiveShadow = true;

我的JsFiddle:https://jsfiddle.net/fggjp2n9/

1 个答案:

答案 0 :(得分:2)

你错过了:

app.directive('offcanvasToggler', function(){ return { restrict : 'E', transclude: true, scope : { target: '@', backdrop : '=useBackdrop' }, templateUrl : 'directives/toggle-offcanvas.html', link: function($scope, $element){ var anchor = $element.find('a'); anchor.on('click', function(event){ event.preventDefault(); materialadmin.AppOffcanvas._handleOffcanvasOpen(anchor); }); } }; });

https://jsfiddle.net/fggjp2n9/1/