系列博文-Three.js入门指南(张雯莉)-静态demo和three.js功能概览
一:一个最简单的静态DEMO
//body加载完后触发init()
//WebGL的渲染是需要HTML5 Canvas元素的,你可以手动在HTML的<body>部分中定义Canvas元素,或者让Three.js帮你生成。这两种选择一般没有多大差别,我们在此手动在HTML中定义:
<body onload="init()">
<canvas id="mainCanvas" width="400px" height="300px" ></canvas>
</body>
<script>
function init() { var renderer = new THREE.WebGLRenderer({
canvas: document.getElementById('mainCanvas')
}); renderer.setClearColor(0x000000); var scene = new THREE.Scene();
var camera = new THREE.PerspectiveCamera(45, 4 / 3, 1, 1000);
camera.position.set(0, 0, 5);
scene.add(camera);
var cube = new THREE.Mesh(new THREE.CubeGeometry(1, 2, 3),new THREE.MeshBasicMaterial({color: 0xff0000}));scene.add(cube);
renderer.render(scene, camera);
} </script>
二:Three.js功能概览
Cameras(照相机,控制投影方式)
Camera
OrthographicCamera
PerspectiveCamera
Core(核心对象)
BufferGeometry
Clock(用来记录时间)
EventDispatcher
Face3
Face4
Geometry
Object3D
Projector
Raycaster(计算鼠标拾取物体时很有用的对象)
Lights(光照)
Light
AmbientLight
AreaLight
DirectionalLight
HemisphereLight
PointLight
SpotLight
Loaders(加载器,用来加载特定文件)
Loader
BinaryLoader
GeometryLoader
ImageLoader
JSONLoader
LoadingMonitor
SceneLoader
TextureLoader
Materials(材质,控制物体的颜色、纹理等)
Material
LineBasicMaterial
LineDashedMaterial
MeshBasicMaterial
MeshDepthMaterial
Cameras(照相机,控制投影方式)
Camera
OrthographicCamera
PerspectiveCamera
Core(核心对象)
BufferGeometry
Clock(用来记录时间)
EventDispatcher
Face3
Face4
Geometry
Object3D
Projector
Raycaster(计算鼠标拾取物体时很有用的对象)
Lights(光照)
Light
AmbientLight
AreaLight
DirectionalLight
HemisphereLight
PointLight
SpotLight
Loaders(加载器,用来加载特定文件)
Loader
BinaryLoader
GeometryLoader
ImageLoader
JSONLoader
LoadingMonitor
SceneLoader
TextureLoader
Materials(材质,控制物体的颜色、纹理等)
Material
LineBasicMaterial
LineDashedMaterial
MeshBasicMaterial
MeshDepthMaterial
MeshFaceMaterial
MeshLambertMaterial
MeshNormalMaterial
MeshPhongMaterial
ParticleBasicMaterial
ParticleCanvasMaterial
ParticleDOMMaterial
ShaderMaterial
SpriteMaterial
Math(和数学相关的对象)
Box2
Box3
Color
Frustum
Math
Matrix3
Matrix4
Plane
Quaternion
Ray
Sphere
Spline
Triangle
Vector2
Vector3
Vector4
Objects(物体)
Bone
Line
LOD
Mesh(网格,最常用的物体)
MorphAnimMesh
Particle
ParticleSystem
Ribbon
SkinnedMesh
Sprite
Renderers(渲染器,可以渲染到不同对象上)
CanvasRenderer
WebGLRenderer(使用WebGL渲染,这是本书中最常用的方式)
WebGLRenderTarget
WebGLRenderTargetCube
WebGLShaders(着色器,在最后一章作介绍)
Renderers / Renderables
RenderableFace3
RenderableFace4
RenderableLine
RenderableObject
RenderableParticle
RenderableVertex
Scenes(场景)
Fog
FogExp2
Scene
Textures(纹理)
CompressedTexture
DataTexture
Texture
Extras
FontUtils
GeometryUtils
ImageUtils
SceneUtils
Extras / Animation
Animation
AnimationHandler
AnimationMorphTarget
KeyFrameAnimation
Extras / Cameras
CombinedCamera
CubeCamera
Extras / Core
Curve
CurvePath
Gyroscope
Path
Shape
Extras / Geometries(几何形状)
CircleGeometry
ConvexGeometry
CubeGeometry
CylinderGeometry
ExtrudeGeometry
IcosahedronGeometry
LatheGeometry
OctahedronGeometry
ParametricGeometry
PlaneGeometry
PolyhedronGeometry
ShapeGeometry
SphereGeometry
TetrahedronGeometry
TextGeometry
TorusGeometry
TorusKnotGeometry
TubeGeometry
Extras / Helpers
ArrowHelper
AxisHelper
CameraHelper
DirectionalLightHelper
HemisphereLightHelper
PointLightHelper
SpotLightHelper
Extras / Objects
ImmediateRenderObject
LensFlare
MorphBlendMesh
Extras / Renderers / Plugins
DepthPassPlugin
LensFlarePlugin
ShadowMapPlugin
SpritePlugin
Extras / Shaders
ShaderFlares
ShaderSprite
22
1.3 Three.js功能概览
Cameras(照相机,控制投影方式)
Camera
OrthographicCamera
PerspectiveCamera
Core(核心对象)
BufferGeometry
Clock(用来记录时间)
EventDispatcher
Face3
Face4
Geometry
Object3D
Projector
Raycaster(计算鼠标拾取物体时很有用的对象)
Lights(光照)
Light
AmbientLight
AreaLight
DirectionalLight
HemisphereLight
PointLight
SpotLight
Loaders(加载器,用来加载特定文件)
Loader
BinaryLoader
GeometryLoader
ImageLoader
JSONLoader
LoadingMonitor
SceneLoader
TextureLoader
Materials(材质,控制物体的颜色、纹理等)
Material
LineBasicMaterial
LineDashedMaterial
MeshBasicMaterial
MeshDepthMaterial
MeshFaceMaterial
MeshLambertMaterial
MeshNormalMaterial
MeshPhongMaterial
ParticleBasicMaterial
ParticleCanvasMaterial
ParticleDOMMaterial
ShaderMaterial
SpriteMaterial
Math(和数学相关的对象)
Box2
Box3
Color
Frustum
Math
Matrix3
Matrix4
Plane
Quaternion
Ray
Sphere
Spline
Triangle
Vector2
Vector3
Vector4
Objects(物体)
Bone
Line
LOD
Mesh(网格,最常用的物体)
MorphAnimMesh
Particle
ParticleSystem
Ribbon
SkinnedMesh
Sprite
Renderers(渲染器,可以渲染到不同对象上)
CanvasRenderer
WebGLRenderer(使用WebGL渲染,这是本书中最常用的方式)
WebGLRenderTarget
WebGLRenderTargetCube
WebGLShaders(着色器,在最后一章作介绍)
Renderers / Renderables
RenderableFace3
RenderableFace4
RenderableLine
RenderableObject
RenderableParticle
RenderableVertex
Scenes(场景)
Fog
FogExp2
Scene
Textures(纹理)
CompressedTexture
DataTexture
Texture
Extras
FontUtils
GeometryUtils
ImageUtils
SceneUtils
Extras / Animation
Animation
AnimationHandler
AnimationMorphTarget
KeyFrameAnimation
Extras / Cameras
CombinedCamera
CubeCamera
Extras / Core
Curve
CurvePath
Gyroscope
Path
Shape
Extras / Geometries(几何形状)
CircleGeometry
ConvexGeometry
CubeGeometry
CylinderGeometry
ExtrudeGeometry
IcosahedronGeometry
LatheGeometry
OctahedronGeometry
ParametricGeometry
PlaneGeometry
PolyhedronGeometry
ShapeGeometry
SphereGeometry
TetrahedronGeometry
TextGeometry
TorusGeometry
TorusKnotGeometry
TubeGeometry
Extras / Helpers
ArrowHelper
AxisHelper
CameraHelper
DirectionalLightHelper
HemisphereLightHelper
PointLightHelper
SpotLightHelper
Extras / Objects
ImmediateRenderObject
LensFlare
MorphBlendMesh
Extras / Renderers / Plugins
DepthPassPlugin
LensFlarePlugin
ShadowMapPlugin
SpritePlugin
Extras / Shaders
Cameras(照相机,控制投影方式)
Camera
OrthographicCamera
PerspectiveCamera
Core(核心对象)
BufferGeometry
Clock(用来记录时间)
EventDispatcher
Face3
Face4
Geometry
Object3D
Projector
Raycaster(计算鼠标拾取物体时很有用的对象)
Lights(光照)
Light
AmbientLight
AreaLight
DirectionalLight
HemisphereLight
PointLight
SpotLight
Loaders(加载器,用来加载特定文件)
Loader
BinaryLoader
GeometryLoader
ImageLoader
JSONLoader
LoadingMonitor
SceneLoader
TextureLoader
Materials(材质,控制物体的颜色、纹理等)
Material
LineBasicMaterial
LineDashedMaterial
MeshBasicMaterial
MeshDepthMaterial
MeshFaceMaterial
MeshLambertMaterial
MeshNormalMaterial
MeshPhongMaterial
ParticleBasicMaterial
ParticleCanvasMaterial
ParticleDOMMaterial
ShaderMaterial
SpriteMaterial
Math(和数学相关的对象)
Box2
Box3
Color
Frustum
Math
Matrix3
Matrix4
Plane
Quaternion
Ray
Sphere
Spline
Triangle
Vector2
Vector3
Vector4
Objects(物体)
Bone
Line
LOD
Mesh(网格,最常用的物体)
MorphAnimMesh
Particle
ParticleSystem
Ribbon
SkinnedMesh
Sprite
Renderers(渲染器,可以渲染到不同对象上)
CanvasRenderer
WebGLRenderer(使用WebGL渲染,这是本书中最常用的方式)
WebGLRenderTarget
WebGLRenderTargetCube
WebGLShaders(着色器,在最后一章作介绍)
Renderers / Renderables
RenderableFace3
RenderableFace4
RenderableLine
RenderableObject
RenderableParticle
RenderableVertex
Scenes(场景)
Fog
FogExp2
Scene
Textures(纹理)
CompressedTexture
DataTexture
Texture
Extras
FontUtils
GeometryUtils
ImageUtils
SceneUtils
Extras / Animation
Animation
AnimationHandler
AnimationMorphTarget
KeyFrameAnimation
Extras / Cameras
CombinedCamera
CubeCamera
Extras / Core
Curve
CurvePath
Gyroscope
Path
Shape
Extras / Geometries(几何形状)
CircleGeometry
ConvexGeometry
CubeGeometry
CylinderGeometry
ExtrudeGeometry
IcosahedronGeometry
LatheGeometry
OctahedronGeometry
ParametricGeometry
PlaneGeometry
PolyhedronGeometry
ShapeGeometry
SphereGeometry
TetrahedronGeometry
TextGeometry
TorusGeometry
TorusKnotGeometry
TubeGeometry
Extras / Helpers
ArrowHelper
AxisHelper
CameraHelper
DirectionalLightHelper
HemisphereLightHelper
PointLightHelper
SpotLightHelper
Extras / Objects
ImmediateRenderObject
LensFlare
MorphBlendMesh
Extras / Renderers / Plugins
DepthPassPlugin
LensFlarePlugin
ShadowMapPlugin
SpritePlugin
Extras / Shaders
ShaderFlares
ShaderSprite
系列博文-Three.js入门指南(张雯莉)-静态demo和three.js功能概览的更多相关文章
- 系列博文-Three.js入门指南(张雯莉)-网格 setInterval方法 requestAnimationFrame方法 使用stat.js记录FPS
第6章 动画 在本章之前,所有画面都是静止的,本章将介绍如果使用Three.js进行动态画面的渲染.此外,将会介绍一个Three.js作者写的另外一个库,用来观测每秒帧数(FPS). CSS3动画那么 ...
- 系列博文-Three.js入门指南(张雯莉)-照相机
照相机就是这样一个抽象,它定义了三维空间到二维屏幕的投影方式,用“照相机”这样一个类比,可以使我们直观地理解这一投影方式.而针对投影方式的不同,照相机又分为正交投影照相机与透视投影照相机.我们需要为自 ...
- 一起学微软Power BI系列-官方文档-入门指南(1)Power BI初步介绍
我们在前一篇文章微软新神器-Power BI,一个简单易用,还用得起的BI产品中,我们初步介绍了Power BI的基本知识.由于Power BI是去年开始微软新发布的一个产品,虽然已经可以企业级应用, ...
- 一起学微软Power BI系列-官方文档-入门指南(2)获取源数据
我们在文章: 一起学微软Power BI系列-官方文档-入门指南(1)Power BI初步介绍中,我们介绍了官方入门文档的第一章.今天继续给大家介绍官方文档中,如何获取数据源的相关内容.虽然是英文,但 ...
- 一起学微软Power BI系列-官方文档-入门指南(3)Power BI建模
我们前2篇文章:一起学微软Power BI系列-官方文档-入门指南(1)Power BI初步介绍 和一起学微软Power BI系列-官方文档-入门指南(2)获取源数据 中,我们介绍了官方入门文档与获取 ...
- 一起学微软Power BI系列-官方文档-入门指南(4)Power BI的可视化
在前面的系列文章中,我们介绍了官方有关获取数据,以及建模的原始文档和基本介绍.今天继续给大家介绍官方文档中,有关可视化的内容.实际上获获取数据和建模更注重业务关系的处理,而可视化则关注对数据的解读.这 ...
- 一起学微软Power BI系列-官方文档-入门指南(5)探索数据奥秘
我们几篇系列文章中,我们介绍了官方入门文档与获取数据等基本知识.今天继续给大家另外一个重点,探索数据奥秘.有了数据源,有了模型,下一步就是如何解析数据了.解析数据的过程需要很多综合技能,不仅仅是需要掌 ...
- 一起学微软Power BI系列-官方文档-入门指南(6)Power BI与Excel
今天介绍了官方入门文档中有关PowerBI和Excel的知识.前几篇入门文档有点仓促,加上最近时间的研究,会有更多技巧性和入门型的文章或者视频发布,最后2篇入门文档将更加详细一点,因为部分文章进行简单 ...
- 一起学微软Power BI系列-官方文档-入门指南(7)发布与共享-终结篇+完整PDF文档
接触Power BI的时间也只有几个月,虽然花的时间不多,但通过各种渠道了解收集,谈不上精通,但对一些重要概念和细节还是有所了解.在整理官方文档的过程中,也熟悉和了解了很多概念.所以从前到后把微软官方 ...
随机推荐
- android 防止反编译的若干方法
第一种方式:混淆策略 混淆策略是每个应用必须增加的一种防护策略,同时他不仅是为了防护,也是为了减小应用安装包的大小,所以他是每个应用发版之前必须要添加的一项功能,现在混淆策略一般有两种: 对代码的混淆 ...
- 机器人操作系统ROS(indigo)与三维仿真软件V-Rep(3.2.1)通信接口使用笔记
关键字:ROS(indigo),V-Rep(3.2.1), vrep_ros_bridge(lagadic). vrep_ros_bridge提供了V-Rep和ROS之间的通信接口,可以实现使用ROS ...
- windows下c语言获取程序当前的执行目录,读文件的代码片
代码如下: #include "stdafx.h" #include "stdlib.h" #include <direct.h> #include ...
- 代理网络中安装tomcat的注意事项
搭建J2EE开发环境的时候,tomcat怎么都没办法访问主页面.主要的问题就是Network Error (tcp_error) 百度了半天也没搞明白,最后没办法,打算重装tomcat,便对照完整的安 ...
- 全局程序集缓存GAC
GAC中的所有的Assembly都会存放在系统目录"%winroot%\assembly下面.放在系统目录下的好处之一是可以让系统管理员通过用户权限来控制Assembly的访问. 目录:C: ...
- git push 报错 "Peer certificate cannot be authenticated with known CA certificates"
使用git push -u origin master 命令向远程仓库提交代码时报错:Peer certificate cannot be authenticated with known CA ce ...
- 如何使你的Ajax应用内容可让搜索引擎爬行
This document outlines the steps that are necessary in order to make your AJAX application crawlable ...
- 与班尼特·胡迪一起拿奖学金(HZNU-2273)
与班尼特·胡迪一起拿奖学金 AC Time Limit: 2 s Memory Limit: 256 MB Description 班尼特·胡迪这学期的体测终于上80分了,当期末考试的 ...
- Kapacitor之TICK脚本,监控输出
好久没更新博客园了,说来也惭愧,之前说好每隔几天更新一个的,虽然没什么人看,但是作为一个记录,回顾也是能有新的认识,这篇博客是讲的目前我在工作中使用的一个结束点,这个技术点目前网上资料少之甚少,也是希 ...
- 基于Python的数据分析(2):字符串编码
在上一篇文章<基于Python的数据分析(1):配置安装环境>中的第四个步骤中我们在python的启动步骤中强制要求加载sitecustomize.py文件并设置其默认编码为"u ...