2016-03-29 16 views
0

THREE.JSONLoader経由で公開変数としてロードされるオブジェクトを追加することが可能かどうか疑問に思っていましたか?理想的には、ロードされたテクスチャ、マテリアル作成、ジオメトリをすべてスクリプトの上部に公開変数として使用したいと思います(私は強力な3D背景を持っていますが、jsとwebGLは初めてです)。私は何か宣言されている私のpublic varsが関数にパラメータとして追加された後は公開されていないことを発見しました。この場合はJSONLoaderです。しかし、値を宣言することなくvarを命名するだけで "実行"しますが、私は奇妙なTHREE.min.jsエラーを受け取ります。私は理解できません。私は以下の私のコードが含まれている - それは他の問題を持って知っている - 私はそれがどのように悪い知らせすること自由に感じなさい - それは私が:)公開変数としてTHEE.JSONLoaderオブジェクト

//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/abc_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(); 

答えて

0

あなたstoolFrameをロードするとき、あなたはパラメータを追加するのを忘れを学ぶことができますコールバック関数については、documentationの例を確認してください。コールバック関数は、ジオメトリとマテリアルを取ります。 stoolSeatをロードする場合、あなたは(あなたがスツールのための材料を持って提供)上記

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

を材料aswellを忘れてしまった幾何学、材料を作成し、グローバル変数にメッシュする方法についての例です。しかし、おそらく、ジオメトリとマテリアルをグローバル変数として保存する必要はありません(メッシュからアクセスすることができます:frameMesh.material; frameMesh.geometry)。

パラメータ名がグローバル変数名と同じ場合、javascriptは、グローバル変数名にアクセスしようとするときにグローバル変数名の代わりにパラメータ変数を使用します。

+0

大変お手数です! frameMaterial = materialは私が紛失していたパズルの大きな鍵でした。 –

+0

@ ab3d_work答えがあなたの問題を解決した場合は、私の答えの左側のチェックをクリックして正しいものとしてマークしてください:)。 – micnil

+0

私はちょっと前にやった:)素材= frameMaterialがうまくいきます。今、私はJSONLoaderを介してアップロードされているジオメトリにクロム素材(cubeCameraを使用)を作成しようとしています。私は、グローバル変数で宣言されたジオメトリは、JSONLoaderのグローバルなマテリアルほど親切ではないようです。グローバルにする必要があるので、レンダリングのためにcubeCameraのアップデートを呼び出すことができます。あなたが洞察力を貸すことができれば、再び彼のために大きな助けになるでしょう! –

関連する問題