icon-attention デザイン新しくしました。

icon-calendar 2020年1月6日

【three.js】カメラが近づくとオブジェクトが描画されない場合の対処法

未分類

問題・現象

  • カメラが近づくとgltf等を読み込んだモデルが表示されない
  • scaleやrotationを変更しなければ正常に描写される
  • カメラのnear設定値の問題というわけではない

原因

  • モデル側に問題があります。(参考:http://kan-kikuchi.hatenablog.com/entry/UnityMaskMan_Massage)
  • scaleやrotation変更してもメッシュの描画判定は変更前の位置にあるため、
    カメラ位置を調節したときにモデルがカメラ範囲外となり描画されなくなります。
  • モデラーご本人あるいは連絡がつく場合は上記URLの方法で修正できるので、
    今回はscript側で無理やり何とかする方法を紹介します。

対処

  • メッシュの描画判定の範囲を大きくすることで対処します。
  • 以下の1行をレンダリング前に追加してください。([mesh]は環境に合わせて変更して下さい。)
[mesh].geometry.boundingSphere = 500
  • メッシュの描画範囲(球体)を半径500に設定しています。
  • これによりたとえカメラ外判定になったとしても描画され続けます。