three.js 一个页面可以存在多个render吗_Threejs 灯光?投影?? 有光的地方就会有影子...

本文介绍了three.js中的四种光源类型:环境光、点光源、平行光和聚光灯,以及如何在场景中创建阴影。通过设置平面接收阴影,并对物体进行阴影设置,实现了真实的光影效果。下篇将分享更多前端开发学习心得。
摘要由CSDN通过智能技术生成

69c888750461d865e02c215fde43e3f8.gif

灯光

threejs中光源有很多种,但是常见的光源只有4种:

1. 环境光(AmbientLight )

环境光会对场景中的所有物品进行颜色渲染,设置成白光可以清楚的显示场景内的所有物品,同时因为是对场景中所有物品进行无差别无死角渲染,自然就没有影子,也不存在渲染颜色差。

var ambient = new THREE.AmbientLight(0xffffff);scene.add(ambient); //将环境光添加到场景中// 参数详解// AmbientLight( color, intensity )// color — 光的颜色值,十六进制,默认值为0xffffff.// intensity — 光的强度,默认值为1.//可以设定0.5,2,10等数值,有着不同程度的强化或者弱化

2. 点光源(pointLight)

想象一下蜡烛,就能知道什么是点光源了,近处的光芒较亮,远处暗淡,照射不到的地方直接灰暗,照射范围是一个球形范围等等。

 var pointLight = new THREE.PointLight(0xffffff); pointLight.position
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值