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 之旅 (二)的更多相关文章

  1. 【高德地图API】从零开始学高德JS API(二)地图控件与插件——测距、圆形编辑器、鼠标工具、地图类型切换、鹰眼鱼骨

    原文:[高德地图API]从零开始学高德JS API(二)地图控件与插件——测距.圆形编辑器.鼠标工具.地图类型切换.鹰眼鱼骨 摘要:无论是控件还是插件,都是在一级API接口的基础上,进行二次开发,封装 ...

  2. qrcode.js 动态生成二维码

    用qrcode.js动态生成二维码图片非常简单,只需要引入qrcode.js即可使用,而且可以自定义图片大小.背景色等信息. 1.jsp代码---页面头部引入qrcode.js,jquery文件可选 ...

  3. node.js 初学(二)—— 搭建注册/登录服务器

    node.js 初学(二)—— 搭建注册/登录服务器 理论上来说,代码实现在理论和实际上是一样的.但实际上来说,他们不是 做一个最简单的用户注册登录功能 1.接口定义: 注册:/user?act=re ...

  4. js生成简单二维码

    js文件下载地址:https://download.csdn.net/download/weixin_38296752/10554485 一.引入qrcode.js文件 <script type ...

  5. 进击Node.js基础(二)

    一.一个牛逼闪闪的知识点Promise npm install bluebird 二.Promise实例 ball.html <!doctype> <!DOCTYPE html> ...

  6. js生成中文二维码

    http://www.cnblogs.com/xcsn/archive/2013/08/14/3258035.html http://www.jb51.net/article/64928.htm 使用 ...

  7. Cordova app 检查更新 ----JS进行调用(二)

    原文:Cordova app 检查更新 ----JS进行调用(二) 1.获取版本号 需要添加 插件 cordova plugin add https://github.com/whiteoctober ...

  8. Hammer.js分析(二)——manager.js

    “Manager”是所有识别器实例的容器,它为你设置的元素安装了交互事件监听器,并设置了触摸事件特性. manager.js中的代码会涉及到input.js和recoginzer.js中的内容,这里会 ...

  9. js基础练习二之简易日历

    今天学到了js基础教程3,昨天的课后练习还没来的及做,这个是类似简易日历的小案例,视频还没听完,今晚继续...... 先看效果图: 其实做过前面的Tab选项卡,这个就很好理解了,通过鼠标放在不同月份月 ...

随机推荐

  1. Windows自带的驱动程序例子都在哪里?

    MSDN官方说明:https://msdn.microsoft.com/windows/hardware/drivers/samples/index 各个操作系统驱动例子: Windows10  :h ...

  2. xml 解析

    例:解析以下片段 <font> <name>Helvetica</name> <size units="pt">36</siz ...

  3. Java操作SFTP

    import java.util.Properties; import org.slf4j.Logger; import org.slf4j.LoggerFactory; import com.jcr ...

  4. iOS多线程编程之Grand Central Dispatch(GCD)介绍和使用

    http://blog.csdn.net/totogo2010/article/details/8016129 GCD很好的博文

  5. 关于javascript tween的学后小感想

    今天决定了解一下tween算法,首先得下载个tween.js看看吧,好吧,有点被惊艳到了. 也让我想起了之前上数学课时,听到过的一句话:“数学世界是神秘.纯洁.有魅力的”,一直 记得这句话,期待有朝一 ...

  6. selenium2 WebDriver 在asp.net项目中的应用

    selenium2 WebDriver是一款跨平台的 自动化测试工具,它可以操纵浏览器,模拟用户行为,非常方便用户进行自动化测试. .net项目使用它,首先要通过 Visual Studio 的 nu ...

  7. sed 命令及shell的if语句的运用实例

    if [ -f /etc/syslog.conf ];     #判断文件是否存在thensystest=`sed -n  '/^auth.info/p' /etc/syslog.conf`;    ...

  8. WCF大文件传输

    WCF传输文件的时候可以设置每次文件的传输大小,如果是小文件的时候,可以很方便的将文件传递到服务端,但是如果文件比较大的话,就不可取了 遇到大文件的话可以采取分段传输的方式进行文件传输 思路: 1.客 ...

  9. js实现判断浏览器版本

    //判断浏览器版本是否过低 var ua = navigator.userAgent.toLowerCase(); if (window.ActiveXObject) var IEversion = ...

  10. thinkphp实现单图片上传

    $config=array( 'maxSize' => 3145728, 'savePath' => './Public/Uploads/', 'rootPath' => './', ...