DirectionalLight

参数

属性

示例：昼夜两套光照

// 白天：偏暖的主光，方向从左上后方压下来
var dayLight = new deck.DirectionalLight({
  color: [255, 246, 224],
  intensity: 2.2,
  direction: [-3, -9, -1]
});

// 傍晚：低角度、偏橙，长阴影
var duskLight = new deck.DirectionalLight({
  color: [255, 170, 96],
  intensity: 1.6,
  direction: [-8, -3, -2]
});

var lightingEffect = new deck.LightingEffect({
  ambientLight: new deck.AmbientLight({ intensity: 0.9 }),
  directionalLights: [dayLight]
});

function switchToDusk() {
  lightingEffect.directionalLights = [duskLight];
  deckgl.setProps({
    effects: [lightingEffect],
    layers: deckgl.props.layers.map(function (l) { return l.clone({}); })
  });
}

direction 的方向约定

direction 表示光线从哪里射向哪里，不是光源的位置。 [-3, -9, -1] 表示光沿 X 负方向、Y 负方向、Z 负方向传播， 在实际地图坐标里对应「太阳在右上方、光线往左下打」。 把 Y 改成正值，明暗面会整体翻到另一侧。

需要与时间关联时，按太阳高度角与方位角算出单位向量再赋值即可， 不必自己写整套光照模型：

function sunDirection(hour) {
  var angle = (hour / 24) * Math.PI * 2 - Math.PI / 2;
  return [
    Math.cos(angle) * 0.9,
    Math.sin(angle) * 0.9,
    -1.2
  ];
}

v9 的不可变更新

lightingEffect.directionalLights 可以整体替换，但图层实例不可变。 修改图层参数必须 clone 后交给 deckgl.setProps， 直接改图层上的属性不会生效。