019-各种灯光和常用helper(一)

该系类文章主要用于记录学习three.js的过程,包括做的一些demo,笔记,以及个人思考;主要学习的课程是 神光的小册《three.js通关秘籍》,感兴趣的可以购买学习,质量还是可以的

DirectionalLight平行灯

说明

光线是平行的,一般用来实现太阳光,太阳光从很远的地方射过来,可以理解为就是平行光

用法和效果

ini 复制代码
const light = new THREE.DirectionalLight(0xffffff);
light.position.set(400, 500, 300);
light.lookAt(0, 0, 0);

PointLight 点光源

说明

从一个发射出来的光,类似于灯泡的灯光

用法和效果

ini 复制代码
const light = new THREE.PointLight(0xffffff, 1000000);
light.position.set(400, 500, 300);
light.lookAt(0, 0, 0);

AmbientLight 环境光

说明

均匀照射到物体上,用来照亮整个场景

用法和效果

ini 复制代码
const ambientLight = new THREE.AmbientLight(0xffffff);
mesh.add(ambientLight);

SpotLight 聚光灯

说明

比较聚拢的灯光,类似于手电筒的灯光效果,或则舞台的灯光效果

用法和效果

ini 复制代码
const light = new THREE.SpotLight(0xffffff, 1000000);
light.distance = 1000;
light.angle = Math.PI / 6;
light.position.set(400, 500, 300);
light.lookAt(0, 0, 0);
相关推荐
专注API从业者4 小时前
Python + 淘宝 API 开发:自动化采集商品数据的完整流程
大数据·运维·前端·数据挖掘·自动化
烛阴5 小时前
TypeScript高手密技:解密类型断言、非空断言与 `const` 断言
前端·javascript·typescript
样子20186 小时前
Uniapp 之renderjs解决swiper+多个video卡顿问题
前端·javascript·css·uni-app·html
Nicholas686 小时前
flutterAppBar之SystemUiOverlayStyle源码解析(一)
前端
黑客飓风6 小时前
JavaScript 性能优化实战大纲
前端·javascript·性能优化
emojiwoo7 小时前
【前端基础知识系列六】React 项目基本框架及常见文件夹作用总结(图文版)
前端·react.js·前端框架
张人玉8 小时前
XML 序列化与操作详解笔记
xml·前端·笔记
杨荧8 小时前
基于Python的宠物服务管理系统 Python+Django+Vue.js
大数据·前端·vue.js·爬虫·python·信息可视化
YeeWang9 小时前
🎉 Eficy 让你的 Cherry Studio 直接生成可预览的 React 页面
前端·javascript
gnip9 小时前
Jenkins部署前端项目实战方案
前端·javascript·架构