Three.js - MeshPhongMaterial 用于光亮表面的材质

该材料使用非基于物理的Blinn-Phong模型来计算反射系数。与在MeshLambertMaterial中使用的Lambertian模型不同,它可以模拟带有高光的闪亮表面(如漆木)。
示例:https://ithanmang.gitee.io/threejs/home/201808/20180807/02-meshPhongMaterial.html

属性
名称 描述
color 材料的颜色,默认为白色
emissive 材质本身发出的颜色,不受其它光照影响,默认为黑色
shininess 光滑度,指定高光部分的亮度,默认值为30
specular 材料高光部分的颜色,默认值为0x111111深灰色,如果把它的颜色设置为跟color颜色一样的话,会得到类似金属一样的材质,设置成灰色,则看起来更像塑料
示例代码
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>MeshPhongMaterial 用于光亮表面的材质</title>
    <style>
        body {
   
            margin: 0;
            overflow: hidden; /*溢出隐藏*/
        }
    </style>
    <script src="../../libs/build/three-r93.min.js"></script>
    <script src="../../libs/examples/js/controls/OrbitControls.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/Detector.js"></script>
</head>
<body>
<script>

    let stats = initStats();
    let scene, camera, renderer, controls, guiControls;
    let directionalLightHelper;

    // 场景
    function initScene() {
   

        scene = new THREE.Scene();
        scene.background = new THREE.Color(0xB0E2FF);
        scene.fog = new THREE.Fog(scene.background, 1, 5000);
    }

    // 相机
    function initCamera() {
   

        camera = new THREE.PerspectiveCamera(45, window.innerWidth / window.innerHeight, 0.1, 5000);
        camera.position.set(0, 0, 250);
        camera.lookAt(new THREE.Vector3(0, 0, 0));

    }

    // 渲染器
    function initRenderer() {
   

        renderer = new THREE.WebGLRenderer({
   antialias
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值