I am trying to assign a reflection material to the ground so I can see the reflection of the cube. I am trying the below code in type script but cannot get “this.scene” to work. How can I reference this.Scene when creating the reflection probe? the error that I get is, “Property ‘scene’ does not exist on type ‘MyScript’. Did you mean ‘_scene’?”. But if i change it to _scene it doesn’t seem to work either. Can you please help? thanks. Code is below…
import { Node } from "@babylonjs/core";
/**
* This represents a script that is attached to a node in the editor.
* Available nodes are:
* - Meshes
* - Lights
* - Cameas
* - Transform nodes
*
* You can extend the desired class according to the node type.
* Example:
* export default class MyMesh extends Mesh {
* public onUpdate(): void {
* this.rotation.y += 0.04;
* }
* }
* The function "onInitialize" is called immediately after the constructor is called.
* The functions "onStart" and "onUpdate" are called automatically.
*/
export default class MyScript extends Node {
/**
* Override constructor.
* @warn do not fill.
*/
// @ts-ignore ignoring the super call as we don't want to re-init
protected constructor() { }
/**
* Called on the node is being initialized.
* This function is called immediatly after the constructor has been called.
*/
public onInitialize(): void {
// ...
}
/**
* Called on the scene starts.
*/
public onStart(): void {
var probe = new BABYLON.ReflectionProbe("main", 512, this.scene)
probe.renderList.push(this.scene.getMeshByName("cube"));
var materialWhiteMarble = new BABYLON.PBRMaterial("/scene/silver.png", this.scene);
materialWhiteMarble.reflectionTexture = probe.cubeTexture
materialWhiteMarble.roughness = 0.25;
materialWhiteMarble.metallic = 1.0;
materialWhiteMarble.realTimeFiltering = false;
materialWhiteMarble.realTimeFilteringQuality = BABYLON.Constants.TEXTURE_FILTERING_QUALITY_HIGH;
this.scene.getMeshByName("ground").material = materialWhiteMarble
// ...
}
/**
* Called each frame.
*/
public onUpdate(): void {
// ...
}
/**
* Called on a message has been received and sent from a graph.
* @param message defines the name of the message sent from the graph.
* @param data defines the data sent in the message.
* @param sender defines the reference to the graph class that sent the message.
*/
public onMessage(name: string, data: any, sender: any): void {
switch (name) {
case "myMessage":
// Do something...
break;
}
}
}
I eventually figured it out, I was importing Node instead of Scene and was using Mesh in the default export class. I have now changed it to the following and was able to get the reflections. Thanks a lot for your reply.
import { Scene } from "@babylonjs/core";
/**
* This represents a script that is attached to a node in the editor.
* Available nodes are:
* - Meshes
* - Lights
* - Cameas
* - Transform nodes
*
* You can extend the desired class according to the node type.
* Example:
* export default class MyMesh extends Mesh {
* public onUpdate(): void {
* this.rotation.y += 0.04;
* }
* }
* The function "onInitialize" is called immediately after the constructor is called.
* The functions "onStart" and "onUpdate" are called automatically.
*/
export default class MyScript extends Scene {
private _scene: BABYLON.Scene;
/**
* Override constructor.
* @warn do not fill.
*/
// @ts-ignore ignoring the super call as we don't want to re-init
protected constructor() { }
/**
* Called on the node is being initialized.
* This function is called immediatly after the constructor has been called.
*/
public onInitialize(): void {
// ...
}
/**
* Called on the scene starts.
*/
public onStart(): void {
// var skybox = BABYLON.MeshBuilder.CreateBox("skyBox", {size:1000.0}, this._scene);
// var skyboxMaterial = new BABYLON.StandardMaterial("skyBox", this._scene);
// skyboxMaterial.backFaceCulling = false;
// skyboxMaterial.reflectionTexture = new BABYLON.CubeTexture("src\scenes\scene\sky.dds", this._scene);
// skyboxMaterial.reflectionTexture.coordinatesMode = BABYLON.Texture.SKYBOX_MODE;
// skyboxMaterial.diffuseColor = new BABYLON.Color3(0, 0, 0);
// skyboxMaterial.specularColor = new BABYLON.Color3(0, 0, 0);
// skybox.material = skyboxMaterial;
var hdrTexture = BABYLON.CubeTexture.CreateFromPrefilteredData("src\scenes\scene\sky.dds", this._scene);
var skybox = this._scene.createDefaultSkybox(hdrTexture, true, 10000);
var probe = new BABYLON.ReflectionProbe("main", 512, this._scene)
probe.renderList.push(this._scene.getMeshByName("cube"));
probe.renderList.push(skybox);
var materialWhiteMarble = new BABYLON.PBRMaterial("metal", this._scene);
materialWhiteMarble.reflectionTexture = probe.cubeTexture
materialWhiteMarble.roughness = 0.25;
materialWhiteMarble.metallic = 1.0;
materialWhiteMarble.realTimeFiltering = false;
materialWhiteMarble.realTimeFilteringQuality = BABYLON.Constants.TEXTURE_FILTERING_QUALITY_HIGH;
this._scene.getMeshByName("ground").material = materialWhiteMarble
// ...
}
/**
* Called each frame.
*/
public onUpdate(): void {
// ...
}
/**
* Called on a message has been received and sent from a graph.
* @param message defines the name of the message sent from the graph.
* @param data defines the data sent in the message.
* @param sender defines the reference to the graph class that sent the message.
*/
public onMessage(name: string, data: any, sender: any): void {
switch (name) {
case "myMessage":
// Do something...
break;
}
}
}
Hey @Reens you are right! You just have to extend Scene as the script is attached to the scene
And instead of passing “this._scene” you can simply pass “this” like:
var hdrTexture = BABYLON.CubeTexture.CreateFromPrefilteredData("src\scenes\scene\sky.dds", this);
