three.js 之旅 (二)
three.js中各种场景的使用方法:
当然首先要先引入three.js库;其次,手动定义一个 canvas 标签。
<script type="text/javascript" src="../bower_components/three/three.js"></script>
<canvas id="test1" width="400" height="300"></canvas>
1. 创建渲染器renderer:
var renderer = new THREE.WebGLRenderer({
canvas:document.getElementById("test1")
});
renderer.setClearColor('#000');
2. 创建场景:
var scene = new THREE.Scene(); 3. 创建照相机
(创建透视照相机):
var camera = new THREE.PerspectiveCamera(45,4/3,0.1,6000); camera.position.set(0,0,8);
scene.add(camera);
(创建正交照相机):
var camera = new THREE.OrthographicCamera(-2,2,1.5,-1.5,1,10);
camera.position.set(4,3,5);
camera.lookAt(scene.position);
4.创建模型:
var cube = new THREE.Mesh(new THREE.CubeGeometry(1,2,3),
new THREE.MeshBasicMaterial({
color :'#ccc',
wireframe:true
})
);
5.将创建的对象添加到场景中:
scene.add(cube);
renderer.render(scene,camera);
three.js 之旅 (二)的更多相关文章
- 【高德地图API】从零开始学高德JS API(二)地图控件与插件——测距、圆形编辑器、鼠标工具、地图类型切换、鹰眼鱼骨
原文:[高德地图API]从零开始学高德JS API(二)地图控件与插件——测距.圆形编辑器.鼠标工具.地图类型切换.鹰眼鱼骨 摘要:无论是控件还是插件,都是在一级API接口的基础上,进行二次开发,封装 ...
- qrcode.js 动态生成二维码
用qrcode.js动态生成二维码图片非常简单,只需要引入qrcode.js即可使用,而且可以自定义图片大小.背景色等信息. 1.jsp代码---页面头部引入qrcode.js,jquery文件可选 ...
- node.js 初学(二)—— 搭建注册/登录服务器
node.js 初学(二)—— 搭建注册/登录服务器 理论上来说,代码实现在理论和实际上是一样的.但实际上来说,他们不是 做一个最简单的用户注册登录功能 1.接口定义: 注册:/user?act=re ...
- js生成简单二维码
js文件下载地址:https://download.csdn.net/download/weixin_38296752/10554485 一.引入qrcode.js文件 <script type ...
- 进击Node.js基础(二)
一.一个牛逼闪闪的知识点Promise npm install bluebird 二.Promise实例 ball.html <!doctype> <!DOCTYPE html> ...
- js生成中文二维码
http://www.cnblogs.com/xcsn/archive/2013/08/14/3258035.html http://www.jb51.net/article/64928.htm 使用 ...
- Cordova app 检查更新 ----JS进行调用(二)
原文:Cordova app 检查更新 ----JS进行调用(二) 1.获取版本号 需要添加 插件 cordova plugin add https://github.com/whiteoctober ...
- Hammer.js分析(二)——manager.js
“Manager”是所有识别器实例的容器,它为你设置的元素安装了交互事件监听器,并设置了触摸事件特性. manager.js中的代码会涉及到input.js和recoginzer.js中的内容,这里会 ...
- js基础练习二之简易日历
今天学到了js基础教程3,昨天的课后练习还没来的及做,这个是类似简易日历的小案例,视频还没听完,今晚继续...... 先看效果图: 其实做过前面的Tab选项卡,这个就很好理解了,通过鼠标放在不同月份月 ...
随机推荐
- Windows自带的驱动程序例子都在哪里?
MSDN官方说明:https://msdn.microsoft.com/windows/hardware/drivers/samples/index 各个操作系统驱动例子: Windows10 :h ...
- xml 解析
例:解析以下片段 <font> <name>Helvetica</name> <size units="pt">36</siz ...
- Java操作SFTP
import java.util.Properties; import org.slf4j.Logger; import org.slf4j.LoggerFactory; import com.jcr ...
- iOS多线程编程之Grand Central Dispatch(GCD)介绍和使用
http://blog.csdn.net/totogo2010/article/details/8016129 GCD很好的博文
- 关于javascript tween的学后小感想
今天决定了解一下tween算法,首先得下载个tween.js看看吧,好吧,有点被惊艳到了. 也让我想起了之前上数学课时,听到过的一句话:“数学世界是神秘.纯洁.有魅力的”,一直 记得这句话,期待有朝一 ...
- selenium2 WebDriver 在asp.net项目中的应用
selenium2 WebDriver是一款跨平台的 自动化测试工具,它可以操纵浏览器,模拟用户行为,非常方便用户进行自动化测试. .net项目使用它,首先要通过 Visual Studio 的 nu ...
- sed 命令及shell的if语句的运用实例
if [ -f /etc/syslog.conf ]; #判断文件是否存在thensystest=`sed -n '/^auth.info/p' /etc/syslog.conf`; ...
- WCF大文件传输
WCF传输文件的时候可以设置每次文件的传输大小,如果是小文件的时候,可以很方便的将文件传递到服务端,但是如果文件比较大的话,就不可取了 遇到大文件的话可以采取分段传输的方式进行文件传输 思路: 1.客 ...
- js实现判断浏览器版本
//判断浏览器版本是否过低 var ua = navigator.userAgent.toLowerCase(); if (window.ActiveXObject) var IEversion = ...
- thinkphp实现单图片上传
$config=array( 'maxSize' => 3145728, 'savePath' => './Public/Uploads/', 'rootPath' => './', ...