从平面图像转换球体图像

时间:2015-10-23 12:50:36

标签: javascript three.js

我使用三个j来将平面图像转换为球形图像类型。我从three js读取文档。并尝试了以下源代码。

// spherical_conversion.html

<html>    
<head>
    <title>Conversion flat image to spherical image</title>
    <style>
        body {
            margin: 0;
        }

        canvas {
            width: 100%;
            height: 100%
        }
    </style>
</head>

<body>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r71/three.min.js"></script>
    <!--<script src="js/three.min.js"></script>-->
    <script>
        var scene = new THREE.Scene();
        var camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
        var renderer = new THREE.WebGLRenderer();
        var sphere = new THREE.Mesh(
            new THREE.SphereGeometry(100, 32, 32),
            new THREE.MeshBasicMaterial({
                map: THREE.ImageUtils.loadTexture('sample_image.jpg')
            })
        );
        sphere.scale.x = -1;
        scene.add(sphere);
        renderer.setSize(window.innerWidth, window.innerHeight);
        renderer.render(scene, camera);
        document.body.appendChild(renderer.domElement);
    </script>
</body>

</html>

我在这里尝试的是sample_image.jpg是一个平面图像。使用三个js库转换球形图像。

我运行的代码段没有在控制台中出现任何错误。甚至没有获得预期的结果。运行此代码后,我得到了空白页。

我所期待的是将平面图像转换为球形图像。请让我知道这一点。

提前致谢

0 个答案:

没有答案