Three.js - PointLight 光源

最新推荐文章于 2024-07-27 12:18:54 发布

「已注销」

最新推荐文章于 2024-07-27 12:18:54 发布

阅读量4.7k

点赞数

分类专栏： threejs

本文链接：https://blog.csdn.net/ithanmang/article/details/80998743

版权

本文介绍了 Three.js 中的 PointLight 光源，它模拟了如灯泡般向四周均匀照射的光效。PointLight 包括构造函数、参数设置、属性和方法，能够产生阴影。通过示例代码和在线浏览地址，读者可以直观理解 PointLight 的工作原理和使用方式。

摘要由CSDN通过智能技术生成

PointLight 点光源，照射所有方向的光源，例如灯泡发出的光，可以投射阴影。
示例浏览地址：https://ithanmang.gitee.io/threejs/home/201807/20180711/01-pointLight.html

构造函数

PointLight( color : Integer, intensity : Float, distance : Number, decay : Float )

参数

color：光源的颜色
intensity：光源的强度
distance：光的照射距离
decay：光的衰减指数

属性

.decay : Float：光源的衰减指数
.distance : Float：光的照射距离
.isPointLight : Boolean：判断是否是点光源
.power : Float：光照强度，power = intensity * 4π
.shadow : LightShadow：阴影

方法

.copy ( source : PointLight ) : PointLight：把所有的属性复制到光源

效果

这里写图片描述

示例代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>点光源</title>
    <style>
        body {
   
            margin: 0;
            overflow: hidden;
        }
    </style>
    <script src="../../libs/build/three.js"></script>
    <script src="../../libs/examples/js/loaders/OBJLoader.js"></script>
    <script src="../../libs/examples/js/loaders/MTLLoader.js"></script>

    <script src="../../libs/examples/js/libs/dat.gui.min.js"></script>
    <script src="../../libs/examples/js/libs/stats.min.js"></script>
    <script src="../../libs/examples/js/controls/TrackballControls.js"></script>
    <script src="../../libs/examples/js/Detector.js"></script>

    <script src="../../libs/extend/THREEx.WindowResize.js"></script>
</head>
<body>
<div id="WebGL-output"></div>
<div id="Stats-output"></div>

<script>

    let stats = initStats();

    let scene, camera, renderer, controls, gui;
    let lights = [];
    let clock = new THREE.Clock();

    function

最低0.47元/天解锁文章

「已注销」

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
Three.js - PointLight 光源

PointLight 点光源，照射所有方向的光源，例如灯泡发出的光，可以投射阴影。示例浏览地址：http://ithanmang.com/threejshome/pointLight.html构造函数PointLight( color : Integer, intensity : Float, distance : Number, decay : Float )参数co...
复制链接

扫一扫

专栏目录