推荐大家可以看看这个：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. Elasticsearch5.0 安装问题集锦

    使用Elasticsearch5.0 必须安装jdk1.8 [elsearch@vm-mysteel-dc-search01 bin]$ java -version java version &quo ...

  2. 手写原生ajax

    关于手写原生ajax重要不重要,各位道友自己揣摩吧, 本着学习才能进步,分享大家共同受益,自己也在自己博客里写一下 function createXMLHTTPRequest() { //1.创建XM ...

  3. C#设计模式-享元模式

    在软件开发过程,如果我们需要重复使用某个对象的时候,如果我们重复地使用new创建这个对象的话,这样我们在内存就需要多次地去申请内存空间了,这样可能会出现内存使用越来越多的情况,这样的问题是非常严重,然 ...

  4. JS中script词法分析

    核心:JS中的script是分段执行的. <script> var i = 10; </script> <script> alert(i); </script ...

  5. 手把手教你用nodejs+SQL Server2012做增删改查

    1.开发工具WebStorm 10.0.4 2.打开WebStorm 10.0.4新建项目:

  6. herbnate session.createSQLQuery(sql) 和 session.createQuery(sql)使用

    public class DistributeDao implements Serializable{ private SessionFactory sessionFactory; public Se ...

  7. SQL Server 隐式转换引发的躺枪死锁-程序员需知

    在SQL Server的应用开发过程(尤其是二次开发)中可能由于开发人员对表的结构不够了解,造成开发过程中使用了不合理的方式造成数据库引擎未按预定执行,以致影响业务.这是非常值得注意的.这次为大家介绍 ...

  8. js 把数字转成2 ,8,16进制的方法

    直接上代码 <!DOCTYPE html> <html> <body> <script> var myNumber = 128; document.wr ...

  9. Spring配置c3p0数据源时出错报:java.lang.NoClassDefFoundError: com/mchange/v2/ser/Indirector

    今天在使用Spring配置c3p0数据源时,使用的数据库是mysql,服务器是tomcat,运行时报了一个 java.lang.NoClassDefFoundError: com/mchange/v2 ...

  10. cordova加载层、进度条、文件选择插件

    在做cordova项目的时候,感觉应用的响应速度跟原生应用比相差甚远,一个主要问题就是如加载层.进度条等弹出对话框的效率不行.毕竟项目中的这些弹框都是用dom拼成的,dom的渲染效率和原生控件比起来慢 ...