多維數據集相機不工作

我是新來的JavaScript和three.js，並試圖爲我已加載的這個凳子的框架做一個「鉻材料」。從我讀過的東西中我需要一個立方體相機來創造一種反射的幻覺。經過幾天的在線搜索，我無法想象爲什麼我無法實現它的工作。它只是渲染框架黑色（和座位是黑色的，但這是一個單獨的問題）。有人能幫忙嗎？多維數據集相機不工作

//webGL 

var scene = new THREE.Scene(); 
var camera = new THREE.PerspectiveCamera(75, window.innerWidth/window.innerHeight, 0.1, 1000); 

camera.position.set(0, 16, 25); 
camera.rotation.x += -0.32; 

var renderer = new THREE.WebGLRenderer(); 
renderer.setSize(window.innerWidth, window.innerHeight); 
document.body.appendChild(renderer.domElement); 

cubeCamera = new THREE.CubeCamera(1, 1000, 256); // parameters: near, far, resolution 
cubeCamera.renderTarget.texture.minFilter = THREE.LinearMipMapLinearFilter; // mipmap filter 
scene.add(cubeCamera); 

///LOADERS 
var loadTexture = new THREE.TextureLoader(); 
var loaderJs = new THREE.JSONLoader(); 


///TEXTURES 
var skyTexture = loadTexture.load("textures/background.jpg"); 
var seatTexture = loadTexture.load("textures/Maharam_Mister_Notice_Diffuse.jpg"); 

///MATERIALS 
var skyMaterial = new THREE.MeshBasicMaterial({ 
    side: THREE.DoubleSide, 
    map: skyTexture 
}); 
var frameMaterial = new THREE.MeshLambertMaterial({ 
    //envMap: cubeCamera.renderTarget, 
    color: 0xffffff 
}); 
var seatMaterial = new THREE.MeshLambertMaterial({ 
     map: seatTexture 
}); 


///GEOMETRY and MESHES 
var frameGeo; 

var skyGeo = new THREE.SphereGeometry(30, 30, 30); 
var skySphere = new THREE.Mesh(skyGeo, skyMaterial); 
scene.add(skySphere); 

loaderJs.load("models/stoolFrame.js", function(){ 
    frameGeo = new THREE.Mesh(frameGeo, frameMaterial); 
    frameGeo.scale.set(.5, .5, .5); 
    barStool.add(frameGeo); 
}); 

loaderJs.load("models/stoolSeat.js", function (seatGeo){ 
    seatGeo = new THREE.Mesh(seatGeo, seatMaterial); 
    seatGeo.scale.set(.5, .5, .5); 
    barStool.add(seatGeo); 
}); 


var barStool = new THREE.Object3D(); 
scene.add(barStool); 

    var render = function() { 

     requestAnimationFrame(render); 
     barStool.rotation.y += 0.01; 

     frameGeo.visible = false; 
     cubeCamera.position.copy(frameGeo.position); 
     cubeCamera.updateCubeMap(renderer, scene); 
     frameGeo.visible = true; 


     renderer.render(scene, camera); 
    }; 



render();

來源

2016-03-27 ab3d_work

我試圖幫助你，因爲我在你的場景中看到很多錯誤。

如果你添加一個對象到object3d中，你不必將它添加到場景中，當你添加barStool的時候，你也添加了所有的孩子。

js加載後調用render函數是沒有必要的，當你把對象放到場景中時它會自動呈現。

，如果你想添加與cubecamera你必須使它的反映，在渲染循環中，您必須插入下面的行隱藏更新鑲邊對象世界反射貼圖：

requestAnimationFrame(render); 
barStool.rotation.y += 0.01; 

frameGeo.visible=false; 
cubeCamera.position.copy(frameGeo.position); 
cubeCamera.updateCubeMap(renderer, scene); 
frameGeo.visible = true; 

renderer.render(scene, camera);

我建議你從一個簡單的場景開始，檢查它是否正確渲染，然後添加新的功能...一步一步...

來源

2016-03-27 23:11:37

Thankyou爲您的迴應！您對cubeCamera的評論很有意義。但是，我收到一個錯誤「frameGeo未定義。」我遇到過類似的問題 - 我相信它是因爲「frameGeo」是一個嵌套在加載函數中的變量。如果我無法自己解決，我可能需要發佈有關該問題的另一個問題。 –

你必須在腳本的頂部聲明'var frameGeo;'。 –

再次感謝您與我一起努力。我已經實現了你的建議（正確的我認爲），但得到以下錯誤：WebGL：INVALID_OPERATION：bindTexture：紋理不能用於多個目標 localhost /：1 [.CommandBufferContext] RENDER WARNING：Render count或primcount爲0 。 –

多維數據集相機不工作

回答

相關問題