perfect antialiasing

Antialiasing via une rasterisation conservatrice et un calcul des zones analytiques

Une nouvelle technique pour rendre des triangles 3D avec un anti-aliasing «parfait». Les polices et les vecteurs sont brisés en triangles et rasterisés de manière conservatrice, puis un shader de fragment détermine la couverture de la zone du triangle pour calculer l'alpha pour chaque fragment.

Processus

Rendu GPU des graphiques vectoriels à une précision sous-pixel:

1. Trianguler les courbes en triangles
2. Rendez chaque triangle en utilisant une rasterisation conservatrice
3. Pour chaque fragment:
   1. Effectuer une intersection triangulaire / boîte, créant un polygone
   2. Résumer les zones des triangles dans le polygone
   3. Divisez la somme par la zone des fragments pour donner une couverture en pourcentage
   4. Continuez pour tous les triangles, mélange additivement

Prévisualisation

Démos

Visitez https://andrewlowndes.github.io/perfect-antialiasing/dist/ pour voir un ensemble de démos montrant les différentes techniques utilisées dans ce référentiel.

Courir

1. Assurez-vous que NodeJS est installé
2. Exécutez npm i pour installer les dépendances
3. Exécutez npm start pour ouvrir les démos dans une application Web

Feuille de route

• Démo CPU (toile)
  • Tesselation de Bezier cube / quadratique
  • Trianguler le chemin des polygones
  • Rasterisation conservatrice
  • Test SVG
  • Logique cellulaire
  • Rendu de police personnalisé
• Webgl
  • Rasterisation conservatrice (décalage basé sur les shadder de vertex)
  • Rendu de police personnalisé
  • Triangle 3D
  • Scène 3D
  • Tesselation de l'espace d'écran
  • Instance
  • Test de performance
• Vulkan
  • Tesselation de l'espace d'écran via le shader de géométrie
  • Rasterisation conservatrice en utilisant des extensions de GPU
  • Instance
  • Test de performance
• Expériences supplémentaires
  • Analyse de couverture de la courbe exacte
    • Bezier quadratique
    • Cubic Bezier (Prob trop compliqué)

Usages

• Anti-aliasing dans les jeux (besoin d'évaluer les frais généraux de la rasterisation conservatrice et le calcul alpha dans le shader de fragment)
• Rendu de police (s'appuie toujours sur la triangulation - utilisez l'espace d'écran dans Tesselation Shader pour le rendu indépendant de la résolution)

Développement

Installer vs code et les extensions suivantes:

• EditorConfig pour le code vs
• Eslint
• Plus joli

Références

Rasterisation conservatrice basée sur Vertex Basé sur l'algorithme 2 de GPU GEMS 2 Chapitre 43 (https://developer.nvidia.com/gpugems/gpugems2/part-v-image-orient--compting/chapter-42-conservative-rasterisation)