效果：
代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Three.js tutorial - Lesson 07</title>
<style>body{background:#eeeeee;overflow:hidden;}</style>
<script src="js/r69/three.js"></script>
<script src="js/r69/Detector.js"></script>
<script src="js/r69/CanvasRenderer.js"></script>
<script src="js/r69/Projector.js"></script>
</head>
<body>
<script>
var scene,camera,mesh,renderer;
if(Detector.webgl){
renderer = new THREE.WebGLRenderer({antialias:true});
}else{
renderer = new THREE.CanvasRenderer();
}
renderer.setSize(window.innerWidth, window.innerHeight);
renderer.setClearColor(0xeeeeee, 0.5);
document.body.appendChild(renderer.domElement);
scene = new THREE.Scene();
camera = new THREE.PerspectiveCamera(45, window.innerWidth/window.innerHeight, 1, 1000);
camera.position.set(0, 0, 10);
camera.lookAt(scene.position);
//scene.add(camera);
var cubetex = new THREE.ImageUtils.loadTexture("images/Crate.jpg");
var geo = new THREE.BoxGeometry(4, 4, 4);
var cube = new THREE.Mesh(geo, new THREE.MeshPhongMaterial({map: cubetex}));
cube.material.side = THREE.BackSide; //设置该属性可以看到立方体内部
cube.position.set(0, 0, 0);
scene.add(cube);
var light = new THREE.AmbientLight(0xffffff);
light.position.set(10, 10, 10);
scene.add(light);
var x = 0;
var y = 0;
var z = 0;
function render(){
x += 0.001;
y += 0.001;
z += 0.001;
cube.rotation.set(x, y, z);
renderer.render(scene, camera);
requestAnimationFrame(render);
}
render();
</script>
</body>
</html>
相关推荐
【二年级英语上册 unit1 Lesson6-Lesson7教案】主要涵盖了小学阶段英语教学的一些核心知识点，包括情感目标、知识目标、能力目标、教学重点和难点，以及教学过程中的具体活动设计。以下是对这些内容的详细说明： 1....
opengl简单教程前五课pdf，
opengl简单视频教程Lesson10-Lesson11,网站地址： http://www.videotutorialsrock.com
OpenGL是计算机图形学中的一个强大库，用于在各种...这个系列教程对于任何想要进入游戏开发、科学可视化或图形设计领域的初学者来说，都是一个宝贵的资源。在观看视频的同时，配合实践编程，将能更好地巩固所学知识。
这个简单的视频教程“Lesson6-Lesson9”旨在帮助初学者理解并掌握OpenGL的基础概念和核心功能。通过观看这些课程，学习者将能够逐步建立起对OpenGL的理解，并能够创建自己的基本图形应用程序。 在Lesson6中，主要...
NeHe OpenGL教程（中英文版附带VC++源码）中英文系列 Lesson 01-lesson 02 创建一个OpenGL窗口: 如何创建三角形和四边形 http://ieee.org.cn/dispbbs.asp?boardID=61&ID=53679 Lesson 03-lesson 04 添加颜色 旋转 ...
OpenGL是计算机图形学中的一种广泛应用的编程接口...通过这个系列的教程，学习者将获得足够的技能来开发自己的OpenGL应用程序，并能够理解和应用许多现代图形编程技术。建议结合实际编程实践，逐步掌握并巩固所学知识。
next.js-ssr课程 在egghead.io上回购课程 指示 git clone https://github.com/tgrecojs/next.js-ssr-lesson && cd next.js-ssr-lesson npm install npm run dev
新概念青少版a---lesson5.ppt
NeHe OpenGL教程（中英文版附带VC++源码）中英文系列 Lesson 01-lesson 02 创建一个OpenGL窗口: 如何创建三角形和四边形 http://ieee.org.cn/dispbbs.asp?boardID=61&ID=53679 Lesson 03-lesson 04 添加颜色 旋转 ...
plots-lesson16
[2.1.1]--Lesson1Four-StepTranslationProce.srt
中国民航飞行人员英语--lesson-4.doc
Lesson 7: Flats (3-3-5) - 32 - Lesson 8: Triangles - 36 - Lesson 9: Corrective Combinations - 39 - Lesson 10: The guideline of alternation - 43 - Lesson 11: Forecasting corrective waves - 46 - Lesson ...
在"js-fifth-lesson"这个主题中，我们可以深入探讨JavaScript的一些核心概念和关键知识点。 1. 变量与数据类型： JavaScript支持变量的动态类型，使用`var`, `let`, 或 `const` 关键字声明。基本数据类型包括字符...
ct-算法重建-马建-lesson01-ct-recon.ppt
How do you come to school--Lesson 112 .docx
NeHe OpenGL教程（中英文版附带VC++源码）中英文系列 Lesson 01-lesson 02 创建一个OpenGL窗口: 如何创建三角形和四边形 http://ieee.org.cn/dispbbs.asp?boardID=61&ID=53679 Lesson 03-lesson 04 添加颜色 旋转 ...
ML-lesson3-Scikit-learn.mhtml
本教程“OpenGL简单教程Lesson1-Lesson5(src)”提供了前五课的源代码，帮助初学者深入理解并实践OpenGL编程。在这个教程中，我们将探讨以下几个关键知识点： 1. **OpenGL基本概念**：OpenGL是一个跨语言、跨平台的...