< 背景 > javascript、three.js初心者でございます。 blenderにて出力したモデル（glbファイル）をthree.jsで取り込みブラウザ上での表示を試みています。 < 問題 > 下記コードでglb形式モデルの取り込み、ウェブ上に表示させようとしたのですが灰色の画面のみ表示されます。cloud9を使用しています。どこに原因があるのか大まかに把握する為 three.js内で作成したmeshは表示させる事ができました。ので、**glb取り込みのパートのどこかに問題があるのかなと思っています。** コードを丸々投げる乱暴な質問で大変恐縮なのですが問題点わかりましたらご教授いただきたく存じます。 ```HTML meadolBox-3d

``` ```javascript import {GLTFLoader} from './GLTFLoader.js'; import { Scene, PerspectiveCamera, MeshBasicMaterial, AmbientLight, } from './three.module.js'; function init(){ //scene設置 var scene = new Scene(); //camera設置 var camera = new PerspectiveCamera(45,window.innerWidth / window.innerHeight,1,1000); camera.position.set(10, 10, 10); camera.lookAt(scene.position); //renderer設置 var renderer = new WebGLRenderer(); renderer.setClearColor(0xEEEEEE); renderer.setSize(window.innerWidth, window.innerHeight); //glbインポート var gltfLoader = new GLTFLoader(); let model = null; gltfLoader.load('box.glb',function(gltf){ model = gltf.scene; model.scale.set(2,2,2); model.position.set(0,0,0); scene.add(model); }); //環境光設置 var light = new AmbientLight(0xFFFFFF, 3.0); scene.add(light); document.getElementById('stage').appendChild(renderer.domElement); renderer.render(scene, camera); } window.onload = init; ``` <フォルダの中身> フォルダ | box.glb | index.html | box-3d.js | three.module.js | GLTFLoader.js

@@ -10,7 +10,7 @@
 下記コードでglb形式モデルの取り込み、ウェブ上に表示させようとしたのですが
-灰色の画面のみ表示されます。
+灰色の画面のみ表示されます。cloud9を使用しています。

質問編集履歴