<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>threejs练习</title>
<script type="text/javascript" src="three.js"></script>
<style>
*{margin:0;padding:0;}
</style>
</head>
<body>
<script>
//1。thressjs中三大重建:场景、相机、渲染器
var scene=new THREE.Scene();//场景
//透视相机
var camera=new THREE.PerspectiveCamera(75,window.innerWidth/window.innerHeight,0.1,1000);
var renderer=new THREE.WebGLRenderer();//渲染器
//设置渲染器的大小为窗口的内高度,也就是内容区的宽度
renderer.setSize(window.innerWidth,window.innerHeight);
document.body.appendChild(renderer.domElement); //2.添加物体到场景中
var geometry=new THREE.CubeGeometry(1,1,1);
//THREE.CubeGeometry是一个几何体 var material=new THREE.MeshBasicMaterial({color:0x008080});//0x00ff00
var cube=new THREE.Mesh(geometry,material);
scene.add(cube); //3.渲染。渲染循环 camera.position.z = 5;
function render() {
requestAnimationFrame(render);
cube.rotation.x += 0.08;//设置x,y的移动长度
cube.rotation.y += 0.08;
/*cube.rotation.z += 0.05;*/
renderer.render(scene, camera);
}
render(); </script>
</body>
</html>

初步了解three.js的更多相关文章

  1. 使用eclipse初步学习vue.js基础==》v-for的使用 ②

    一.步骤演示 1. 新建一个jsp文件 2. 把vue.js放到Web的js目录下 3. 在jsp中引入vue.js <script src="${pageContext.reques ...

  2. 使用eclipse初步学习vue.js的基本操作 ①

    一.vue.js的初步认识 <a href="https://unpkg.com/vue ">vue.js下载</a> 1.抛开手动操作DOM的思维,Vue ...

  3. 初步理解require.js模块化编程

    初步理解require.js模块化编程 一.Javascript模块化编程 目前,通行的Javascript模块规范共有两种:CommonJS和AMD. 1.commonjs 2009年,美国程序员R ...

  4. 初步了解Node.js,学做简单的留言本案例

    在还没有正式的学Node.js的时候, 你们认为Node.js 对于前端来说是什么呢? 会认为Node.js 是框架? 认为这是类似Jquery的一个快速.简洁的JavaScript框架? 反正我自己 ...

  5. 初步揭秘node.js中的事件

    当你学习node.js的时候,Events是一个非常重要的需要理解的事情.非常多的Node对象触发事件,你能在文档API中找到很多例子.但是关于如何写自己的事件和监听,你可能还不太清楚.如果你不了解, ...

  6. 初步学习vue.js

    vue是法语中视图的意思,Vue.js是一个轻巧.高性能.可组件化的MVVM库,同时拥有非常容易上手的API. 响应的数据绑定 Vue.js 的核心是一个响应的数据绑定系统,它让数据与 DOM 保持同 ...

  7. 初步了解关于js跨域问题

    js跨域问题是指在js在不同的域中进行数据传输或者数据通信,比如通过ajax向不同的域请求数据(说到ajax,不可避免的就会遇到两个问题:一是ajax是如何传递数据的?二是ajax是如何实现跨域的?) ...

  8. 初步了解关于js跨域问题-jsonp

    js跨域问题是指在js在不同的域中进行数据传输或者数据通信,比如通过ajax向不同的域请求数据(说到ajax,不可避免的就会遇到两个问题:一是ajax是如何传递数据的?二是ajax是如何实现跨域的?) ...

  9. 初步理解impress.js

    1.认识impress.js impress.js 采用 CSS3 与 JavaScript 语言完成的一个可供开发者使用的表现层框架(演示工具). 现在普通开发者可以利用 impress.js 自己 ...

随机推荐

  1. DNN网络(一)

    摘自 https://www.cnblogs.com/pinard/p/6418668.html 一.DNN 简介 1.DNN的层次可以分为三层 输入层(input layer) 隐藏层(hidden ...

  2. 常用几个SQL语句(增删改查)

    --创建一个学生测试表 create table teststu( no char(2), name char(4), age number(2) ); --insert 插入数据 insert in ...

  3. visual studio code运行时报错,无法将“cnpm”项识别为 cmdlet、函数、脚本文件或可运行程序的名称,Cannot find module 'webpack'

    前言 因公司技术需求,这段时间成功进入了Vue 2.0 的坑,刚用起Visual Studio Code,却发现问题很多,发现一个错误:cnpm : 无法将“cnpm”项识别为 cmdlet.函数.脚 ...

  4. python 的基础 学习 第三

    1,in ,not in 判断子元素是是否在原字符串(字典,列表,集合)中,主要是用在检测敏感字 print('a' in 'abcchhhhd') 有则返回True, print('j' in 'a ...

  5. 通过dbutil操作数据库

    dbutil操作数据库工具类 步骤 导入jar包 c3p0-0.9.1.2.jar         commons-dbutils-1.6.jar         mysql-connector-ja ...

  6. 【译】第四篇 SQL Server安全权限

    本篇文章是SQL Server安全系列的第四篇,详细内容请参考原文. 权限授予主体访问对象,以执行某些操作.SQL Server有大量你可以授予给主体的权限,你甚至可以拒绝或回收权限.这听起来有点复杂 ...

  7. day 10 - 2 函数练习

    1.写函数 接收 n 个数字  求这些参数数字的和 def sum_func(*args): total = 0 for i in args: total += i return total prin ...

  8. apache基础学习

    1,apache是什么? 目前最主流的三个Web服务器是Apache Nginx IIS 2,环境搭建 linux系统安装xampp: 先下载xampp for linux,放在/opt文件夹下,程序 ...

  9. Nginx系列0:Nginx学习历程

    Nginx学习历程 一.初识Nginx 1.Nginx适用于哪些场景 (1)静态资源服务 通过本地文件系统提供服务 (2)反向代理服务 Nginx的强大性能 缓存 负载均衡 (3)API服务 Open ...

  10. C/C++中 # 的神奇作用:把宏参数字符串化/贴合宏参数

    一.一般用法   我们使用#把宏参数变为一个字符串,用##把两个宏参数贴合在一起. #define STR(s) #s #define CONS(a,b) int(a##e##b) printf(ST ...