Three.js: PunkteMaterialgrößendämpfung scheint FOV . nicht zu berücksichtigen

Erstellt am 7. Sept. 2017 · 3Kommentare · Quelle: mrdoob/three.js

Ich verwende PerspectiveCamera und ein Modell mit einigen Punkten mit einem PointsMaterial. Ich verwende eine angepasste Version von OrbitControls.js, um die Anzeige eines großen und komplexen Modells zu ermöglichen. Eine der Änderungen besteht darin, dass die Zoomfunktion das Sichtfeld der Kamera ändert, anstatt sie näher zu bewegen. Die Kamera bewegt sich, um einen bestimmten Teil der Modelle anzuzeigen. Mir ist aufgefallen, dass die PointsMaterial-Dämpfung die Größe ändert, wenn sich die Kamera dem Modell nähert, aber nicht, wenn das Sichtfeld geändert wird.

Ich gehe davon aus, dass der Größenalgorithmus die Entfernung zur Kamera verwendet, aber nicht das FOV? Ich habe noch nie in diesem Repo gepostet, also entschuldige mich, wenn ich etwas verpasse. Ich habe versucht, mit dem IE zu testen, kann die Seite jedoch im Moment nicht laden. Ebenso bin ich mir nicht sicher, um welche Version von Three es sich handelt, aber innerhalb des letzten Jahres.

Code, der das PointsMaterial erstellt:

var texFlame = new THREE.TextureLoader().load("textures/flame.png");
mtlFlame = new THREE.PointsMaterial ({size: 2, sizeAttenuation: true, color: 0xffffff, transparent: true,  blending: THREE.AdditiveBlending, depthWrite: false, map: texFlame});

Der Code, der das Sichtfeld ändert, ist ähnlich wenig aufregend:

this.camera.fov = fov;
this.camera.updateProjectionMatrix ();

Three.js-Version

[ ] Dev
[ ] r87
[x] ...

Browser

[ ] Alle von ihnen
[x] Chrome
[x] Firefox
[ ] Internet Explorer

Betriebssystem

[ ] Alle von ihnen
[x] Fenster
[ ] Mac OS
[ ] Linux
[ ] Android
[ ] iOS

Hardwareanforderungen (Grafikkarte, VR-Gerät, ...)

Ich weiß nicht, ob dies hardwarespezifisch ist, aber es scheint unwahrscheinlich. Ich verwende GeForce GTX950 unter Windows 10.

Question

Quelle

orangebowlerhat

Alle 3 Kommentare

PointsMaterial.size hat Pixeleinheiten – keine Welteinheiten. Sie müssen die Größe selbst anpassen.

Dieser verwandte Beitrag kann informativ sein: https://github.com/mrdoob/three.js/issues/10385#issuecomment -267789138.

Beachten Sie, dass gl_PointSize möglicherweise begrenzt ist, sodass die von Ihnen angeforderte Größe möglicherweise nicht der Größe entspricht, die Sie erhalten.

WestLangley am 7. Sept. 2017

👍1

@WestLangley. Ich muss also die Größeneigenschaft von PointsMaterial ändern, wenn ich das FOV ändere?

Ich habe diesen Beitrag gefunden, bevor ich gefragt habe, aber ich verstehe nicht ganz, warum es so funktioniert. Ich verstehe, dass die Größe in Pixeln angegeben ist, aber die Dämpfung macht es bereits nicht zu Gerätepixeln und dieser Prozess muss sich sicherlich auf die Perspektive beziehen, die sich in gewisser Weise auf das Sichtfeld beziehen muss?

Aber das erklärt nur mein eigenes Unverständnis. Ich bin mit deiner Lösung vollkommen zufrieden. Vielen Dank.

orangebowlerhat am 7. Sept. 2017

Ich gehe davon aus, dass PointsMaterial.size Pixeleinheiten verbleiben wird, daher werde ich diese Problemumgehung hier als Referenz veröffentlichen.

Basierend auf dieser Stapelüberlauf-Antwort können Sie Ihre Punkte mit dem folgenden Muster skalieren, das für vernünftige Werte von camera.fov funktionieren sollte.

var defaultSize = 10;
points.material.size = defaultSize / Math.tan( ( Math.PI / 180 ) * camera.fov / 2 );