Zeichne einen Kreis (nicht schattiert) mit Three.js

Three.js r50 hat CircleGeometry hinzugefügt. Es kann (wenn auch mit einem Gesicht) im WebGL Geometries-Beispiel gesehen werden.

Der erste Eckpunkt in der Geometrie wird in der Mitte des Kreises erstellt (in r84, siehe CircleGeometry.js Zeile 71 , in r65, siehe CircleGeometry.js Zeile 18 ), die geschickt ist, wenn Sie nach dem" vollen Pac-Man "oder" uninformativen Kreisdiagramm "suchen. Oh, und es scheint notwendig zu sein, wenn du irgendein Material neben LineBasicMaterial / LineDashedMaterial benutzen willst.

Ich habe überprüft, dass der folgende Code in beiden r60 & amp; r65:

PS: Die "Dokumente" enthalten jetzt ein schönes interaktives Beispiel CircleGeometry : Ссылка

Die API hat sich in neueren Versionen von threejs leicht geändert.

Ändern Sie segmentCount , um den Kreis glatter oder gezackter zu machen, je nach Ihrer Szene. 32 Segmente sind für kleine Kreise ziemlich glatt. Für Umlaufbahnen wie die auf der Website, die Sie verlinken, möchten Sie vielleicht ein paar hundert haben.

Ändern Sie die Reihenfolge der drei Komponenten im Konstruktor Vector3 , um die Ausrichtung des Kreises auszuwählen. Wie hier angegeben, wird der Kreis auf die x / y-Ebene ausgerichtet.

Ich habe Code verwendet, auf den Mr.doob in diesem Github-Beitrag verweist.

Dieses Beispiel finden Sie in der Three.js-Dokumentation:

Sehen Sie sich das three.js-Beispiel Ссылка an, um zu sehen, wie farbige Linien gezeichnet werden. p>

Ein Kreis wie der von Ihnen zitierte wird als eine große Anzahl von kleinen geraden Segmenten gezeichnet. (Tatsächlich können die, die Sie zeigen, Ellipsen sein)