perfect antialiasing

Antialiasing durch konservative Rasterisierung und Analyseberechnung

Eine neue Technik zur Wiedergabe von 3D-Dreiecken mit 'perfektem' Anti-Aliasing. Schriftarten und Vektoren werden in Dreiecke unterteilt und konservativ rasterisiert, dann bestimmt ein Fragment -Shader die Abdeckung der Dreieckfläche, um das Alpha für jedes Fragment zu berechnen.

Verfahren

GPU-Rendering von Vektorgrafiken in einer Subpixelgenauigkeit:

1. Triangulate Kurven zu Dreiecken
2. Rendern Sie jedes Dreieck mit konservativer Rasterisierung
3. Für jedes Fragment:
   1. Führen Sie eine Dreieck/Box -Kreuzung durch und erstellen Sie ein Polygon
   2. Fassen Sie die Bereiche der Dreiecke im Polygon zusammen
   3. Teilen Sie die Summe durch die Fragmentfläche, um eine prozentuale Abdeckung zu ermöglichen
   4. Fahren Sie für alle Dreiecke fort, additiv mischen

Vorschau

Demos

Besuchen Sie https://andrewlowndes.github.io/perfect-antialiasing/dist/, um eine Reihe von Demos anzuzeigen, die die verschiedenen in diesem Repo verwendeten Techniken zeigen.

Laufen

1. Stellen Sie sicher, dass die Nodejs installiert sind
2. Führen Sie npm i aus, um Abhängigkeiten zu installieren
3. Führen Sie npm start um die Demos in einer Web -App zu öffnen

Roadmap

• CPU -Demo (Leinwand)
  • Kubik-/quadratische Bezier -Tesselation
  • Triangulatweg zu Polygonen
  • Konservative Rasterisierung
  • SVG -Test
  • Zelllogik
  • Benutzerdefinierte Schriftart
• Webgl
  • Konservative Rasterisierung (Verschiebung auf der Basis von Scheitelpunkten)
  • Benutzerdefinierte Schriftart
  • 3D -Dreieck
  • 3D -Szene
  • Tesselation von Screen-Space
  • Instanz
  • Leistungstest
• Vulkan
  • Bildschirm-Raum-Tesselation über Geometrie-Shader
  • Konservative Rasterisierung unter Verwendung von GPU -Erweiterungen
  • Instanz
  • Leistungstest
• Weitere Experimente
  • Genaue Kurvenabdeckungsanalyse
    • Quadratische Bezier
    • Kubikbezier (wahrscheinlich zu kompliziert)

Verwendungen

• Anti-Aliasing in Spielen (müssen den Overhead der konservativen Rasterisierung und die Alpha-Berechnung im Fragment-Shader bewerten)
• Schriftart der Schriftart (stützt sich noch auf Triangulation - Verwenden Sie den Bildschirmraum im Tesselation Shader für die Auflösung unabhängiger Rendering)

Entwicklung

Installieren Sie gegen Code und die folgenden Erweiterungen:

• EditorConfig für VS -Code
• Eslint
• Hübscher

Referenzen

Vertex-basierte konservative Rasterisierung basierend auf Algorithmus 2 aus GPU-Gems 2 Kapitel 43 (https://developer.nvidia.com/gpugems/gpugems2/part-v-image-oriented-computing/chapter-42-conservative-rasterization)