Search the Community

I have two images loaded. Once is scodix.jpg which is a regular jpg image and on top of that i have a scodix.png that is a transparent image with only a small part that has artwork. What im trying to accomplish is to have a light shining on the transparent image but only showing the actual image to have the light and shadow affect. below is the code i have but when the light shines its shining on the entire thing including the non transparent part or jpg part. Im trying to accomplish a scene where a user can rotate the image and the lighting will continue to follow the transparent image and possibly show a shadow. Can anyone help? var createScene = function () { var scene = new BABYLON.Scene(engine); //Create a light var light = new BABYLON.HemisphericLight("hemi", new BABYLON.Vector3(0, 1, 0), scene); //Create an Arc Rotate Camera - aimed negative z this time var camera = new BABYLON.ArcRotateCamera("Camera", Math.PI / 2, 1.0, 210, BABYLON.Vector3.Zero(), scene, true); camera.attachControl(canvas, true); //Creation of a repeated textured material var materialPlane = new BABYLON.StandardMaterial("texturePlane", scene); materialPlane.emissiveTexture = new BABYLON.Texture("images/scodix.jpg", scene); //materialPlane.emissiveTexture = new BABYLON.Texture('images/scodix1.png', scene); //materialPlane.useAlphaFromDiffuseTexture materialPlane.specularColor = new BABYLON.Color3(0, 0, 0); materialPlane.backFaceCulling = true;//Allways show the front and the back of an element materialPlane.emissiveTexture.level = 1; //It is kind of z-index var spotPlain = new BABYLON.StandardMaterial("texture", scene, true); spotPlain.diffuseTexture = new BABYLON.Texture("images/scodix.png", scene); spotPlain.anisotropicFilteringLevel = 0; spotPlain.diffuseTexture.hasAlpha = true; spotPlain.useAlphaFromDiffuseTexture; spotPlain.hasAlpha = true; spotPlain.specularColor = new BABYLON.Color3(0, 0, 0); spotPlain.backFaceCulling = true;//Allways show the front and the back of an element //Creation of a plane var plane = BABYLON.MeshBuilder.CreatePlane("plane", {width: 261, height: 153}, scene, true, BABYLON.MeshBuilder.FRONTSIDE); plane.material = materialPlane; var plane2 = BABYLON.MeshBuilder.CreatePlane("plane2", {width: 261, height: 153}, scene, true, BABYLON.MeshBuilder.FRONTSIDE); plane2.material = spotPlain; scene.debugLayer.show(); return scene; };