Javascript Three.js没有显示任何内容
我一直在用three.js做一些实验。然而,当我尝试做一个简单的测试时,我无法让它显示任何内容。这是我的密码。如果有人能告诉我我错过了什么,那将非常有帮助Javascript Three.js没有显示任何内容,javascript,webgl,three.js,Javascript,Webgl,Three.js,我一直在用three.js做一些实验。然而,当我尝试做一个简单的测试时,我无法让它显示任何内容。这是我的密码。如果有人能告诉我我错过了什么,那将非常有帮助 //Constant declaration var RENDER_DIST = 1000, FOV = 75; var WIDTH = window.innerWidth, HEIGHT= window.innerHeight; //Create the scene var scene = new THREE.Scene
//Constant declaration
var RENDER_DIST = 1000,
FOV = 75;
var WIDTH = window.innerWidth,
HEIGHT= window.innerHeight;
//Create the scene
var scene = new THREE.Scene();
//Create the camera
var camera = new THREE.PerspectiveCamera(FOV, WIDTH / HEIGHT, 0.1, RENDER_DIST);
//Pull the camera back a bit
camera.z = 100;
//Then add it to the scene
scene.add(camera);
//Create a renderer
renderer = new THREE.WebGLRenderer();
renderer.setSize(WIDTH,HEIGHT);
renderer.domElement.className = "glMain";
//Container is a div
$("#container").html(renderer.domElement);
//Boilerplate done! Celebrate!
(function init() {
var geometry = new THREE.SphereGeometry(50);
var material = new THREE.MeshBasicMaterial({color: 0xff0000});
var sphere = new THREE.Mesh(geometry, material);
scene.add(sphere);
//debugging
console.log("Sphere at " + sphere.position.x + " " + sphere.position.y + " " + sphere.position.z);
})();
//Our main function
(function loopRun() {
requestAnimationFrame(loopRun);
console.log("rendered");
renderer.render(scene, camera);
})();
在控制台日志中,我得到了所有的“呈现的”
消息,但没有显示任何内容。我已经检查过画布的大小是否正确,是否正确,所以我不知道出了什么问题。我试过几种不同的几何图形
编辑:我使用的是Chrome,在线的three.js示例很好用。控制台日志中没有错误。您也可以尝试:
//Pull the camera back a bit
camera.position.z = 100;
//Container is a div
document.body.appendChild(renderer.domElement);
$("#container").append(renderer.viewElement);
您也可以尝试:
$("#container").append(renderer.viewElement);
是的!就这样。今天动态打字似乎对我怀恨在心。是的!就这样。今天,动态打字似乎对我怀恨在心。