threejs-lights

このスキルを使用するタイミング

ユーザーが次の内容に言及した場合は、必ずこのスキルを使用してください。

• castShadow / receiveShadow の有効化、シャドウマップのサイズ、バイアス、法線バイアス、シャドウキャスター用のカメラフラスタム
• 物理ベースのライト：強度、距離／減衰、スポットライトの角度／ペナンブラ、矩形エリアライトの設定
• 放射照度スタイルのプローブに使用する LightProbe、IES データを使用する IESSpotLight

重要：ライトとローダー、node-tsl の使い分け

トピック	スキル
ライトクラスとシャドウ	threejs-lights
IES/HDR ファイルの読み込み	threejs-loaders
LightNode / TSL ライティング	threejs-node-tsl

トリガーとなるフレーズの例：

• 「DirectionalLight」、「SpotLight」、「RectAreaLight」、「castShadow」、「shadow map」
• 「阴影」、「点光源」、「面光源」、「LightProbe」

このスキルの使い方

1. 基本レシピ：環境光／半球光で補い、指向性のある太陽光と局所的なポイントライト／スポットライトを組み合わせます。
2. シャドウ：レンダラーで有効にし、キャスター／レシーバーを指定します。マップサイズとパフォーマンスを調整し、バイアスを調節してシャドウアクネやピーター・パンニングを除去します。
3. RectArea：このライトタイプを使用する前に、ドキュメントに従ってアドオンライブラリを初期化します。
4. プローブ：プローブを配置し、該当する場合はアドオンのジェネレーターでデータを生成します。マテリアルの環境反射との関係については、threejs-materials と threejs-textures を参照してください。
5. IES：ローダースキルでプロファイルを読み込み、ドキュメントに従って IESSpotLight に設定します。
6. パフォーマンス：シャドウを投影するライトの数を抑えます。レイヤー（threejs-objects）を使ってオブジェクトを除外します。

examples/workflow-directional-shadow.md を参照してください。

ドキュメントマップ（公式）

ドキュメントのセクション	代表的なリンク
ライト	https://threejs.org/docs/Light.html
指向性ライト	https://threejs.org/docs/DirectionalLight.html
スポットライト	https://threejs.org/docs/SpotLight.html
矩形エリアライト	https://threejs.org/docs/RectAreaLight.html

対象範囲

• 対象範囲内： コアのライト、シャドウマップ、プローブ、矩形エリアライトおよびプローブ生成用の記載されたアドオン。
• 対象範囲外： CSM の詳しい理論（ユーザーが CSM の名前を挙げた場合は、アドオンの Csm ドキュメントを参照してください）、DCC でのベイク済みライトマップ。

よくある落とし穴とベストプラクティス

• シャドウマップの解像度はシーンのスケールに合わせる必要があります。巨大なワールドで小さなシャドウを使うと、ブロック状に見えます。
• ポイントライトのシャドウは6面分の処理が必要で、コストが高くなります。適切に使用してください。
• 必要なライブラリを読み込まずに RectAreaLight を使うと、シェーディングが黒くなったり不正になったりします。初期化を確認してください。
• threejs-renderers のトーンマッピングで、物理単位（強度と露出）が一致していないと、シーンが白飛びしたり暗くなったりします。
• シャドウの bias / normalBias には、シャドウアクネとピーター・パンニングのトレードオフがあります。ヘルパーフラスタム（threejs-helpers）を使って調整してください。

ドキュメントとバージョン

ライトとシャドウのクラスは、three.js docs の Lights にあります。RectAreaLight とプローブのアドオンは Addons → Lights からの追加の初期化が必要です。IES プロファイルでは、ライト API を使用する前にファイルを取得するため threejs-loaders が必要です。

エージェントの応答チェックリスト

このスキルに沿って回答する場合は、次の点を優先してください。

1. シャドウを有効にする場合は、具体的なライトタイプ（DirectionalLight、SpotLight など）とシャドウのドキュメントページへのリンクを記載します。
2. IES の読み込みは threejs-loaders に、LightNode に関するトピックは threejs-node-tsl に分けて案内します。
3. シャドウマップのサイズやバイアスについて、実践的な指針を示します。フラスタムの可視化には threejs-helpers を案内します。
4. ライトの castShadow とあわせて renderer.shadowMap.enabled にも触れます（threejs-renderers を参照）。
5. シャドウを投影するライトを複数使う場合のパフォーマンスコストについて説明します。

参考資料

• https://threejs.org/docs/#Lights
• https://threejs.org/docs/DirectionalLight.html
• https://threejs.org/docs/SpotLight.html
• https://threejs.org/docs/LightShadow.html

キーワード

英語： lights, shadows, directional, spotlight, rectarea, lightprobe, three.js

中文： 灯光、阴影、平行光、聚光灯、面光源、LightProbe、three.js