I can't see any shadows in my scene, but all others work

🧑‍💻 Technical Support
1

I have multiple scene and all are showing shadows, but for the life of me I can’t find out why this there are no shadows being displayed in this project?? Any suggestions…

<!-- Copyright (c) 2021 8th Wall, Inc. -->
<!-- body.html is optional; elements will be added to your html body after app.js is loaded. -->

<div id="recenterButtonContainer" class="hidden">
  <img src="../assets/images/recenter.png">
</div>

<!-- Add the tap-place component to the scene so it has an effect -->
<a-scene
  swap-scenes="url: ./go_kart"
  recenter-button
  xrextras-gesture-detector 
  landing-page 
   xrextras-loading="
    loadBackgroundColor: #0e253d;
    cameraBackgroundColor: #353535;
    loadImage: #myCustomLoadImage;
    loadAnimation: pulse;
    viewBox: 0px 0px 300px 200px"
  xrextras-runtime-error 
  renderer="colorManagement: true; webgl2: true"
  xrweb="allowedDevices: any" 
  gltf-model="dracoDecoderPath: https://cdn.8thwall.com/web/aframe/draco-decoder/"
>

  <button id="myButton">
    <img src="../assets/images/backArrow.png">
  </button>

  <a-assets>
    <a-asset-item id="robot_model" src="../assets/models/goKart.glb"></a-asset-item>
    <a-asset-item id="coin-hatfield" src="../assets/models/hadfield_icon.glb"></a-asset-item>
    <a-asset-item id="coin-bearTrap" src="../assets/models/SeaKing_icon.glb"></a-asset-item>
    <a-asset-item id="coin-camera" src="../assets/models/camera_icon.glb"></a-asset-item>
    <a-asset-item id="coin-jesery" src="../assets/models/jesery_icon.glb"></a-asset-item>
    <a-asset-item id="coin-lightGun" src="../assets/models/lightGun_icon.glb"></a-asset-item>
    <a-asset-item id="coin-linkTrainer" src="../assets/models/link-trainer_icon.glb"></a-asset-item>
    <a-asset-item id="coin-sperwer" src="../assets/models/sperwer_icon.glb"></a-asset-item>
    <a-asset-item id="coin-spoon" src="../assets/models/spoon_icon.glb"></a-asset-item>
    <a-asset-item id="map" src="../assets/models/map_of_canada2.glb"></a-asset-item>
    <a-asset-item id="coin-model" src="../assets/models/roundel_game.glb"></a-asset-item>
    <img id="myCustomLoadImage" src="../assets/images/100_years_logo_bilingual.svg" >
  </a-assets>

  <a-camera 
    id="camera" 
    position="0 8 8">
  </a-camera>

    <a-entity
    light="
      type: directional;
      intensity: 0.8;
      castShadow: true;
      shadowMapHeight:2048;
      shadowMapWidth:2048;
      shadowCameraTop: 10;
      shadowBias: -0.0001;
      target: #group;"
      
    xrextras-attach="target: group; offset: 1 15 4;"
    shadow>
  </a-entity>
  
  <div id="daScore" >
    <p>SCORE</p>
    <h1>0</h1>
  </div>
  <div id="daTimer">
    <p>TEMPS</p>
    <h1>0</h1>
  </div>
  <div id="overlay" style="z-index: 2">
    <img id="recenterBtn" src="../assets/images/recenter.png">
    <h3>GLISSER POUR DÉPLACER</h3>
  </div>
  <div id="endScreen" style="z-index: 3; display:block; width:100vw;height:100vh;">
    <h3>0</h3>
    <img id="endSreenCard" src="../assets/popups/introPops_gameOver.jpg" style="width:100vW;height:100vh;display:block">
  </div>

  <a-light type="ambient" intensity="0.25"></a-light>

  <a-entity id="group" scale="1 1 1" rotation="0 0 0" shadow="true">
    
  <a-entity 
    id="mapCanada" 
    gltf-model="#map" 
    position="0 -2 -10"
    scale="2 2 2"
    shadow="receive: true;"></a-entity>

  <a-entity 
  id="character" 
  character-move 
  character-recenter 
  gltf-model="#robot_model" 
  scale="0.15 0.15 0.15"
  rotation="0 0 0" 
  shadow="cast: true; receive: true"></a-entity>

  <a-entity 
    id="token0" 
    position="0 0 -3" 
    rotation="0 0 0" 
    proximity-trigger="radius: 1.5"
    shadow="cast: true" >
      <a-entity id="coin" 
      gltf-model="#coin-model" 
      scale=".25 .25 .25" 
      animation-mixer
      shadow="cast: true; receive: true">
      </a-entity>
    </a-entity>

     <a-entity 
    id="token1" 
    position="3 0.1 3" 
    rotation="0 0 0" 
    proximity-trigger="radius: 1.5"
    shadow="cast: true; receive: true">
      <a-entity id="coin" 
      gltf-model="#coin-model" 
      reflections="type: static" 
      scale=".25 .25 .25" 
      rotation="0 0 0"
      postion="0 1.5 0" 
      animation-mixer
      shadow="cast: true; receive: true">
      </a-entity>
    </a-entity>

    <a-entity 
    id="token2" 
    position="1 0.1 -2" 
    rotation="0 0 0" 
    proximity-trigger="radius: 1.5"
    shadow="cast: true; receive: true" >
      <a-entity id="coin" 
      gltf-model="#coin-model" 
      reflections="type: static" 
      scale=".25 .25 .25" 
      rotation="0 0 0"
      postion="0 1.5 0" 
      animation-mixer
      shadow="cast: true; receive: true">
      </a-entity>
    </a-entity>

    <a-entity 
    id="token3" 
    position="2 0.1 2" 
    rotation="0 0 0" 
    proximity-trigger="radius: 1.5"
    shadow="cast: true; receive: true" >
      <a-entity id="coin" 
      gltf-model="#coin-model" 
      reflections="type: static" 
      scale=".25 .25 .25" 
      rotation="0 0 0"
      postion="0 1.5 0" 
      animation-mixer
      shadow="cast: true; receive: true">
      </a-entity>
    </a-entity>

  <a-entity 
    id="token-icon" 
    position="-4 0.1 -2" 
    rotation="0 0 0" 
    xrextras-spin
    proximity-trigger="radius: 1.5"
    shadow="cast: true; receive: true">
      <a-entity id="coin-special" 
      gltf-model="#coin-hatfield" 
      scale=".15 .15 .15" 
      rotation="0 0 0"
      postion="0 70.5 0" 
   
      shadow="cast: true; receive: true">
      </a-entity>
    </a-entity>
    
   </a-entity>

  <a-plane
    id="ground" 
    rotation="-90 0 0" 
    postion="0 1 0"
    width="1000" 
    height="1000" 
    material="shader: shadow" 
    shadow>
  </a-plane>

</a-scene>
2

Have you tried extending the shadowCameraTop: 10; or simplifying the scene to just a cube to better debug and see what could be causing this?

3

You may want to also take a look at shadow maps

But first I would suggest simplifying your project to better debug

4

Thanks Ian,

I’m going to have a look at this again as it looks so much better and it’s so much easier to relate objects in the 3d scene when shadow is present.

I’ll let you know how it goes, thanks for the response.

1 Like