テクスチャのつなぎ目が汚く見える

[kazusoga]

VroidHubのこちらのモデルをダウンロードし、
https://c8fbws.csb.app/
にてアップロードすると表示されますが、
縮小すると、テクスチャのつなぎ目部分が薄黒くなってしまいます。

VroidHubではこのようにはなりません。
なぜこのようなことが起こるのでしょうか？
また、どのように解決したら良いでしょうか？

コードはこちらから見れます。
https://codesandbox.io/s/index-html-forked-c8fbws?file=/index.html

[0b5vr]

縮小時にテクスチャのミップマップが有効になっていると推測されます。
縮小時のミップマップの利用についての設定は、VRMファイル内（より正確には、glTFのフィールド内）で指定されるため、この挙動は本来モデル側の仕様です。
https://registry.khronos.org/glTF/specs/2.0/glTF-2.0.html#_filtering

VRoid Hubの挙動に関して言えば、現状のVRoid Hubではパフォーマンスの関係上ミップマップが有効化されないため、このケースの場合は逆に正常に表示されてしまっています。

[kazusoga]

返信誠にありがとうございます！！

ミップマップとは、縮小時に元より小さなサイズの画像を描画に用いることで、描画されたテクスチャの品質を上げて綺麗に見せるためのものであるという認識です（素人の認識なので、間違いがあればご指摘いただきたいです 🙇🏻‍♂️。またなぜそれで綺麗になるかも理解できておりません）。
もしそうであれば、本来のミップマップの目的とは真逆の結果になっている（表示が汚くなっている）理由は何でしょうか？

ちなみにVroiHubでは、ミップマップを有効にするとメモリ消費が増えてしまうため、ブラウザが重くなりアニメーションがカクつく、という理由からミップマップを無効にしているのでしょうか？

[0b5vr]

ミップマップが解決しようとしている課題は、高解像度のテクスチャを縮小したときに発生するチラつきのようなアーティファクトで、このようなアーティファクトはジャギーと呼ばれます。
これを解決するため、テクスチャをあらかじめ縮小しておいたものを用意し、描画時にテクスチャが貼り付けられる面が小さい場合にその縮小したテクスチャを代わりに利用する、というのがミップマップの手法です。
また、物体が十分に遠い場合には、参照すべきミップマップの解像度が小さくなることから、描画時のパフォーマンス向上も期待できます。

このミップマップに対する対処がされていないモデルの場合は、モデルを遠くに描画したときに今回のような滲みが発生してしまうことがあります。
具体的な例を挙げると、UVマップを行う際に、空間的に遠いメッシュに割り当てられる部分をUVマップ上で近くに配置していたり、メッシュの外側のテクセルまでテクスチャのエッジパディングがされていない場合などが挙げられると思います。

VRoid Hubでなぜミップマップが有効化されていないかについては、ピクシブとしてはお答えしかねます。

[kazusoga]

ありがとうございます！
少しイメージが湧いてきました。

ちなみに、もしミップマップを無効化していたとしても、
テクスチャにこちらの画像のような歪みが生じているとしたら、
原因としてはどんなものが考えられますでしょうか？

（拡大時にもハッキリと見えています。このような表示になるのは、元のファイルに対してゴニョゴニョといろんな処理を施した時なので、それのどこかに原因があるかなと考えていますが、ここでは、一般的に、このような事象に対して、ミップマップ以外の原因が知られていたりするのか、が知りたいです🙇🏻‍♂️）

チラッとこんな記事を見つけたのですが、
こちらの記述などは関係していそうでしょうか、、？
https://learn.microsoft.com/ja-jp/windows/win32/direct3d9/directly-mapping-texels-to-pixels#:~:text=%E3%81%9D%E3%81%86%E3%81%97%E3%81%AA%E3%81%84%E3%81%A8%E3%80%81%E3%83%86%E3%82%AF%E3%82%B9%E3%83%81%E3%83%A3%E3%81%AE%E6%AD%AA%E3%81%BF%E3%81%8C%E7%99%BA%E7%94%9F%E3%81%99%E3%82%8B%E5%8F%AF%E8%83%BD%E6%80%A7%E3%81%8C%E3%81%82%E3%82%8A%E3%81%BE%E3%81%99%E3%80%82

質問のスコープ外でしたら申し訳ございません！

[0b5vr]

ミップマップが生成されていない場合においても、テクスチャのエッジパディングが適切にされていないモデルの場合は、テクスチャの解像度をアプリケーションで調整している場合などにテクスチャのアーティファクトが発生する可能性はあります。