推荐大家可以看看这个：http://wenku.baidu.com/link?url=RQU2exzV_EF3GATc3bzQU2o9LGMuCmiN5nUJth5SLG3E2TrxtBLQodJU_kZgfJjd9ljtR5XhZlHdzoHJ6kLeAF4uC9dttM1sNer60lg09gS对于初步了解是极好的了。

官网：https://threejs.org/

中文文档：http://techbrood.com/threejs/docs/

three.js核心对象： scene（场景）

　　　　　　　　　camera（相机）

　　　　　　　　　light（光源）

　　　　　　　　　mesh（模型）

　　　　　　　　　renderer（渲染器）

　　　　　　　　　render（渲染）

 <!DOCTYPE html>

 <html lang="en">

 <head>

     <meta charset="UTF-8">

     <title>Document</title>

     <script type="text/javascript" src="js/three.js"></script>

 </head>

 <body>

     <script type="text/javascript">

         var scene = new THREE.Scene();

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

         var material = new THREE.MeshLambertMaterial({color:0xff0000});

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

         scene.add(mesh);

         var light = new THREE.PointLight({color:0xffffff});

         light.position.set(300,400,200);

         scene.add(light);

         var camera = new THREE.PerspectiveCamera(40,800/600,1,1000);

         camera.position.set(200,200,200);

         camera.lookAt(scene.position);

         var renderer = new THREE.WebGLRenderer();

         renderer.setSize(800,600);

         document.body.appendChild(renderer.domElement);

         renderer.render(scene,camera);

     </script>

 </body>

 </html>

最后的效果如图所示

Three.js 入门指南(核心对象)的更多相关文章

  1. d3.js 入门指南

    说到数据可视化,我们会行到很多优秀的框架,像echarts.highcharts,这些框架很优雅,健壮,能满足我们对可视化的大部分需求,但是缺点也很明显,就是这些框架几乎是不可定制化的,当遇到特殊的需 ...

  2. 《Three.js 入门指南》3.1.2 - 一份整齐的代码结构以及使用ORBIT CONTROLS插件（轨道控制）实现模型控制

    3.1.2 正式代码结构 & ORBIT CONTROLS插件(轨道控制) 说明 本节内容属于插入节,<Three.js入门指南>这本书中,只是简单的介绍了一些概念,是一本基础的入 ...

  3. JS入门之ActiveXObject对象（转载）

    JS入门之ActiveXObject对象   此对象提供自动化对象的接口.   function ActiveXObject(ProgID : String [, location : String] ...

  4. d3.js 入门指南 - 仪表盘

    D3的全称是Data-Driven Documents(数据驱动的文档),是一个用来做数据可视化的JavaScript函数库,而JavaScript文件的后缀通常为.js,所以D3被称为D3.js. ...

  5. 《Three.js 入门指南》3.0 - 代码构建的最基本结构。

    3.0 代码构建的最基本结构 说明: 我们必需首先知道,Three.js 的一些入门级概念: 我们需要知道,OpenGL 是一套三维实现的标准,为什么说是标准,因为它是跨平台,跨语言的.甚至CAD以及 ...

  6. 《Three.js 入门指南》0 - 说明

    本笔记,摘自:<Three.js 入门指南>一书 地址链接为:https://www.ituring.com.cn/book/miniarticle/58552 本书的前言摘录: 本书结构 ...

  7. Vue.js 入门指南之“前传”（含sublime text 3 配置）

    题记:关注Vue.js 很久了,但就是没有动手写过一行代码,今天准备入手,却发现自己比菜鸟还菜,于是四方寻找大牛指点,才终于找到了入门的“入门”,就算是“入门指南”的“前传”吧.此文献给跟我一样“白痴 ...

  8. 系列博文-Three.js入门指南(张雯莉)-静态demo和three.js功能概览

    一:一个最简单的静态DEMO //body加载完后触发init() //WebGL的渲染是需要HTML5 Canvas元素的,你可以手动在HTML的<body>部分中定义Canvas元素, ...

  9. 《Three.js 入门指南》1.3 - Three JS 功能预览

    [部分中英文对照] Cameras(照相机,控制投影方式) Camera OrthographicCamera 正交相机 PerspectiveCamera 透视相机 Core(核心对象) Buffe ...

随机推荐

  1. android/java 根据当前时间判断股票交易状态(未开盘 交易中 休市中 已收盘)

    /** * @param data yyyy-MM-dd HH:mm:ss 时间 * @return 未开盘 交易中 休市中 已收盘 */ public static String getSotckS ...

  2. Utility1：Overview

    Utility 是利用,使用的意思,utilization是指使用效率,利用率的意思. SQL Sever 内置 Utility Feature,便于集中监控Server关键资源(CPU和Disk)的 ...

  3. CSS系列：CSS文字样式

    1. 设置字体 在CSS中字体通过font-family属性来设置. font-family: Verdana, Arial, Helvetica, sans-serif; 上面的字体设置告诉浏览器首 ...

  4. 吐槽：基于PhoneGap开发移动项目

    目前,随着Google的Android手机和苹果的iphone手机的逐渐普及,越来越多开发者加入到移动应用开发的大军当中.其中,Android应用是基于Java语言基础上进行开发的,而苹果公司的iph ...

  5. JAVA基础代码分享--学生成绩管理

    问题描述: 从键盘读入学生成绩,找出最高分,并输出学生成绩等级. 成绩>=最高分-10  等级为’A’   成绩>=最高分-20  等级为’B’ 成绩>=最高分-30  等级为’C’ ...

  6. 创建第二个 local network - 每天5分钟玩转 OpenStack（84）

    GUI 中有两个地方可以创建 network: 1. Project -> Network -> Networks 这是普通用户在自己的 tenant 中创建 network 的地方. 2 ...

  7. T-SQL：毕业生出门需知系列（三）

    第3课 排序检索数据 3.1 排序数据(ORDER BY) 下面的 SQL 语句返回某个数据库表的单个列.观察其输出,并没有特定的顺序. SELECT prod_name FROM Products; ...

  8. Coreseek Windows下安装调试

    由于项目需要全文检索,后面就去网上查了下资料,找到了Sphinx[中文是狮身人面像]这个全文检索引擎,听说挺好用的,不过没有中文分词.后面又去找了一下,找到了Coreseek,一款中文全文检索/搜索软 ...

  9. Myeclipse无法开启Servers视图解决办法

    IDE报错如下:  解决办法:1.首先关闭MyEclipse工作空间. 2.然后删除工作空间下的 “/.metadata/.plugins/org.eclipse.core.runtime/.sett ...

  10. 关于JavaScript预编译和执行顺序以及函数引用类型的思考

    昨晚在对项目中的一部分做模块化处理的时候,遇到了一个问题,一个重新定义的function对一个通用类中的function进行赋值覆盖的时候,失败了.问题抽象出来是这样的: <script > ...