three.js学习笔记
chenqiong1991
这个作者很懒,什么都没留下…
展开
-
我的threejs学习笔记(十)---平行光(二)
写在前面调整了光源的参数和位置后,阴影效果比较好。代码var d_light=new THREE.DirectionalLight(ambiColor);d_light.target=cube_2;d_light.castShadow=true;d_light.shadowCameraVisible=true;d_light.shadowCameraNear = 2;d_light.sha原创 2017-03-28 21:12:17 · 1672 阅读 · 0 评论 -
我的threejs学习笔记(一)
生成three.js场景的基本步骤一、引入jquery和threejs(注意顺序,jquery在后) 1. <script src="../three.js-master/build/three.js"></script> 2. <script src="../jquery/jquery.js"></script>二、内联css控制场景布满页面<style> body{原创 2017-03-12 11:04:51 · 1283 阅读 · 0 评论 -
我的threejs学习笔记(二)——dat.gui使用
写在前面dat.gui可以方便地向场景中添加控制条,随时调整参数。用法<script src="../../lib/dat.gui-master/build/dat.gui.js"></script> <link rel="stylesheet" href="../../lib/dat.gui-master/build/dat.gui.css"> 引入js文件和css文件var con原创 2017-03-20 20:22:20 · 6610 阅读 · 0 评论 -
我的threejs学习笔记(三)——相机旋转
写在前面虽然看起来好像是物体自身在旋转,但确实是相机在围绕场景旋转。 另外,用简单的三个变量实现了重力模拟。相机旋转方法 var theta=0; var render=function () { requestAnimationFrame(render); controls.speedY+=controls.gravity;原创 2017-03-21 21:18:12 · 13785 阅读 · 0 评论 -
我的threejs学习笔记(四)——dat.gui函数
写在前面dat.gui 不仅提供了参数的调节,还有类似于按钮的功能(即将其参数写为函数的形式),可以看作是gui对象的一个属性。定义按钮属性var controls=new function () { this.gravity=-0.005; this.speedY=0; this.posY=2; this.number原创 2017-03-22 22:17:53 · 2022 阅读 · 0 评论 -
我的threejs学习笔记(五)——点光源属性控制
写在前面主要练习了点光源的距离和密度属性。 理解了threejs里颜色使用的原理。代码pointLight.distance=controls.pointlight_distance; pointLight.intensity=controls.pointlight_intensity; distance(距离)控制光源的照射范围;intensity(密度)控制光源的强度。全文<!D原创 2017-03-23 21:14:24 · 3915 阅读 · 0 评论 -
我的threejs学习笔记(七)——spotLight
写在前面点光源(pointlight)的特点就像夜空中的烟雾弹,向四面八方发射光线;而聚光灯(spotlight)就像手电筒或者像舞台上的探照灯,效果是一个锥形的发光区域。相比于点光源,它有照射的近场区,远场区,和发散系数。点光源属性var spotLight=new THREE.SpotLight({color:"#f2f"}); spotLight.intensity=1; sp原创 2017-03-25 21:13:50 · 2117 阅读 · 0 评论 -
我的threejs学习笔记(八)——向场景添加颜色监听
写在前面这是几句纠结了半天的代码。源代码是addColor();我写的是add(),所以效果差很多。最后把源代码粘过来对比半天才发现这个差别。也是醉了。废话不说var controls=new function () { this.ambi_Color=ambiColor; }; var gui=new dat.GUI(); gui.addColor(cont原创 2017-03-26 21:37:06 · 3814 阅读 · 1 评论 -
我的threejs学习笔记(九)---平行光
写在前面今天没出作品。效果不太满意。明早还得早起。先睡吧。明天再仔细研究平行光。代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>平行光</title> <script src="../three.js-master/three.js"></script> <script s原创 2017-03-27 21:53:00 · 2194 阅读 · 1 评论 -
我的threejs学习笔记(六)——3D弹性球
写在前面之前用processing写过类似的弹性球。具体写法不难,主要是在IDE熟悉的基础上理解球坐标的原理。只需要两层for循环的嵌套即可完成主体部分。for嵌套for(var fi=0;fi<=Math.PI;fi+=Math.PI/10){ var count=10-3*Math.abs(Math.PI/2-fi); for(var theta=0;theta<原创 2017-03-24 21:55:09 · 1882 阅读 · 0 评论