关于javascript:ThingJS提供灯光配置基础方法节省开发精力

27次阅读

共计 1371 个字符，预计需要花费 4 分钟才能阅读完成。

三维软件能够随便创立任何类型灯光的自由性，然而真切成果还是须要费一番功夫。ThingJS 提供灯光配置根底办法，节俭开发精力！
灯光有助于表白一种情感，或疏导观众的眼光看向具体的地位。灯光可能反映一种基调，对整个图像的外观至关重要。上面教你对于打灯光的技巧，以及轻便的开发方法。
ThingJS 提供一套操作简便的灯光配置项，只有配置完结后，记得点击生成代码块并执行，一套残缺的高级灯光效果就进去了。

主灯光对象是对主光源的控制代码，可设置的变量包含暗影、色彩、强度和打灯角度。主光源通常放在四分之三的地位上，地位是从物体的侧面转 45 度，并从中心线向上转 45 度。夜晚的场景很实用于繁多的主光源，没有其余的自然光，其余的中央黑得不见五指，这正合乎繁多条件的主光源成果。
### 环境光
在主灯光对象之前，还有对环境光、半球光照的配置。这两种光源均是人造漫反射的光线，在自然环境中这是一种天然的光洁，不至于让整个环境置于黑箱之中。环境光可能进步整个场景的亮度。半球光照顺便用来补充高空或修建角落里的光线，柔化暗影或缩小暗影区域，合乎物联网可视化场景的需要。

第二光源对象也须要设置具体的地位和发光对象的色彩，作为主光源的一种补充光源，感觉会更加真切。事实上，天然的光线很少只有一种光线照明，而是多种色彩的灯光组合，提供一种景深的感觉。
在 3DMAX 中打灯是一个简单的技巧，真正学会操作很费时间，相对来说 ThingJS 就轻量很多，通过提供场景灯光的配置选项，再生成代码块，不便开发人员迅速把握，档次成果更丰盛。
场景灯光通过 app.lighting 属性设置，难度一星，代码示例如下。

var app = new THING.App({url: 'https://www.thingjs.com/static/models/chinesehouse'});

app.on('load', function (ev) {app.camera.position = [18.217000353088125, 16.96513529990897, 11.90387798709408];
    app.camera.target = [-0.92, 2.1, 2.7];
})

// 环境光对象
var ambientLight = {
    intensity: 0.4,
    color: '#FFFFFF',
};
// 半球光照
var hemisphereLight = {
    intensity: 0.5,
    color: '#FFFFFF',
    groundColor: '#202020',
};
// 主灯光对象
var mainLight = {
    shadow: true,
    intensity: 0.6,
    color: '#FFFFFF',
    alpha: 120,
    beta: 0,
};
// 第二光源对象
var secondaryLight = {
    shadow: false,
    intensity: 0,
    color: '#FFFFFF',
    alpha: 0,
    beta: 0,
};
// 全局配置
var config = {
    ambientLight,
    hemisphereLight,
    mainLight,
    secondaryLight
}

new THING.widget.Button('调整场景灯光', function () {
    // 设置灯光
    app.lighting = config;
})

ThingJS 让物联网 3D 创业项目成功率更高！

正文完