หน้าแรก>แหล่งข้อมูลการสร้างเว็บไซต์>ดาวน์โหลดแบบอักษร
ดาวน์โหลด

การต่อต้านการใช้งานผ่านอนุรักษ์นิยม rasterisation และการคำนวณพื้นที่วิเคราะห์

เทคนิคใหม่สำหรับการแสดงผลรูปสามเหลี่ยม 3 มิติด้วยการต่อต้านการใช้นามแฝง 'สมบูรณ์แบบ' ฟอนต์และเวกเตอร์ถูกแบ่งออกเป็นสามเหลี่ยมและ rasterised อย่างอนุรักษ์นิยมจากนั้น shader ชิ้นส่วนจะกำหนดพื้นที่สามเหลี่ยมที่ครอบคลุมเพื่อคำนวณอัลฟาสำหรับแต่ละชิ้นส่วน

กระบวนการ

การแสดงผล GPU ของกราฟิกเวกเตอร์ที่ความแม่นยำพิกเซลย่อย:

  1. เส้นโค้งสามเหลี่ยมเป็นสามเหลี่ยม
  2. แสดงสามเหลี่ยมแต่ละสามเหลี่ยมโดยใช้อนุรักษ์นิยม rasterisation
  3. สำหรับแต่ละส่วน:
    1. ทำการแยกรูปสามเหลี่ยม/กล่องสร้างรูปหลายเหลี่ยม
    2. รวมพื้นที่ของสามเหลี่ยมในรูปหลายเหลี่ยม
    3. แบ่งผลรวมตามพื้นที่ส่วนเพื่อให้ความคุ้มครองเปอร์เซ็นต์
    4. ดำเนินการต่อสำหรับสามเหลี่ยมทั้งหมด

ดูตัวอย่าง

ดูตัวอย่าง

การสาธิต

เยี่ยมชม https://andrewlowndes.github.io/perfect-antialiasing/dist/ เพื่อดูชุดการสาธิตที่แสดงเทคนิคต่าง ๆ ที่ใช้ใน repo นี้

วิ่ง

  1. ตรวจสอบให้แน่ใจว่าติดตั้ง nodejs
  2. เรียกใช้ npm i เพื่อติดตั้งการพึ่งพา
  3. เรียกใช้ npm start เพื่อเปิดการสาธิตในเว็บแอป

แผนงาน

  • การสาธิต CPU (ผ้าใบ)
    • cubic/quadratic bezier tesselation
    • เส้นทางรูปสามเหลี่ยมสู่รูปหลายเหลี่ยม
    • อนุรักษ์นิยม Rasterisation
    • การทดสอบ SVG
    • ตรรกะของเซลล์
    • การแสดงผลแบบอักษรที่กำหนดเอง
  • webgl
    • Rasterisation อนุรักษ์นิยม (การเปลี่ยนแนวจุดสุดยอด)
    • การแสดงผลแบบอักษรที่กำหนดเอง
    • 3D สามเหลี่ยม
    • ฉาก 3 มิติ
    • tesselation หน้าจอ
    • การติดอันดับ
    • การทดสอบประสิทธิภาพ
  • Vulkan
    • tesselation หน้าจอพื้นที่ผ่านเรขาคณิต Shader
    • อนุรักษ์นิยม Rasterisation โดยใช้ส่วนขยาย GPU
    • การติดอันดับ
    • การทดสอบประสิทธิภาพ
  • การทดลองเพิ่มเติม
    • การวิเคราะห์ความครอบคลุมของเส้นโค้งที่แน่นอน
      • กำลังสอง bezier
      • Cubic Bezier (Prob ซับซ้อนเกินไป)

การใช้งาน

  • การต่อต้านการใช้นามแฝงในเกม (จำเป็นต้องประเมินค่าใช้จ่ายของ Rasterisation อนุรักษ์นิยมและการคำนวณอัลฟ่าใน Fragment Shader)
  • การเรนเดอร์แบบอักษร (ยังคงอาศัยการวิเคราะห์ - ใช้พื้นที่หน้าจอใน tesselation shader สำหรับความละเอียดการแสดงผลอิสระ)

การพัฒนา

ติดตั้งรหัส VS และส่วนขยายต่อไปนี้:

  • EditorConfig สำหรับรหัส VS
  • eslint
  • สวยกว่า

การอ้างอิง

Rasterisation อนุรักษ์นิยมตามจุดสุดยอดตามอัลกอริทึม 2 จาก GPU Gems 2 บทที่ 43 (https://developer.nvidia.com/gpugems/gpugems2/part-v-image-oriented-computing/chapter-42-conservative

ขยาย
ข้อมูลเพิ่มเติม
แอปที่เกี่ยวข้อง
แนะนำสำหรับคุณ
ข้อมูลที่เกี่ยวข้อง ทั้งหมด