<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>three.js從入門到精通系列教程004 - three.js透視相機(jī)（PerspectiveCamera）滾動(dòng)瀏覽全景大圖</title>
<script src="js/three.js"></script>
<script src="js/jquery.js"></script>
</head>
<body>
<div id="myContainer"></div>
<script>
//定義相機(jī)、場景、渲染器
var myCamera, myScene, myRenderer;
var lon = 0, lat = 0, phi = 0, theta = 0;
//創(chuàng)建TextureLoader 紋理加載器加載圖片
var myTextureLoader = new THREE.TextureLoader();
myTextureLoader.load('img/img050.jpg', function (myTexture) {
init(myTexture);
animate();
});
function init(myTexture) {
//antialias 是否執(zhí)行抗鋸齒。默認(rèn)為false；alpha 是否可以設(shè)置背景色透明。默認(rèn)為false
myRenderer = new THREE.WebGLRenderer({ antialias: true, alpha: true });
myRenderer.setSize(window.innerWidth, window.innerHeight);
$("#myContainer").append(myRenderer.domElement);
//創(chuàng)建透視相機(jī)PerspectiveCamera
myCamera = new THREE.PerspectiveCamera(90, window.innerWidth / window.innerHeight, 1, 1000);
myScene = new THREE.Scene();
/*
WebGLCubeRenderTarget(size : Number, options : Object)
size - 大小，以像素為單位。默認(rèn)值為 1。
options - (可選)一個(gè)保存著自動(dòng)生成的目標(biāo)紋理的紋理參數(shù)以及表示是否使用深度緩存/模板緩存的布爾值的對(duì)象。以下是合理選項(xiàng)：
wrapS - 默認(rèn)是ClampToEdgeWrapping.
wrapT - 默認(rèn)是ClampToEdgeWrapping.
magFilter - 默認(rèn)是.LinearFilter.
minFilter - 默認(rèn)是LinearFilter.
generateMipmaps - 默認(rèn)是false.
format - 默認(rèn)是RGBAFormat.
type - 默認(rèn)是UnsignedByteType.
anisotropy - 默認(rèn)是 1.
encoding - 默認(rèn)是LinearEncoding.
depthBuffer - 默認(rèn)是true.
stencilBuffer - 默認(rèn)為false。
*/
//使用全景圖設(shè)置場景背景
myScene.background = new THREE.WebGLCubeRenderTarget(1024).fromEquirectangularTexture(myRenderer, myTexture);
}
//更多源碼 點(diǎn)擊下方鏈接下載
</script>
</body>
</html>
源碼下載地址文章來源：http://www.zghlxwxcb.cn/news/detail-817678.html
three.js從入門到精通系列教程004 - three.js透視相機(jī)（PerspectiveCamera）滾動(dòng)瀏覽全景大圖文章來源地址http://www.zghlxwxcb.cn/news/detail-817678.html
到了這里，關(guān)于three.js從入門到精通系列教程004 - three.js透視相機(jī)（PerspectiveCamera）滾動(dòng)瀏覽全景大圖的文章就介紹完了。如果您還想了解更多內(nèi)容，請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！
