Shadow only material doesn't seem to work for me since updating

[agmcleod]

I have my own local copy of the shadow material, as I can't seem to pull it from the built version of babylon. I pull in BabylonJS via NPM and put it together using webpack. I import the local copy of the shadow only material, and it hoists itself onto BABYLON. I did a diff against the one here: https://github.com/BabylonJS/Babylon.js/blob/master/dist/materialsLibrary/babylon.shadowOnlyMaterial.js. There are no changes since originally pulling it.

The reason I ask is because since updating from 3.0.7 to the 3.1.0-beta3, in order to fix another bug in firefox 56 on windows, I've noticed that the particles and shadows are not rendering over top of the shadow only material for me anymore in Chrome & Safari. Weirdly the particles work in firefox 38, but the shadows still do not render.

I have babylon in my package.json. The webpack config is pretty standard on using the babel-loader, no special considerations for babylonjs.'

The code I use to create the ground, using the shadow only material:
 

    const ground = BABYLON.Mesh.CreateGround('ground1', 10, 16, 2, scene)
    ground.position.x = 0
    ground.position.y = 0
    ground.position.z = 9
    ground.physicsImpostor = new BABYLON.PhysicsImpostor(ground, BABYLON.PhysicsImpostor.BoxImpostor, { mass: 0, restitution: 0.6 }, scene)
    ground.receiveShadows = true

    let groundMat
    if (this.showTableMaterials) {
      groundMat = new BABYLON.StandardMaterial('groundMat', scene)
      groundMat.diffuseColor = new BABYLON.Color3(0.3294117647, 0.631372549, 0.3647058824)
    } else {
      groundMat = new BABYLON.ShadowOnlyMaterial('shadowOnly', scene)
    }
    ground.material = groundMat

The shadow & light setup:

    // This creates a light, aiming down toward the table from the left
    this.light = new BABYLON.DirectionalLight('light1', new BABYLON.Vector3(0, -10, 1), scene)
    this.light.specular = BABYLON.Color3.White()
    // Adjust light source to make more distinctive shadows
    this.light.direction = new BABYLON.Vector3(0, -3, 2)

    this.shadowGenerator = new BABYLON.ShadowGenerator(1024, this.light)
    this.shadowGenerator.useBlurExponentialShadowMap = true
    this.shadowGenerator.useKernelBlur = true
    this.shadowGenerator.blurKernel = MAX_SHADOW_KERNEL_BLUR
    this.shadowGenerator.setDarkness(0.4)

 

Then the mesh & material for the dice:

   const die = BABYLON.Mesh.CreateBox(`dice${dieNumber}`, DICE_SIZE, scene)
    this.setDiePosition(die, dieNumber)

    die.material = this.diceMultiMat

    die.subMeshes.push(new BABYLON.SubMesh(0, 0, 4, 0, 6, die))
    die.subMeshes.push(new BABYLON.SubMesh(5, 0, 4, 6, 6, die))
    die.subMeshes.push(new BABYLON.SubMesh(2, 0, 4, 12, 6, die))
    die.subMeshes.push(new BABYLON.SubMesh(3, 0, 4, 18, 6, die))
    die.subMeshes.push(new BABYLON.SubMesh(4, 0, 4, 24, 6, die))
    die.subMeshes.push(new BABYLON.SubMesh(1, 0, 4, 30, 6, die))

    this.shadowGenerator.getShadowMap().renderList.push(die)

 

So if i set the ground to use teh shadow only material in this test sandbox i have, set the css body background to blue. This is how it looks:

Youll see no shadows under the dice, and the fire only appears over the cubes.

 

 

The same setup in firefox:

 

 

[GameMonetize]

Unfortunately without a repro in the Playground I can barely help you

[GameMonetize]

(I noticed that you did not set  position for your light which is mandatory for shadows as it defines the viewpoint for the shadow map)

[agmcleod]

Ah good call, didn't realize that was a requirement with directional light. Done.

I'll see if I can get a playground together to reproduce.

[agmcleod]

Not quite there, but interestingly enough, the particles do get cut off:

http://playground.babylonjs.com/#A8DRKJ#2

When i change the clear color on my local example to use (0, 0, 0, 0.1), a slightly opaque background, i can see the particles again. Shadows still no go.

[GameMonetize]

Still unable to repro. I see the particles.

[agmcleod]

Yeah I'm not sure what's going on. Would it be helpful to share my code? It wouldn't be a runnable example, as it's using other pieces of state.

[GameMonetize]

But do you repro using the PG that you linked?