three.js从入门到精通系列教程039 - 利用THREE.CubeCamera立方相机实现全景照相机-汽车内部全景

smartsmile2012

于 2024-01-22 14:22:43 发布

阅读量558

点赞数 9

CC 4.0 BY-SA版权

分类专栏： three.js从入门到精通系列教程文章标签： javascript 数码相机开发语言 ecmascript three.js 数字孪生

本文链接：https://blog.youkuaiyun.com/smartsmile2012/article/details/135747222

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>three.js从入门到精通系列教程039 - 利用THREE.CubeCamera立方相机实现全景照相机-汽车内部全景</title>
    <script src="ThreeJS/three.js"></script>
    <script src="ThreeJS/jquery.js"></script>
</head>

<body>
    <div id="myContainer"></div>
    <script>
        var myCamera, myScene, myRenderer, myCubeCamera;
        var lon = 0, lat = 0, phi = 0, theta = 0;
        var myTextureLoader = new THREE.TextureLoader();
        myTextureLoader.load('images/img051.jpg', function (myTexture) {
            init(myTexture);
            animate();
        });
        function init(myTexture) {
            myRenderer = new THREE.WebGLRenderer({ antialias: true, alpha: true });
            myRenderer.setSize(window.innerWidth, window.innerHeight);
            $("#myContainer").append(myRenderer.domElement);
            myCamera = new THREE.P