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 相关文章推荐
window.onload 加载完毕的问题及解决方案(上)
Jul 09 Javascript
JavaScript 异步调用框架 (Part 4 - 链式调用)
Aug 04 Javascript
Javascript Global对象
Aug 13 Javascript
Javascript查询DBpedia小应用实例学习
Mar 07 Javascript
js实现在网页上简单显示时间的方法
Mar 02 Javascript
Jquery实现弹性滑块滑动选择数值插件
Aug 08 Javascript
动态创建按钮的JavaScript代码
Jan 29 Javascript
React中ES5与ES6写法的区别总结
Apr 21 Javascript
深入理解react-router@4.0 使用和源码解析
May 23 Javascript
JS之if语句对接事件动作逻辑(详解)
Jun 28 Javascript
微信小程序使用二次贝塞尔曲线画波浪
Dec 25 Javascript
微信小程序与公众号卡券/会员打通的问题
Jul 25 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
FCKeditor的安装(PHP)
2007/01/13 PHP
PHP HTML代码串 截取实现代码
2009/06/29 PHP
有关于PHP中常见数据类型的汇总分享
2014/01/06 PHP
php限制文件下载速度的代码
2015/10/20 PHP
深入理解PHP之OpCode原理详解
2016/06/01 PHP
php 使用mpdf实现指定字段配置字体样式的方法
2019/07/29 PHP
用javascript来实现动画导航效果的代码
2007/12/16 Javascript
如何在一个页面显示多个百度地图
2013/04/07 Javascript
js打造数组转json函数
2015/01/14 Javascript
使用NodeJs 开发微信公众号(三)微信事件交互实例
2016/03/02 NodeJs
jquery点击改变class并toggle的实现代码
2016/05/15 Javascript
jQuery下拉菜单的实现代码
2016/11/03 Javascript
jquery插件bootstrapValidator数据验证详解
2016/11/09 Javascript
jQuery实现加入收藏夹功能(主流浏览器兼职)
2016/12/24 Javascript
Angular.JS中的this指向详解
2017/05/17 Javascript
Angular实现响应式表单
2017/08/04 Javascript
vuex实现数据状态持久化
2019/11/11 Javascript
实例讲解React 组件
2020/07/07 Javascript
前端 javascript 实现文件下载的示例
2020/11/24 Javascript
布同 统计英文单词的个数的python代码
2011/03/13 Python
Python 处理数据的实例详解
2017/08/10 Python
Pytorch之view及view_as使用详解
2019/12/31 Python
Pytorch之finetune使用详解
2020/01/18 Python
opencv python如何实现图像二值化
2020/02/03 Python
html5唤醒APP小记
2019/03/27 HTML / CSS
美国领先的家庭健康检测试剂盒提供商:LetsGetChecked
2019/03/18 全球购物
Ramy Brook官网:美国现代女装品牌
2019/06/18 全球购物
Linux内核产生并发的原因
2016/11/08 面试题
建设工地安全标语
2014/06/07 职场文书
2014年医院后勤工作总结
2014/12/06 职场文书
小学教师先进事迹材料
2014/12/15 职场文书
2014年政工师工作总结
2014/12/18 职场文书
银行招聘自荐信
2015/03/06 职场文书
2015暑期工社会实践报告
2015/07/13 职场文书
导游词之澳门妈祖庙
2019/12/19 职场文书
MySQL 分区表中分区键为什么必须是主键的一部分
2022/03/17 MySQL