Three.js 入门指南(核心对象)
推荐大家可以看看这个: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 入门指南(核心对象)的更多相关文章
- d3.js 入门指南
说到数据可视化,我们会行到很多优秀的框架,像echarts.highcharts,这些框架很优雅,健壮,能满足我们对可视化的大部分需求,但是缺点也很明显,就是这些框架几乎是不可定制化的,当遇到特殊的需 ...
- 《Three.js 入门指南》3.1.2 - 一份整齐的代码结构以及使用ORBIT CONTROLS插件(轨道控制)实现模型控制
3.1.2 正式代码结构 & ORBIT CONTROLS插件(轨道控制) 说明 本节内容属于插入节,<Three.js入门指南>这本书中,只是简单的介绍了一些概念,是一本基础的入 ...
- JS入门之ActiveXObject对象(转载)
JS入门之ActiveXObject对象 此对象提供自动化对象的接口. function ActiveXObject(ProgID : String [, location : String] ...
- d3.js 入门指南 - 仪表盘
D3的全称是Data-Driven Documents(数据驱动的文档),是一个用来做数据可视化的JavaScript函数库,而JavaScript文件的后缀通常为.js,所以D3被称为D3.js. ...
- 《Three.js 入门指南》3.0 - 代码构建的最基本结构。
3.0 代码构建的最基本结构 说明: 我们必需首先知道,Three.js 的一些入门级概念: 我们需要知道,OpenGL 是一套三维实现的标准,为什么说是标准,因为它是跨平台,跨语言的.甚至CAD以及 ...
- 《Three.js 入门指南》0 - 说明
本笔记,摘自:<Three.js 入门指南>一书 地址链接为:https://www.ituring.com.cn/book/miniarticle/58552 本书的前言摘录: 本书结构 ...
- Vue.js 入门指南之“前传”(含sublime text 3 配置)
题记:关注Vue.js 很久了,但就是没有动手写过一行代码,今天准备入手,却发现自己比菜鸟还菜,于是四方寻找大牛指点,才终于找到了入门的“入门”,就算是“入门指南”的“前传”吧.此文献给跟我一样“白痴 ...
- 系列博文-Three.js入门指南(张雯莉)-静态demo和three.js功能概览
一:一个最简单的静态DEMO //body加载完后触发init() //WebGL的渲染是需要HTML5 Canvas元素的,你可以手动在HTML的<body>部分中定义Canvas元素, ...
- 《Three.js 入门指南》1.3 - Three JS 功能预览
[部分中英文对照] Cameras(照相机,控制投影方式) Camera OrthographicCamera 正交相机 PerspectiveCamera 透视相机 Core(核心对象) Buffe ...
随机推荐
- Atitit 教育与培训学校 的计划策划 v4 qc18
Atitit 教育与培训学校 的计划策划 v4 qc18 1.1. 版本历史12. 教育历史的前世今生12.1. 自学vs 家庭学校vs 私立学校vs 公立学校模式 vs 企业内部学校 vs 其他商业 ...
- Cookie与Session
再说Cookie与Session之前,先要了解一下http协议. 何为http协议: http协议即超文本传输协议,一种基于浏览器请求与服务器响应的协议,该协议主要的特点就是它是一种无状态的协议(只针 ...
- ATM模拟器(附代码及运行结果)
源代码: import java.util.Scanner; class Account{ String identify; String name; String date; String key; ...
- 读书笔记-you-don't-konw-js
第一部分:作用域和闭包 不要满足于只是让代码正常工作,而是弄清楚为什么是这样 作用域是什么 定义的变量存储在哪里?程序是如何找到变量的?实现的 规则就是作用域 传统编译语言执行前的编译三步骤(p5) ...
- c#属性中的get和set属性
get是给属性赋值,set是取属性的值. get.set用法: 一是隐藏组件或类内部的真是成员: 二是用来建立约束的,比如,实现“有我没你”这种约束: 三是用来响应属性变化事件,当属性变化是做某事,只 ...
- Event的Propagate
SSIS Package的Executable存在层次结构,例如Package位于层次结构的最顶层,Root Level:Container是其中包含的Executable(Task 或 Contai ...
- C#设计模式系列:单一职责原则(Single Responsibility Principle)
1.单一职责原则的核心思想 一个类应该有且只有一个变化的原因. 2.为什么要引入单一职责原则 单一职责原则将不同的职责分离到单独的类,每一个职责都是一个变化的中心.当需求变化时,这个变化将通过更改职责 ...
- jQuery 2.0.3 源码分析 事件体系结构
那么jQuery事件处理机制能帮我们处理那些问题? 毋容置疑首先要解决浏览器事件兼容问题 可以在一个事件类型上添加多个事件处理函数,可以一次添加多个事件类型的事件处理函数 提供了常用事件的便捷方法 支 ...
- ReceiveQueue
using System; using System.Collections.Generic; using System.Linq; using System.Text; namespace NetF ...
- Java设计模式之工厂模式(Factory)
前言: 前面学习了建造者设计模式,接下来学习一下Retrofit中使用的另外一个设计模式,工厂设计模式!!!里面采用工厂模式使得数据转换得到完全解耦,工厂模式的好处用到了极致,如此好的设计模式我们怎能 ...