如何模拟"投影相机映射"视频到多个BabylonJS网格?

时间:2016-04-25 23:22:03

标签: javascript html5-video mesh map-projections babylonjs

问题:

如何模拟"投影相机映射"视频播放到多个BabylonJS Mesh?

故障:

enter image description here

  • 好像,相机是投影机,网格是空间中的物体?

我正在寻找的结果是,视频可以更多地作为网格的渐变颜色,或者另一方面是视频本身的失真。

希望这是有道理的,我已经附上了影院4d中关于我所采用的概念的简化图像。

enter image description here

代码:

 var ToPi = 2*Math.PI;
    var points = [];
    var incrementer = 0.025;
    var x, y, z = 0;

    // -------------------------------------------------------------
    // Here begins a function that we will 'call' just after it's built
    var createScene = function () {
        // Now create a basic Babylon Scene object
        var scene = new BABYLON.Scene(engine);
        // Change the scene background color to green.
        scene.clearColor = new BABYLON.Color3(255/255,27/255,78/255);
        // This creates and positions a free camera
        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, false);
        // This creates a light, aiming 0,1,0 - to the sky.
        var light = new BABYLON.HemisphericLight("light1", new BABYLON.Vector3(0, 1, 0), scene);
        // Dim the light a small amount
        light.intensity = .5;
        // Let's try our built-in 'sphere' shape. Params: name, subdivisions, size, scene
        var sphere = BABYLON.Mesh.CreateSphere("sphere1", 16, 2, scene);
        // Move the sphere upward 1/2 its height
        sphere.position.y = 1;



        for (var u = 0; u <= ToPi; u += incrementer){
            for( var v = 0; v <= ToPi; v += incrementer){

                points.push(new BABYLON.Vector3(
                        Math.sin(u)*10*(Math.cos(v)),
                        Math.sin(v)+Math.cos(u)*10*(Math.cos(v)),
                        Math.cos(v)+10*(Math.sin(v))*Math.sin(u))
                )
            }
        }

        var shape = BABYLON.Mesh.CreateLines('Shape', points, scene, true);
        shape.color = new BABYLON.Color3(0,0.5,0.5);

        var scaleIncrement = 0.01;

        scene.registerBeforeRender(function () {
            if (shape.scaling.x > 1.5 || shape.scaling.x < 0.5) {
                scaleIncrement *= -1;
            }

            shape.scaling.x += scaleIncrement;
            shape.scaling.y += scaleIncrement;
            shape.scaling.z += scaleIncrement;

        });
        return scene;
    }; // End of createScene function

1 个答案:

答案 0 :(得分:1)

我猜你可以在标准材料上使用投影映射:

http://www.babylonjs-playground.com/#203BJM#2