【Three.js(r74)】テクスチャを読み込み画質を変更したい
2016年2月24日Three.js(r74)のスフィアに360°のテクスチャを貼り付けることをしたかった。
テクスチャは貼り付けられたけど、重なるピクセルの調整などの設定がわからなかった。
デフォルトがかなりももやっとした感じで気に入らなかった。
texture.minFilter = LinearMipMapNearestFilter;//デフォルト texture.minFilter = THREE.LinearFilter; texture.minFilter = THREE.NearestMipMapLinearFilter texture.minFilter = THREE.NearestMipMapNearestFilter
※デフォルト間違ってました。。。LinearMipMapNearestFilterでした。ご指摘ありがとうございます。
<参考>
http://threejs.org/docs/#Reference/Textures/Texture
こんな感じでFilterがあったのでメモ。
サンプルコード
var tlloader = new THREE.TextureLoader(); var _src = 'imageUrl.png'; tlloader.load( //イメージ画像URL _src, function(texture){ //geo生成 var geometry = new THREE.SphereGeometry(100, 60, 40); //material生成 var material = new THREE.MeshBasicMaterial({ map: texture, side:THREE.FrontSide }); group.add(mesh); //テクスチャレンダリング具合 texture.minFilter = THREE.LinearFilter; });
ぼやき
3Dの知識がないからSphereGeometryをどうすればいいか、とかとか結構悩む。
結果見えてればいいやぁってなるんだけど、それではダメだなと。
もっと勉強が必要。