类

1.Cameras

照相机，包括很多种类型的摄像机类，包括正交类型和投影类型的摄像机

2.Core

核心对象

3.Lights

光照，包括点光，环境光，镜面光等等

4.Loaders

专门用来加载文件

5.Materials

材质类

6.Math

数学类

7.Objects

物体类，比如平面，圆，网格等等

8.Renderers

渲染器

9.Scenes

场景

10.Textures

纹理

11.Extras

扩展的对象

12.Extras/Animation

动作类

13.Extras/Cameras

摄像机的扩展

14.Extras/Core

核心对象的扩展

15.Extras/Geometries

几何对象的扩展

16.Extras/Helpers

帮助对象的扩展

17.Extras/Objects

物体对象的扩展

18.Extras/Renderers/Plugins

渲染器的扩展

19.Extras/Shaders

着色器的扩展

简单实现

一个典型基础的Three.js至少要包括渲染器(Renderer)，场景(Scene)，照相机(Camera)，以及在场景中创建的物体。是不是感觉有点像Cocos2dx。

ok，第一个项目就这样生成了。

<html>

<head>

    <title>My first three.js app</title>

    <style>

        body { margin: 0; }

        canvas { width: 100%; height: 100% }

    </style>

</head>

<body>

<script src="three.js"></script>

<script>

    // 创建场景

    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 );

    // 创建盒子

    var geometry = new THREE.BoxGeometry( 1, 1, 1 );

    var material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );

    var cube = new THREE.Mesh( geometry, material );

    // 将物体加入场景

    scene.add( cube );

    // 设置摄像机的深度

    camera.position.z = 5;

    var render = function () {

        // 在一定的时间内重复实行某函数

        requestAnimationFrame( render );

        cube.rotation.x += 0.1;

        cube.rotation.y += 0.1;

        // 执行渲染

        renderer.render(scene, camera);

    };

	 // 执行定义函数

    render();

</script>

</body>

</html>

Three.js 类的粗略总结和实现的更多相关文章

自己手写的自动完成js类
在web开发中,为了提高用户体验,会经常用到输入框的自动完成功能,不仅帮助用户进行快速输入,最重要的是帮助那些“记不全要输入什么”的用户进行选择.这个功能有很多插件已经实现了,为了适应项目的特殊需求, ...
JS类的封装及实现代码
js并不是一种面向对向的语言, 没有提供对类的支持, 因此我们不能像在传统的语言里那样用class来定义类, 但我们可以利用js的闭包封装机制来实现js类, 我们来封装一个简的Shape类. 1. ...
几种常用的JS类定义方法
几种常用的JS类定义方法 // 方法1 对象直接量var obj1 = { v1 : "", get_v1 : function() { return ...
js类（继承）（二）
1. 定义js类 js并不是一种面向对向的语言, 没有提供对类的支持, 因此我们不能像在传统的语言里那样用class来定义类, 但我们可以利用js的闭包封装机制来实现js类, 我们来封装一个简的Sh ...
JS类继承常用方式发展史
JS类继承常用方式发展史涉及知识点构造函数方式继承 1-继承单个对象 1.1 多步走初始版 1.2 多步走优化版 1.3 Object.create()方式 2-继承多个对象 2.1 遍历 Obj ...
两种简单实现菜单高亮显示的JS类(转载)
两种简单实现菜单高亮显示的JS类近期在写一个博客管理后台的前端,涉及在同一页面两种高亮显示当前菜单的需求.记得当年写静态页时,为了实现高亮都是在每个页面加不同的样式,呵.高亮显示我觉得对于web ...
js类的使用
brush示例以d3的一个brush进行叙述,示例见: https://bl.ocks.org/xunhanliu/6f0b46789842e9e19e6cfe9bd0b16806 应用情形: 当页 ...
JS OOP -03 JS类的实现
JS类的实现: a.理解类的实现机制 b.使用prototype对象定义类成员 c.一种JS类的设计模式 a.理解类的实现机制在JS中可以使用function关键字来定义一个类. 添加类的成员,在函 ...
Js 类继承 extends
html 及 js 代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset=&q ...

随机推荐

用C代码简要模拟实现一下RPC(远程过程调用)并谈谈它在代码调测中的重要应用【转】
转自:http://blog.csdn.net/stpeace/article/details/44947925 版权声明:本文为博主原创文章,转载时请务必注明本文地址, 禁止用于任何商业用途, 否则 ...
牛x的JavaScript编辑器你知道几个
英文:Martin Heller 译文:葡萄城控件学习过程中遇到什么问题或者想获取学习资源的话,欢迎加入学习交流群343599877,我们一起学前端! 对于JavaScript程序员来说,目前有很 ...
vue2.0组件之间的传值
1.父子组件--props props:需要注意的是,虽然的是单向的数据流,但是如果传递的是数组或是对象这样的引用类型,子组件数据变化,父组件的数据通也会变化子组件代码 <template&g ...
Windows Phone 8 获取设备名称
通过使用Microsoft.Phone.Info.DeviceStatus类,我们可以获取设备的一些信息,如设备厂商,设备名称等.通过Microsoft.Phone.Info.DeviceStatus ...
mac下PHPStorm2018.2破解教程
1.首先安装phpstorm 2.下载JetbrainsCrack-3.1-release-enc.jar然后把这个文件放入安装phpstorm/contents/lib目录下 3.用文本编辑器打开p ...
centos7的防火墙（firewalld）
Centos7中默认将原来的防火墙iptables升级为了firewalld,firewalld跟iptables比起来至少有两大好处: 1.firewalld可以动态修改单条规则,而不需要像ipta ...
mysql自增id归0
mysql自增id归0 ALTER TABLE table_name AUTO_INCREMENT=1;
android studio实现Intent通信-------牛刀小试
概述: 本博文实现一种小程序,两个Activity单向通信,主从关系,MainActivty 页面布局一个EditText+Button,实现逻辑是单击按钮将信息发送给另外一个DisplayMessa ...
JVM性能调优监控工具——jps、jstack、jmap、jhat、jstat、hprof使用详解
摘要: JDK本身提供了很多方便的JVM性能调优监控工具,除了集成式的VisualVM和jConsole外,还有jps.jstack.jmap.jhat.jstat.hprof等小巧的工具,本博客希望 ...
Ninject中调用webapi卡住的情况解决
过年这两天在家做项目,把mvc升级到了5.1,webapi升级到了2.1,忽然发现一个问题,在某些页面上ajax调用webapi时会发现卡死现象,CPU也没有被占用,就是网页一些在加载也不报错,经过2 ...

Three.js 类的粗略总结和实现

类