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 相关文章推荐
javascript 打印内容方法小结
Nov 04 Javascript
两个select多选模式的选项相互移动(示例代码)
Jan 11 Javascript
jQuery将多条数据插入模态框的示例代码
Sep 25 Javascript
jQuery模拟新浪微博首页滚动效果的方法
Mar 11 Javascript
简述Jquery与DOM对象
Jul 10 Javascript
浅谈JavaScript 的执行顺序
Aug 07 Javascript
jQuery实现伪分页的方法分享
Feb 17 Javascript
微信小程序 loading(加载中提示框)实例
Oct 28 Javascript
JavaScript实现的选择排序算法实例分析
Apr 14 Javascript
vue 添加vux的代码讲解
Nov 30 Javascript
vue watch监听对象及对应值的变化详解
Feb 24 Javascript
idea编译器vue缩进报错问题场景分析
Jul 04 Vue.js
浅谈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
世界咖啡生产者论坛呼吁:需要立即就咖啡价格采取认真行动
2021/03/06 咖啡文化
PHP令牌 Token改进版
2008/07/18 PHP
php数组比较实现查找连续数的方法
2015/07/29 PHP
PHP定时任务获取微信access_token的方法
2016/10/10 PHP
php中序列化与反序列化详解
2017/02/13 PHP
Yii2中hasOne、hasMany及多对多关联查询的用法详解
2017/02/15 PHP
基于jQuery的获得各种控件Value的方法
2010/11/19 Javascript
javascript数组快速打乱重排的方法
2014/01/02 Javascript
js中把JSON字符串转换成JSON对象最好的方法
2014/03/21 Javascript
初识Node.js
2014/09/03 Javascript
EasyUI中datagrid在ie下reload失败解决方案
2015/03/09 Javascript
angular之ng-template模板加载
2017/11/09 Javascript
使用selenium抓取淘宝的商品信息实例
2018/02/06 Javascript
微信实现自动跳转到用其他浏览器打开指定APP下载
2019/02/15 Javascript
Vue.js组件使用props传递数据的方法
2019/10/19 Javascript
微信小程序自定义模态弹窗组件详解
2019/12/24 Javascript
原生javascript的ajax请求及后台PHP响应操作示例
2020/02/24 Javascript
layui使用及简单的三级联动实现教程
2020/12/01 Javascript
[46:58]完美世界DOTA2联赛PWL S3 Forest vs LBZS 第一场 12.17
2020/12/19 DOTA
Python中利用sorted()函数排序的简单教程
2015/04/27 Python
python实现用户登陆邮件通知的方法
2015/07/09 Python
python字符类型的一些方法小结
2016/05/16 Python
解决python3 urllib中urlopen报错的问题
2017/03/25 Python
Python md5与sha1加密算法用法分析
2017/07/14 Python
python利用微信公众号实现报警功能
2018/06/10 Python
为何人工智能(AI)首选Python?读完这篇文章你就知道了(推荐)
2019/04/06 Python
Python3 tkinter 实现文件读取及保存功能
2019/09/12 Python
如何基于Python制作有道翻译小工具
2019/12/16 Python
Python类如何定义私有变量
2020/02/03 Python
HTML5离线应用与客户端存储的实现
2018/05/03 HTML / CSS
中学教师自我鉴定
2014/02/07 职场文书
科技馆观后感
2015/06/08 职场文书
2016学习医德医风心得体会
2016/01/25 职场文书
初中运动会闭幕词范本3篇
2019/12/09 职场文书
Java面试题冲刺第十六天--消息队列
2021/08/07 面试题
python实现商品进销存管理系统
2022/05/30 Python