3D モデルを表示する際、特定のオブジェクトを強調して表示したい時があります。このような際、カスタムシェーダーを使用せずに強調表現する簡単な方法をご紹介しておきたいと思います。
最も簡単な方法は、「選択表示」(英語名:Isolate)機能です。

オブジェクトを選択して「選択表示」を実行すると、周囲のオブジェクトが非表示になって指定したオブジェクトのみが表示されるようになります。

もし、周囲の状態も同時に把握したい場合には、Viewer 設定から「ゴースト非表示オブジェクト」を オン にすると、非表示になったオブジェクトが半透明に表示されるようになります。

「選択表示」は、Viewer API でも isolate() メソッドで同様の効果を自動化することが可能です。また、「ゴースト非表示オブジェクト」は setGhosting() メソッドでコントロールすることが可能です。ただし、残念ながら、透過度や色は指定することは出来ません。

オブジェクトの背後にある別のオブジェクトを透過的に協調したいなら、選択表示を利用する方法もあります。
通常、オブジェクトの選択は対象が選択できるよう手前に表示されている際におこないます。この選択動作は、select() メソッドでコントロールすることが出来るので、dbId が分かっていれば、マウス操作でオブジェクトをクリックしなくても、オブジェクトを選択状態にすることが出来ます。

オブジェクトの選択色は、setSelectionColor() メソッドで変更することも出来るので、適宜、目立った色合いを指定が可能です。例えば、NOP_VIEWER.setSelectionColor(new THREE.Color(0xff0000)) のように指定すると、赤い選択色で選択が表現されるようになります。

select() メソッドで選択状態を表現した場合、[ESC] キーで選択状態が解除されてしまいます。選択状態にしなくても対象オブジェクトの色や透過度を指定したい場合には、setThemingColor() メソッドでオブジェクト色をオーバーライドすると、選択状態の如何にかかわらず、同色で表示を維持することも出来ます。
なお、setThemingColor() メソッドでオブジェクト色をオーバーライドした場合には、透過的にオブジェクトを表示する効果が得られません。また、「部屋」のような空間は表現出来ないため、周囲の面が指定色でオブジェクトが持つマテリアルとのブレンド色で表現されます。例えば、上図にある ”LDK 303” の部屋を NOP_VIEWER.setThemingColor(idArray[0], new THREE.Vector4(1, 0, 0, 1)) のように指定すると、周囲の壁が赤いブレンド色で表現されるようになります。

setThemingColor() メソッドで設定したブレンド色は、clearThemingColors() が呼び出されるまで維持されます。
By Toshiaki Isezaki

Leave a Reply