网格-突出显示网格

概述

1 .有点类似于加一层阴影，但是是发光的
2 .有透明属性的网格是不能加的

var canvas=document.getElementById('renderCanvas')
        var engine=new BABYLON.Engine(canvas,true,{sencil:true})

        var createScene=function(){
            var scene=new BABYLON.Scene(engine)

            var light=new BABYLON.PointLight('point',new BABYLON.Vector3(5,10,5),scene)
            var camera=new BABYLON.FreeCamera('camera',new BABYLON.Vector3(0,0,-30),scene)
            camera.attachControl(canvas,true)

            var sphere = BABYLON.Mesh.CreateSphere("sphere1", 16, 5, scene);
            sphere.position.x += 1.1;
            sphere.position.y = 1;

            var ground=BABYLON.Mesh.CreateGround('ground',6,6,2,scene)

            var h1=new BABYLON.HighlightLayer('h11',scene)
            h1.addMesh(sphere,BABYLON.Color3.Green())
             
            return scene
        }

        var scene=createScene()

        engine.runRenderLoop(()=>{
            scene.render()
        })

        window.addEventListener("resize",()=>{
            engine.resize()
        })

3 可以给物体添加的纹理实现这个效果

var scene = new BABYLON.Scene(engine);

    // This creates and positions a free camera (non-mesh)
    var camera = new BABYLON.FreeCamera("camera1", new BABYLON.Vector3(0, 5, -10), scene);
    scene.clearColor = BABYLON.Color3.Black();

    // This targets the camera to scene origin
    camera.setTarget(BABYLON.Vector3.Zero());

    // This attaches the camera to the canvas
    camera.attachControl(canvas, true);

    // Our built-in 'sphere' shape. Params: name, subdivs, size, scene
    var sphere = BABYLON.Mesh.CreateSphere("sphere1", 16, 3, scene);
    
    //Creation of a material with translated texture
    var materialSphere = new BABYLON.StandardMaterial("texture4", scene);
    materialSphere.emissiveTexture = new BABYLON.Texture("textures/misc.jpg", scene);
    materialSphere.emissiveTexture.uOffset = -0.1;
    sphere.material = materialSphere;   
    
    // Add the highlight layer.
    var hl1 = new BABYLON.HighlightLayer("hl1", scene);
    hl1.addMesh(sphere, BABYLON.Color3.Red(), true);
    // hl1.blurVerticalSize = 1.5;
    // hl1.blurHorizontalSize = 1.5;

4 这个描边好像还真的是描边，并不是按照addmesh里面的第一个参数，而是他会找第一个参数的网格和其他网格重叠在一起的边，并不是各来各的。

var scene = new BABYLON.Scene(engine);

    // This creates and positions a free camera (non-mesh)
    var camera = new BABYLON.FreeCamera("camera1", new BABYLON.Vector3(0, 5, -10), scene);

    // This targets the camera to scene origin
    camera.setTarget(BABYLON.Vector3.Zero());

    // This attaches the camera to the canvas
    camera.attachControl(canvas, true);

    // This creates a light, aiming 0,1,0 - to the sky (non-mesh)
    var light = new BABYLON.HemisphericLight("light1", new BABYLON.Vector3(0, 1, 0), scene);

    // Default intensity is 1. Let's dim the light a small amount
    light.intensity = 0.7;

    // Our built-in 'sphere' shape. Params: name, subdivs, size, scene
    var sphere = BABYLON.Mesh.CreateSphere("sphere1", 16, 2, scene);

    // Move the sphere upward 1/2 its height
    sphere.position.y = 1;

    // Our built-in 'ground' shape. Params: name, width, depth, subdivs, scene
    var ground = BABYLON.Mesh.CreateGround("ground1", 6, 6, 2, scene);
    
    // Add the highlight layer.
    var hl = new BABYLON.HighlightLayer("hl1", scene);
    hl.addMesh(sphere, BABYLON.Color3.Green());

    var hl2 = new BABYLON.HighlightLayer("hl2", scene);
    hl2.addMesh(ground, BABYLON.Color3.Red());

    return scene;
//给两个物体分别设置了两个描边，但是他们的实际效果还是会走叠加的效果

模糊大小

1 .对高光的模糊大小进行动画处理，实现闪烁的特点

var alpha = 0;
    scene.registerBeforeRender(() => {
        alpha += 0.1;
        
        hl2.blurHorizontalSize = 0.3 + Math.cos(alpha) * 0.6 + 0.6;     
        hl2.blurVerticalSize = 0.3 + Math.sin(alpha / 3) * 0.6 + 0.6;
    });

内发光和外发光的开启和关闭

var hl1 = new BABYLON.HighlightLayer("hl1", scene);
    hl1.addMesh(sphere, BABYLON.Color3.White());
    // hl1.outerGlow = false;
    
    var hl2 = new BABYLON.HighlightLayer("hl2", scene);
    hl2.addMesh(ground, BABYLON.Color3.Red());
    // hl2.innerGlow = false;

排除不加自发光的网格

1 .hl.addExcludedMesh(skybox1);

多相机

1 默认情况下，高光层将应用于所有活动摄像机，但是会在不需要的摄像机上创建额外的处理
2 可以选择高光和那些相机有关

var hl1 = new BABYLON.HighlightLayer("hl1", scene, {camera: camera});
hl1.addMesh(sphere, BABYLON.Color3.Green());