BabylonJS - 反射探测器

BabylonJS反射探测器 - 从简单和简单的步骤学习BabylonJS，从基本到高级概念，包括简介，环境设置，概述，基本元素，材料，动画，相机，灯光，参数形状，网格，矢量位置和旋转，贴花，曲线3 ，动态纹理，视差映射，镜头光晕，创建ScreenShot，反射探测器，标准渲染管道，ShaderMaterial，骨骼和骨架，物理引擎，播放声音和音乐。

反射探针用于创建类似场景的镜像.这有助于看到网格中的网格反射.要创建类似场景的镜像，您需要调用类和所需的网格，以便查看反射.稍后，您需要将网格添加到渲染列表，如下所示.考虑一下你有水面的天空盒，你需要显示云或树的反射或鸟儿在水中飞行，你可以使用反射探测器，并且创建的网格物体可以添加到渲染列表中，如下所示.

语法

 var probe = new BABYLON.ReflectionProbe("main"，512，scene);  probe.renderList.push(yellowSphere);  probe.renderList.push(greenSphere);  probe.renderList.push(blueSphere);  probe.renderList.push(mirror);

演示

               BabylonJs - Basic Element-Creating Scene                                       var canvas = document.getElementById("renderCanvas");         var engine = new BABYLON.Engine(canvas, true);                  var createScene  = function() {            var scene = new BABYLON.Scene(engine);            var camera = new BABYLON.ArcRotateCamera("camera1", 0, 0, 10, BABYLON.Vector3.Zero(), scene);            camera.setPosition(new BABYLON.Vector3(0, 5, -10));            camera.attachControl(canvas, true);            camera.upperBetaLimit = Math.PI / 2;            camera.lowerRadiusLimit = 4;            var light = new BABYLON.HemisphericLight("light1", new BABYLON.Vector3(0, 1, 0), scene);            light.intensity = 0.7;            var knot = BABYLON.Mesh.CreateTorusKnot("knot", 1, 0.4, 128, 64, 2, 3, scene);            var yellowSphere = BABYLON.Mesh.CreateSphere("yellowSphere", 16, 1.5, scene);            yellowSphere.setPivotMatrix(BABYLON.Matrix.Translation(3, 0, 0));            var blueSphere = BABYLON.Mesh.CreateSphere("blueSphere", 16, 1.5, scene);            blueSphere.setPivotMatrix(BABYLON.Matrix.Translation(-1, 3, 0));            var greenSphere = BABYLON.Mesh.CreateSphere("greenSphere", 16, 1.5, scene);            greenSphere.setPivotMatrix(BABYLON.Matrix.Translation(0, 0, 3));            // Mirror            var mirror = BABYLON.Mesh.CreateBox("Mirror", 1.0, scene);            mirror.scaling = new BABYLON.Vector3(100.0, 0.01, 100.0);            mirror.material = new BABYLON.StandardMaterial("mirror", scene);            mirror.material.diffuseTexture = new BABYLON.Texture("images/square.jpg", scene);                        mirror.material.diffuseTexture.uScale = 10;            mirror.material.diffuseTexture.vScale = 10;            mirror.material.reflectionTexture = new BABYLON.MirrorTexture("mirror", 1024, scene, true);                        mirror.material.reflectionTexture.mirrorPlane = new BABYLON.Plane(0, -1.0, 0, -2.0);            mirror.material.reflectionTexture.renderList = [greenSphere, yellowSphere, blueSphere, knot];            mirror.material.reflectionTexture.level = 0.5;            mirror.position = new BABYLON.Vector3(0, -2, 0);            // Main material            var mainMaterial = new BABYLON.StandardMaterial("main", scene);            knot.material = mainMaterial;            var probe = new BABYLON.ReflectionProbe("main", 512, scene);            probe.renderList.push(yellowSphere);            probe.renderList.push(greenSphere);            probe.renderList.push(blueSphere);            probe.renderList.push(mirror);                        mainMaterial.diffuseColor = new BABYLON.Color3(1, 0.5, 0.5);            mainMaterial.reflectionTexture = probe.cubeTexture;            mainMaterial.reflectionFresnelParameters
 = new BABYLON.FresnelParameters
();            mainMaterial.reflectionFresnelParameters
.bias = 0.02;            // Fog            scene.fogMode = BABYLON.Scene.FOGMODE_LINEAR;            scene.fogColor = scene.clearColor;            scene.fogStart = 20.0;            scene.fogEnd = 50.0;            // Animations            scene.registerBeforeRender(function () {               yellowSphere.rotation.y += 0.01;               greenSphere.rotation.y += 0.01;               blueSphere.rotation.y += 0.01;            });            return scene;         };         var scene = createScene();         engine.runRenderLoop(function() {            scene.render();         });

输出

反射探测器

在本演示中，我们使用了图像 square.jpg .图像存储在本地的图像/文件夹中，也粘贴在下面以供参考.您可以下载您选择的任何图像并在演示链接中使用.

images/square.jpg

square