Three.js如何实现雾化效果示例代码


Posted in Javascript onSeptember 27, 2017

前言

本文主要给大家介绍了关于Three.js实现雾化效果的相关内容,分享出来供大家参考学习,下面话不多说了,来一起看看详细的介绍吧。

实现方法

如果使用three.js实现雾化效果很简单,只需要在给场景scene对象的fog属性添加值就好了,比如:

scene.fog = new THREE.Fog(0xffffff,100,120);

这样就给场景添加了雾化的效果,在实例化雾化的对象的时候,需要传三个值(雾的颜色,雾化开始的距离相机的位置,全雾化距离相机的位置)。

Three.js如何实现雾化效果示例代码

添加上了就会显示以上的效果,设置雾化的过程比较短,所以雾化的效果比较明显。

还有一个种是随着距离呈指数增长的雾化效果,只需要设置雾的颜色和浓度即可。如:

scene.fog = new THREE.FogExp2(0xffffff,0.02);

效果如下:

Three.js如何实现雾化效果示例代码

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家学习或者使用Three.js具有一定的参考学习价值,如果有疑问大家可以留言交流,谢谢大家对三水点靠木的支持。

Javascript 相关文章推荐
jquery获取选中的文本和值的方法
Jul 08 Javascript
AngularJS初始化过程分析(引导程序)
Dec 06 Javascript
jquery中实现时间戳与日期相互转换
Apr 12 Javascript
Jquery on方法绑定事件后执行多次的解决方法
Jun 02 Javascript
bootstrap select插件封装成Vue2.0组件
Apr 17 Javascript
vue2.0实现导航菜单切换效果
May 08 Javascript
JavaScript自执行函数和jQuery扩展方法详解
Oct 27 jQuery
vue+element-ui+ajax实现一个表格的实例
Mar 09 Javascript
node错误处理与日志记录的实现
Dec 24 Javascript
JavaScript中concat复制数组方法浅析
Jan 20 Javascript
vuecli项目构建SSR服务端渲染的实现
Oct 30 Javascript
JavaScript事件的委托(代理)的用法示例详解
Feb 18 Javascript
浅谈Angular4中常用管道
Sep 27 #Javascript
深入理解Vue.js源码之事件机制
Sep 27 #Javascript
js截取字符串功能的实现方法
Sep 27 #Javascript
详解node+express+ejs+bootstrap构建项目
Sep 27 #Javascript
Three.js基础学习之场景对象
Sep 27 #Javascript
vue父组件中获取子组件中的数据(实例讲解)
Sep 27 #Javascript
Web开发使用Angular实现用户密码强度判别的方法
Sep 27 #Javascript
You might like
Apache, PHP在Windows 9x/NT下的安装与配置 (一)
2006/10/09 PHP
也谈php网站在线人数统计
2008/04/09 PHP
php+html5使用FormData对象提交表单及上传图片的方法
2015/02/11 PHP
4种PHP异步执行的常用方式
2015/12/24 PHP
PHP7 mongoDB扩展使用的方法分享
2019/05/02 PHP
JavaScript TO HTML 转换
2006/06/26 Javascript
JavaScript Sort 表格排序
2009/10/31 Javascript
Extjs Gird 支持中文拼音排序实现代码
2013/04/15 Javascript
jQuery判断指定id的对象是否存在的方法
2015/05/22 Javascript
JavaScript中的boolean布尔值使用学习及相关技巧讲解
2016/05/26 Javascript
jQuery 自定义下拉框(DropDown)附源码下载
2016/07/22 Javascript
jQuery中的100个技巧汇总
2016/12/15 Javascript
深入讲解xhr(XMLHttpRequest)/jsonp请求之abort
2017/07/26 Javascript
使用JavaScript保存文本文件到本地的两种方法
2019/01/22 Javascript
使用javascript做时间倒数读秒功能的实例
2019/01/23 Javascript
ElementUI Tree 树形控件的使用并给节点添加图标
2020/02/27 Javascript
vue 百度地图(vue-baidu-map)绘制方向箭头折线实例代码详解
2020/04/28 Javascript
Node.js API详解之 dgram模块用法实例分析
2020/06/05 Javascript
[01:01:29]2018DOTA2亚洲邀请赛 4.4 淘汰赛 VP vs Liquid 第一场
2018/04/05 DOTA
python访问mysql数据库的实现方法(2则示例)
2016/01/06 Python
详解python 字符串和日期之间转换 StringAndDate
2017/05/04 Python
Python编写登陆接口的方法
2017/07/10 Python
python实现QQ邮箱/163邮箱的邮件发送
2019/01/22 Python
如何基于Python实现自动扫雷
2020/01/06 Python
Pytorch 实现sobel算子的卷积操作详解
2020/01/10 Python
python实现自动打卡的示例代码
2020/10/10 Python
Python常用外部指令执行代码实例
2020/11/05 Python
将n个数按输入顺序的逆序排列,用函数实现
2012/11/14 面试题
String s = new String(“xyz”);创建了几个String Object?
2015/08/05 面试题
轻化专业学生实习自我鉴定
2013/09/20 职场文书
大学生思想汇报范文
2013/12/31 职场文书
教师个人自我评价范文
2014/04/13 职场文书
文明礼貌演讲稿
2014/05/12 职场文书
新员工入职欢迎词
2015/01/23 职场文书
Mybatis是这样防止sql注入的
2021/12/06 Java/Android
Redis调用Lua脚本及使用场景快速掌握
2022/03/16 Redis