WebGL షాడో మ్యాపింగ్: రియల్-టైమ్ రెండరింగ్ కోసం ఒక సమగ్ర గైడ్

3D కంప్యూటర్ గ్రాఫిక్స్ ప్రపంచంలో, వాస్తవికత మరియు లీనతకు నీడల కన్నా ఎక్కువ దోహదపడే అంశాలు కొన్ని మాత్రమే ఉంటాయి. అవి వస్తువుల మధ్య ప్రాదేశిక సంబంధాలు, కాంతి మూలాల స్థానం మరియు ఒక దృశ్యం యొక్క మొత్తం జ్యామితి గురించి కీలకమైన దృశ్య సూచనలను అందిస్తాయి. నీడలు లేకుండా, 3D ప్రపంచాలు చదునుగా, సంబంధం లేకుండా మరియు కృత్రిమంగా అనిపించవచ్చు. WebGL ద్వారా పనిచేసే వెబ్ ఆధారిత 3D అప్లికేషన్‌ల కోసం, అధిక-నాణ్యత, రియల్-టైమ్ నీడలను అమలు చేయడం ప్రొఫెషనల్-గ్రేడ్ అనుభవాలకు ఒక ముఖ్యమైన గుర్తు. ఈ గైడ్ దీనిని సాధించడానికి అత్యంత ప్రాథమిక మరియు విస్తృతంగా ఉపయోగించే టెక్నిక్ అయిన షాడో మ్యాపింగ్ గురించి లోతైన వివరణను అందిస్తుంది.

మీరు అనుభవజ్ఞుడైన గ్రాఫిక్స్ ప్రోగ్రామర్ అయినా లేదా మూడవ డైమెన్షన్‌లోకి ప్రవేశిస్తున్న వెబ్ డెవలపర్ అయినా, ఈ వ్యాసం మీ WebGL ప్రాజెక్ట్‌లలో రియల్-టైమ్ నీడలను అర్థం చేసుకోవడానికి, అమలు చేయడానికి మరియు సమస్యలను పరిష్కరించడానికి అవసరమైన జ్ఞానాన్ని మీకు అందిస్తుంది. మేము కోర్ థియరీ నుండి ప్రాక్టికల్ అమలు వివరాల వరకు ప్రయాణిస్తాము, సాధారణ ఆపదలను మరియు ఆధునిక గ్రాఫిక్స్ ఇంజిన్‌లలో ఉపయోగించే అధునాతన పద్ధతులను అన్వేషిస్తాము.

అధ్యాయం 1: షాడో మ్యాపింగ్ యొక్క ప్రాథమికాలు

దాని హృదయంలో, షాడో మ్యాపింగ్ అనేది ఒక తెలివైన మరియు సొగసైన టెక్నిక్, ఇది ఒక దృశ్యంలోని ఒక పాయింట్ నీడలో ఉందో లేదో ఒక సాధారణ ప్రశ్న అడగడం ద్వారా నిర్ణయిస్తుంది: "ఈ పాయింట్‌ను కాంతి మూలం చూడగలదా?" సమాధానం కాదు అయితే, దాని అర్థం ఏదో ఒకటి కాంతిని అడ్డుకుంటుంది, మరియు ఆ పాయింట్ తప్పనిసరిగా నీడలో ఉండాలి. ఈ ప్రశ్నకు ప్రోగ్రామాటిక్‌గా సమాధానం ఇవ్వడానికి, మేము రెండు-పాస్ రెండరింగ్ విధానాన్ని ఉపయోగిస్తాము.

షాడో మ్యాపింగ్ అంటే ఏమిటి? ముఖ్య భావన

మొత్తం టెక్నిక్ దృశ్యాన్ని రెండుసార్లు రెండర్ చేయడం చుట్టూ తిరుగుతుంది, ప్రతిసారీ వేరే దృష్టికోణం నుండి:

• పాస్ 1: డెప్త్ పాస్ (కాంతి యొక్క దృష్టికోణం). మొదట, మనం మొత్తం దృశ్యాన్ని కాంతి మూలం యొక్క ఖచ్చితమైన స్థానం మరియు దిశ నుండి రెండర్ చేస్తాము. అయితే, ఈ పాస్‌లో మనం రంగులు లేదా టెక్చర్‌ల గురించి పట్టించుకోము. మనకు అవసరమైన ఏకైక సమాచారం డెప్త్. రెండర్ చేయబడిన ప్రతి వస్తువు కోసం, కాంతి మూలం నుండి దాని దూరాన్ని మనం రికార్డ్ చేస్తాము. ఈ డెప్త్ విలువల సేకరణను షాడో మ్యాప్ లేదా డెప్త్ మ్యాప్ అనే ప్రత్యేక టెక్చర్‌లో నిల్వ చేస్తారు. ఈ మ్యాప్‌లోని ప్రతి పిక్సెల్ ఒక నిర్దిష్ట దిశలో కాంతి దృష్టికోణం నుండి దగ్గరగా ఉన్న వస్తువుకు దూరాన్ని సూచిస్తుంది.
• పాస్ 2: సీన్ పాస్ (కెమెరా యొక్క దృష్టికోణం). తరువాత, మనం సాధారణంగా చేసే విధంగా, ప్రధాన కెమెరా దృష్టికోణం నుండి దృశ్యాన్ని రెండర్ చేస్తాము. కానీ గీయబడుతున్న ప్రతి ఒక్క పిక్సెల్ కోసం, మనం ఒక అదనపు లెక్కింపును చేస్తాము. మనం ఆ పిక్సెల్ యొక్క స్థానాన్ని 3D స్పేస్‌లో నిర్ణయించి, ఆపై అడుగుతాము: "ఈ పాయింట్ కాంతి మూలం నుండి ఎంత దూరంలో ఉంది?" ఆ తరువాత మనం ఈ దూరాన్ని మన షాడో మ్యాప్‌లో (పాస్ 1 నుండి) సంబంధిత ప్రదేశంలో నిల్వ చేసిన విలువతో పోలుస్తాము.

తర్కం చాలా సులభం:

• ఒకవేళ పిక్సెల్ యొక్క ప్రస్తుత దూరం కాంతి నుండి, షాడో మ్యాప్‌లో నిల్వ చేసిన దూరం కంటే ఎక్కువగా ఉంటే, దాని అర్థం అదే దృష్టి రేఖ వెంట కాంతికి దగ్గరగా మరొక వస్తువు ఉందని. అందువల్ల, ప్రస్తుత పిక్సెల్ నీడలో ఉంది.
• ఒకవేళ పిక్సెల్ యొక్క దూరం, షాడో మ్యాప్‌లోని దూరం కంటే తక్కువగా లేదా సమానంగా ఉంటే, దాని అర్థం దాన్ని ఏదీ అడ్డుకోవడం లేదని, మరియు పిక్సెల్ పూర్తిగా ప్రకాశిస్తుంది.

దృశ్యాన్ని ఏర్పాటు చేయడం

WebGLలో షాడో మ్యాపింగ్‌ను అమలు చేయడానికి, మీకు అనేక కీలక భాగాలు అవసరం:

• ఒక కాంతి మూలం: ఇది డైరక్షనల్ లైట్ (సూర్యుడిలా), పాయింట్ లైట్ (లైట్‌బల్బ్ లాగా), లేదా స్పాట్‌లైట్ కావచ్చు. కాంతి రకం డెప్త్ పాస్ సమయంలో ఉపయోగించే ప్రొజెక్షన్ మ్యాట్రిక్స్ రకాన్ని నిర్ణయిస్తుంది.
• ఒక ఫ్రేమ్‌బఫర్ ఆబ్జెక్ట్ (FBO): WebGL సాధారణంగా స్క్రీన్ యొక్క డిఫాల్ట్ ఫ్రేమ్‌బఫర్‌కు రెండర్ చేస్తుంది. మన షాడో మ్యాప్‌ను సృష్టించడానికి, మనకు ఆఫ్-స్క్రీన్ రెండర్ టార్గెట్ అవసరం. ఒక FBO మనల్ని స్క్రీన్‌కు బదులుగా ఒక టెక్చర్‌లోకి రెండర్ చేయడానికి అనుమతిస్తుంది. మన FBO డెప్త్ టెక్చర్ అటాచ్‌మెంట్‌తో కాన్ఫిగర్ చేయబడుతుంది.
• రెండు సెట్ల షేడర్లు: మీకు డెప్త్ పాస్ కోసం ఒక షేడర్ ప్రోగ్రామ్ (చాలా సులభమైనది) మరియు ఫైనల్ సీన్ పాస్ కోసం మరొకటి (ఇది షాడో లెక్కింపు లాజిక్‌ను కలిగి ఉంటుంది) అవసరం.
• మ్యాట్రిక్స్‌లు: మీకు కెమెరా కోసం ప్రామాణిక మోడల్, వ్యూ మరియు ప్రొజెక్షన్ మ్యాట్రిక్స్‌లు అవసరం. ముఖ్యంగా, మీకు కాంతి మూలం కోసం ఒక వ్యూ మరియు ప్రొజెక్షన్ మ్యాట్రిక్స్ కూడా అవసరం, వీటిని తరచుగా ఒకే "లైట్ స్పేస్ మ్యాట్రిక్స్"లో కలుపుతారు.

అధ్యాయం 2: రెండు-పాస్ రెండరింగ్ పైప్‌లైన్ వివరంగా

మ్యాట్రిక్స్‌లు మరియు షేడర్‌ల పాత్రలపై దృష్టి పెడుతూ, రెండు రెండరింగ్ పాస్‌లను దశలవారీగా విశ్లేషిద్దాం.

పాస్ 1: డెప్త్ పాస్ (కాంతి యొక్క దృష్టికోణం నుండి)

ఈ పాస్ యొక్క లక్ష్యం మన డెప్త్ టెక్చర్‌ను నింపడం. ఇది ఎలా పనిచేస్తుందో ఇక్కడ ఉంది:

1. FBOను బైండ్ చేయండి: డ్రాయింగ్ చేయడానికి ముందు, మీరు WebGLకి మీ కస్టమ్ FBOకి రెండర్ చేయమని నిర్దేశిస్తారు, కాన్వాస్‌కు బదులుగా.
2. వ్యూపోర్ట్‌ను కాన్ఫిగర్ చేయండి: మీ షాడో మ్యాప్ టెక్చర్ పరిమాణానికి సరిపోయేలా వ్యూపోర్ట్ కొలతలను సెట్ చేయండి (ఉదా., 1024x1024 పిక్సెల్‌లు).
3. డెప్త్ బఫర్‌ను క్లియర్ చేయండి: రెండరింగ్ చేయడానికి ముందు FBO యొక్క డెప్త్ బఫర్ క్లియర్ చేయబడిందని నిర్ధారించుకోండి.
4. కాంతి యొక్క మ్యాట్రిక్స్‌లను సృష్టించండి:
   • లైట్ వ్యూ మ్యాట్రిక్స్: ఈ మ్యాట్రిక్స్ ప్రపంచాన్ని కాంతి దృష్టికోణంలోకి మారుస్తుంది. డైరక్షనల్ లైట్ కోసం, ఇది సాధారణంగా `lookAt` ఫంక్షన్‌తో సృష్టించబడుతుంది, ఇక్కడ "కన్ను" కాంతి యొక్క స్థానం మరియు "లక్ష్యం" అది చూపిస్తున్న దిశ.
   • లైట్ ప్రొజెక్షన్ మ్యాట్రిక్స్: సమాంతర కిరణాలు కలిగిన డైరక్షనల్ లైట్ కోసం, ఒక ఆర్థోగ్రాఫిక్ ప్రొజెక్షన్ ఉపయోగించబడుతుంది. పాయింట్ లైట్లు లేదా స్పాట్‌లైట్ల కోసం, ఒక పర్స్పెక్టివ్ ప్రొజెక్షన్ ఉపయోగించబడుతుంది. ఈ మ్యాట్రిక్స్ నీడలను వేసే స్పేస్‌లోని వాల్యూమ్‌ను (ఒక పెట్టె లేదా ఫ్రస్టమ్) నిర్వచిస్తుంది.
5. డెప్త్ షేడర్ ప్రోగ్రామ్‌ను ఉపయోగించండి: ఇది ఒక కనీస షేడర్. వెర్టెక్స్ షేడర్ యొక్క ఏకైక పని వెర్టెక్స్ పొజిషన్‌ను కాంతి యొక్క వ్యూ మరియు ప్రొజెక్షన్ మ్యాట్రిక్స్‌లతో గుణించడం. ఫ్రాగ్మెంట్ షేడర్ ఇంకా సరళమైనది: ఇది ఫ్రాగ్మెంట్ యొక్క డెప్త్ విలువను (దాని z-కోఆర్డినేట్) డెప్త్ టెక్చర్‌లోకి వ్రాస్తుంది. ఆధునిక WebGLలో, మీకు తరచుగా కస్టమ్ ఫ్రాగ్మెంట్ షేడర్ కూడా అవసరం లేదు, ఎందుకంటే FBO డెప్త్ బఫర్‌ను ఆటోమేటిక్‌గా క్యాప్చర్ చేయడానికి కాన్ఫిగర్ చేయవచ్చు.
6. దృశ్యాన్ని రెండర్ చేయండి: మీ దృశ్యంలోని అన్ని నీడ-వేసే వస్తువులను గీయండి. FBO ఇప్పుడు మన పూర్తి అయిన షాడో మ్యాప్‌ను కలిగి ఉంది.

పాస్ 2: సీన్ పాస్ (కెమెరా యొక్క దృష్టికోణం నుండి)

ఇప్పుడు మనం తుది చిత్రాన్ని రెండర్ చేస్తాము, నీడలను నిర్ణయించడానికి మనం vừa సృష్టించిన షాడో మ్యాప్‌ను ఉపయోగిస్తాము.

1. FBOను అన్‌బైండ్ చేయండి: డిఫాల్ట్ కాన్వాస్ ఫ్రేమ్‌బఫర్‌కు రెండరింగ్ చేయడానికి తిరిగి మారండి.
2. వ్యూపోర్ట్‌ను కాన్ఫిగర్ చేయండి: వ్యూపోర్ట్‌ను తిరిగి కాన్వాస్ కొలతలకు సెట్ చేయండి.
3. స్క్రీన్‌ను క్లియర్ చేయండి: కాన్వాస్ యొక్క రంగు మరియు డెప్త్ బఫర్‌లను క్లియర్ చేయండి.
4. సీన్ షేడర్ ప్రోగ్రామ్‌ను ఉపయోగించండి: ఇక్కడే మ్యాజిక్ జరుగుతుంది. ఈ షేడర్ మరింత సంక్లిష్టమైనది.
   • వెర్టెక్స్ షేడర్: ఈ షేడర్ రెండు పనులు చేయాలి. మొదట, ఇది కెమెరా యొక్క మోడల్, వ్యూ మరియు ప్రొజెక్షన్ మ్యాట్రిక్స్‌లను ఉపయోగించి తుది వెర్టెక్స్ పొజిషన్‌ను లెక్కిస్తుంది. రెండవది, ఇది పాస్ 1 నుండి లైట్ స్పేస్ మ్యాట్రిక్స్‌ను ఉపయోగించి కాంతి దృష్టికోణం నుండి వెర్టెక్స్ యొక్క స్థానాన్ని కూడా లెక్కించాలి. ఈ రెండవ కోఆర్డినేట్ ఫ్రాగ్మెంట్ షేడర్‌కు వేరియింగ్‌గా పంపబడుతుంది.
   • ఫ్రాగ్మెంట్ షేడర్: ఇది షాడో లాజిక్ యొక్క కోర్. ప్రతి ఫ్రాగ్మెంట్ కోసం:
     1. వెర్టెక్స్ షేడర్ నుండి లైట్ స్పేస్‌లో ఇంటర్‌పోలేట్ చేయబడిన స్థానాన్ని స్వీకరించండి.
     2. ఈ కోఆర్డినేట్‌పై ఒక పర్స్పెక్టివ్ డివైడ్ చేయండి (x, y, z ను w తో భాగించండి). ఇది దానిని నార్మలైజ్డ్ డివైస్ కోఆర్డినేట్స్ (NDC) లోకి మారుస్తుంది, -1 నుండి 1 వరకు ఉంటుంది.
     3. NDC ని టెక్చర్ కోఆర్డినేట్స్ లోకి మార్చండి (ఇవి 0 నుండి 1 వరకు ఉంటాయి) తద్వారా మనం మన షాడో మ్యాప్‌ను శాంపిల్ చేయవచ్చు. ఇది ఒక సాధారణ స్కేల్ మరియు బయాస్ ఆపరేషన్: `texCoord = ndc * 0.5 + 0.5;`.
     4. పాస్ 1 లో సృష్టించిన షాడో మ్యాప్ టెక్చర్‌ను శాంపిల్ చేయడానికి ఈ టెక్చర్ కోఆర్డినేట్స్ ఉపయోగించండి. ఇది మనకు `depthFromShadowMap` ఇస్తుంది.
     5. కాంతి యొక్క దృష్టికోణం నుండి ఫ్రాగ్మెంట్ యొక్క ప్రస్తుత డెప్త్, రూపాంతరం చెందిన లైట్ స్పేస్ కోఆర్డినేట్ నుండి దాని z-కాంపోనెంట్. దానిని `currentDepth` అని పిలుద్దాం.
     6. డెప్త్‌లను పోల్చండి: ఒకవేళ `currentDepth > depthFromShadowMap` అయితే, ఫ్రాగ్మెంట్ నీడలో ఉంది. మనం "షాడో ఆక్నే" అని పిలువబడే ఒక ఆర్టిఫ్యాక్ట్‌ను నివారించడానికి ఈ తనిఖీకి ఒక చిన్న బయాస్ జోడించాల్సి ఉంటుంది, దాని గురించి మనం తరువాత చర్చిస్తాము.
     7. పోలిక ఆధారంగా, ఒక షాడో ఫ్యాక్టర్‌ను నిర్ణయించండి (ఉదా., ప్రకాశవంతంగా ఉంటే 1.0, నీడలో ఉంటే 0.3).
     8. ఈ షాడో ఫ్యాక్టర్‌ను తుది రంగు లెక్కింపుకు వర్తించండి (ఉదా., యాంబియంట్ మరియు డిఫ్యూజ్ లైటింగ్ కాంపోనెంట్‌లను షాడో ఫ్యాక్టర్‌తో గుణించండి).
5. దృశ్యాన్ని రెండర్ చేయండి: దృశ్యంలోని అన్ని వస్తువులను గీయండి.

అధ్యాయం 3: సాధారణ సమస్యలు మరియు పరిష్కారాలు

ప్రాథమిక షాడో మ్యాపింగ్‌ను అమలు చేయడం వలన అనేక సాధారణ దృశ్య కళాఖండాలు త్వరగా బయటపడతాయి. అధిక-నాణ్యత ఫలితాలను సాధించడానికి వాటిని అర్థం చేసుకోవడం మరియు సరిచేయడం చాలా ముఖ్యం.

షాడో ఆక్నే (సెల్ఫ్-షాడోయింగ్ ఆర్టిఫ్యాక్ట్స్)

సమస్య: పూర్తిగా ప్రకాశవంతంగా ఉండాల్సిన ఉపరితలాలపై మీరు వింత, తప్పు నమూనాలలో ముదురు గీతలు లేదా మోయిర్ లాంటి నమూనాలను చూడవచ్చు. దీనిని "షాడో ఆక్నే" అంటారు. ఇది షాడో మ్యాప్‌లో నిల్వ చేయబడిన డెప్త్ విలువ మరియు సీన్ పాస్ సమయంలో లెక్కించిన డెప్త్ విలువ రెండూ ఒకే ఉపరితలం కోసం కావడం వలన జరుగుతుంది. ఫ్లోటింగ్-పాయింట్ దోషాలు మరియు షాడో మ్యాప్ యొక్క పరిమిత రిజల్యూషన్ కారణంగా, చిన్న పొరపాట్లు ఒక ఫ్రాగ్మెంట్ తప్పుగా తన వెనుక ఉందని నిర్ణయించడానికి కారణమవుతాయి, ఫలితంగా సెల్ఫ్-షాడోయింగ్ ఏర్పడుతుంది.

పరిష్కారం: డెప్త్ బయాస్. పోలికకు ముందు `currentDepth`కి ఒక చిన్న బయాస్‌ను ప్రవేశపెట్టడం సులభమైన పరిష్కారం. ఫ్రాగ్మెంట్‌ను వాస్తవానికి ఉన్నదానికంటే కొద్దిగా కాంతికి దగ్గరగా కనిపించేలా చేయడం ద్వారా, మనం దానిని దాని స్వంత నీడ నుండి "బయటకు" నెట్టుతాము.

float shadow = currentDepth > depthFromShadowMap + bias ? 0.3 : 1.0;

సరైన బయాస్ విలువను కనుగొనడం ఒక సున్నితమైన సమతుల్య చర్య. చాలా చిన్నదిగా ఉంటే, ఆక్నే అలాగే ఉంటుంది. చాలా పెద్దదిగా ఉంటే, మీకు తదుపరి సమస్య వస్తుంది.

పీటర్ పానింగ్

సమస్య: ఎగరగల మరియు తన నీడను కోల్పోయిన పాత్ర పేరు పెట్టబడిన ఈ ఆర్టిఫ్యాక్ట్, ఒక వస్తువు మరియు దాని నీడ మధ్య కనిపించే గ్యాప్‌గా వ్యక్తమవుతుంది. ఇది వస్తువులు తేలుతున్నట్లుగా లేదా అవి విశ్రాంతి తీసుకోవలసిన ఉపరితలాల నుండి డిస్‌కనెక్ట్ అయినట్లుగా కనిపింపజేస్తుంది. ఇది చాలా పెద్ద డెప్త్ బయాస్‌ను ఉపయోగించడం యొక్క ప్రత్యక్ష ఫలితం.

పరిష్కారం: స్లోప్-స్కేల్ డెప్త్ బయాస్. ఒక స్థిరమైన బయాస్ కంటే మరింత బలమైన పరిష్కారం, బయాస్‌ను కాంతికి సంబంధించి ఉపరితలం యొక్క ఏటవాలుతనంపై ఆధారపడేలా చేయడం. ఏటవాలుగా ఉన్న పాలిగాన్‌లు ఆక్నేకు ఎక్కువగా గురవుతాయి మరియు పెద్ద బయాస్ అవసరం. చదునుగా ఉన్న పాలిగాన్‌లకు చిన్న బయాస్ అవసరం. WebGLతో సహా చాలా గ్రాఫిక్స్ APIలు, డెప్త్ పాస్ సమయంలో ఈ రకమైన బయాస్‌ను స్వయంచాలకంగా వర్తింపజేయడానికి కార్యాచరణను అందిస్తాయి, ఇది సాధారణంగా ఫ్రాగ్మెంట్ షేడర్‌లో మాన్యువల్ బయాస్ కంటే ఉత్తమం.

పర్స్పెక్టివ్ అలియాసింగ్ (జాగ్డ్ ఎడ్జెస్)

సమస్య: మీ నీడల అంచులు బ్లాకీగా, గరుకుగా మరియు పిక్సలేటెడ్‌గా కనిపిస్తాయి. ఇది అలియాసింగ్ యొక్క ఒక రూపం. షాడో మ్యాప్ యొక్క రిజల్యూషన్ పరిమితంగా ఉండటం వలన ఇది జరుగుతుంది. షాడో మ్యాప్‌లోని ఒకే పిక్సెల్ (లేదా టెక్సెల్) తుది దృశ్యంలోని ఉపరితలంపై ఒక పెద్ద ప్రాంతాన్ని కవర్ చేయవచ్చు, ముఖ్యంగా కెమెరాకు దగ్గరగా ఉన్న ఉపరితలాల కోసం లేదా గ్రేజింగ్ యాంగిల్‌లో చూసిన వాటి కోసం. రిజల్యూషన్‌లోని ఈ అసమతుల్యత లక్షణమైన బ్లాకీ రూపాన్ని కలిగిస్తుంది.

పరిష్కారం: షాడో మ్యాప్ రిజల్యూషన్‌ను పెంచడం (ఉదా., 1024x1024 నుండి 4096x4096 వరకు) సహాయపడుతుంది, కానీ ఇది గణనీయమైన మెమరీ మరియు పనితీరు వ్యయంతో వస్తుంది మరియు అంతర్లీన సమస్యను పూర్తిగా పరిష్కరించదు. నిజమైన పరిష్కారాలు మరింత అధునాతన పద్ధతులలో ఉన్నాయి.

అధ్యాయం 4: అధునాతన షాడో మ్యాపింగ్ పద్ధతులు

ప్రాథమిక షాడో మ్యాపింగ్ ఒక పునాదిని అందిస్తుంది, కానీ ప్రొఫెషనల్ అప్లికేషన్‌లు దాని పరిమితులను, ముఖ్యంగా అలియాసింగ్‌ను అధిగమించడానికి మరింత అధునాతన అల్గారిథమ్‌లను ఉపయోగిస్తాయి.

పర్సెంటేజ్-క్లోజర్ ఫిల్టరింగ్ (PCF)

PCF నీడ అంచులను మృదువుగా చేయడానికి మరియు అలియాసింగ్‌ను తగ్గించడానికి అత్యంత సాధారణ టెక్నిక్. షాడో మ్యాప్ నుండి ఒకే శాంపిల్ తీసుకుని బైనరీ (నీడలో లేదా నీడలో లేదు) నిర్ణయం తీసుకునే బదులు, PCF లక్ష్య కోఆర్డినేట్ చుట్టూ ఉన్న ప్రాంతం నుండి బహుళ శాంపిల్స్ తీసుకుంటుంది.

భావన: ప్రతి ఫ్రాగ్మెంట్ కోసం, మనం షాడో మ్యాప్‌ను ఒక్కసారి మాత్రమే కాకుండా, ఫ్రాగ్మెంట్ యొక్క ప్రొజెక్ట్ చేయబడిన టెక్చర్ కోఆర్డినేట్ చుట్టూ ఒక గ్రిడ్ నమూనాలో (ఉదా., 3x3 లేదా 5x5) శాంపిల్ చేస్తాము. ఈ శాంపిల్స్ ప్రతిదానికీ, మనం డెప్త్ పోలికను చేస్తాము. తుది నీడ విలువ ఈ అన్ని పోలికల సగటు. ఉదాహరణకు, 9 శాంపిల్స్‌లో 4 నీడలో ఉంటే, ఫ్రాగ్మెంట్ 4/9 వంతు నీడలో ఉంటుంది, ఫలితంగా ఒక మృదువైన పెనంబ్రా (నీడ యొక్క మృదువైన అంచు) ఏర్పడుతుంది.

అమలు: ఇది పూర్తిగా ఫ్రాగ్మెంట్ షేడర్‌లోనే జరుగుతుంది. ఇది ఒక చిన్న కెర్నల్ మీద లూప్ అవుతూ, ప్రతి ఆఫ్‌సెట్‌లో షాడో మ్యాప్‌ను శాంపిల్ చేసి ఫలితాలను కూడగట్టుకుంటుంది. WebGL 2 హార్డ్‌వేర్ మద్దతును (`texture`తో `sampler2DShadow`) అందిస్తుంది, ఇది పోలిక మరియు ఫిల్టరింగ్‌ను మరింత సమర్థవంతంగా చేయగలదు.

ప్రయోజనం: కఠినమైన, అలియాస్డ్ అంచులను మృదువైన, సాఫ్ట్ వాటితో భర్తీ చేయడం ద్వారా నీడ నాణ్యతను గణనీయంగా మెరుగుపరుస్తుంది.

వ్యయం: ప్రతి ఫ్రాగ్మెంట్‌కు తీసుకున్న శాంపిల్స్ సంఖ్యతో పనితీరు తగ్గుతుంది.

క్యాస్కేడెడ్ షాడో మ్యాప్స్ (CSM)

CSM అనేది ఒకే డైరక్షనల్ లైట్ సోర్స్ (సూర్యుడిలా) నుండి చాలా పెద్ద దృశ్యంపై నీడలను రెండర్ చేయడానికి పరిశ్రమ-ప్రామాణిక పరిష్కారం. ఇది పర్స్పెక్టివ్ అలియాసింగ్ సమస్యను నేరుగా పరిష్కరిస్తుంది.

భావన: ముఖ్య ఆలోచన ఏమిటంటే, కెమెరాకు దగ్గరగా ఉన్న వస్తువులకు దూరంగా ఉన్న వస్తువుల కంటే చాలా ఎక్కువ షాడో రిజల్యూషన్ అవసరం. CSM కెమెరా యొక్క వ్యూ ఫ్రస్టమ్‌ను దాని డెప్త్ వెంట అనేక విభాగాలుగా లేదా "క్యాస్కేడ్‌లుగా" విభజిస్తుంది. ప్రతి క్యాస్కేడ్ కోసం ఒక ప్రత్యేక, అధిక-నాణ్యత షాడో మ్యాప్ రెండర్ చేయబడుతుంది. కెమెరాకు దగ్గరగా ఉన్న క్యాస్కేడ్ ప్రపంచ స్పేస్ యొక్క ఒక చిన్న ప్రాంతాన్ని కవర్ చేస్తుంది మరియు అందువల్ల చాలా అధిక ప్రభావవంతమైన రిజల్యూషన్‌ను కలిగి ఉంటుంది. దూరంగా ఉన్న క్యాస్కేడ్‌లు అదే టెక్చర్ పరిమాణంతో క్రమంగా పెద్ద ప్రాంతాలను కవర్ చేస్తాయి, ఇది ఆమోదయోగ్యమైనది ఎందుకంటే ఆ వివరాలు ఆటగాడికి తక్కువగా కనిపిస్తాయి.

అమలు: ఇది గణనీయంగా మరింత సంక్లిష్టమైనది.

1. CPU లో, కెమెరా ఫ్రస్టమ్‌ను 2-4 క్యాస్కేడ్‌లుగా విభజించండి.
2. ప్రతి క్యాస్కేడ్ కోసం, ఫ్రస్టమ్ యొక్క ఆ విభాగాన్ని ఖచ్చితంగా చుట్టుముట్టే కాంతి కోసం ఒక గట్టిగా సరిపోయే ఆర్థోగ్రాఫిక్ ప్రొజెక్షన్ మ్యాట్రిక్స్‌ను లెక్కించండి.
3. రెండరింగ్ లూప్‌లో, డెప్త్ పాస్‌ను బహుళసార్లు చేయండి—ప్రతి క్యాస్కేడ్ కోసం ఒకసారి, వేరే షాడో మ్యాప్‌కు (లేదా టెక్చర్ అట్లాస్ యొక్క ఒక ప్రాంతానికి) రెండర్ చేస్తూ.
4. తుది సీన్ పాస్ ఫ్రాగ్మెంట్ షేడర్‌లో, ప్రస్తుత ఫ్రాగ్మెంట్ కెమెరా నుండి దాని దూరం ఆధారంగా ఏ క్యాస్కేడ్‌కు చెందినదో నిర్ణయించండి.
5. నీడను లెక్కించడానికి తగిన క్యాస్కేడ్ యొక్క షాడో మ్యాప్‌ను శాంపిల్ చేయండి.

ప్రయోజనం: విస్తారమైన దూరాల్లో స్థిరంగా అధిక-రిజల్యూషన్ నీడలను అందిస్తుంది, ఇది బహిరంగ వాతావరణాలకు పరిపూర్ణంగా ఉంటుంది.

వేరియన్స్ షాడో మ్యాప్స్ (VSM)

VSM మృదువైన నీడలను సృష్టించడానికి మరొక టెక్నిక్, కానీ ఇది PCF నుండి భిన్నమైన విధానాన్ని తీసుకుంటుంది.

భావన: షాడో మ్యాప్‌లో కేవలం డెప్త్‌ను నిల్వ చేయడానికి బదులుగా, VSM రెండు విలువలను నిల్వ చేస్తుంది: డెప్త్ (మొదటి మొమెంట్) మరియు డెప్త్ స్క్వేర్డ్ (రెండవ మొమెంట్). ఈ రెండు విలువలు మనకు డెప్త్ పంపిణీ యొక్క వేరియన్స్‌ను లెక్కించడానికి అనుమతిస్తాయి. చెబిషెవ్ యొక్క అసమానత అనే గణిత సాధనాన్ని ఉపయోగించి, మనం ఒక ఫ్రాగ్మెంట్ నీడలో ఉండే సంభావ్యతను అంచనా వేయవచ్చు. ముఖ్య ప్రయోజనం ఏమిటంటే, ఒక VSM టెక్చర్‌ను ప్రామాణిక హార్డ్‌వేర్-యాక్సిలరేటెడ్ లీనియర్ ఫిల్టరింగ్ మరియు మిప్‌మ్యాపింగ్ ఉపయోగించి బ్లర్ చేయవచ్చు, ఇది ప్రామాణిక డెప్త్ మ్యాప్ కోసం గణితశాస్త్రపరంగా చెల్లదు. ఇది స్థిరమైన పనితీరు వ్యయంతో చాలా పెద్ద, మృదువైన, మరియు నునుపైన నీడ పెనంబ్రాలను అనుమతిస్తుంది.

లోపం: VSM యొక్క ప్రధాన బలహీనత "లైట్ బ్లీడింగ్", ఇక్కడ అతివ్యాప్తి చెందుతున్న ఆక్లూడర్‌లతో ఉన్న పరిస్థితులలో కాంతి వస్తువుల ద్వారా ప్రవహిస్తున్నట్లు కనిపించవచ్చు, ఎందుకంటే గణాంక అంచనా విఫలం కావచ్చు.

అధ్యాయం 5: ప్రాక్టికల్ అమలు చిట్కాలు & పనితీరు

మీ షాడో మ్యాప్ రిజల్యూషన్‌ను ఎంచుకోవడం

మీ షాడో మ్యాప్ యొక్క రిజల్యూషన్ నాణ్యత మరియు పనితీరు మధ్య ప్రత్యక్ష మార్పిడి. ఒక పెద్ద టెక్చర్ పదునైన నీడలను అందిస్తుంది కానీ ఎక్కువ వీడియో మెమరీని వినియోగిస్తుంది మరియు రెండర్ చేయడానికి మరియు శాంపిల్ చేయడానికి ఎక్కువ సమయం పడుతుంది. సాధారణ పరిమాణాలు:

• 1024x1024: అనేక అప్లికేషన్‌లకు మంచి బేస్‌లైన్.
• 2048x2048: డెస్క్‌టాప్ అప్లికేషన్‌ల కోసం గుర్తించదగిన నాణ్యత మెరుగుదలను అందిస్తుంది.
• 4096x4096: అధిక నాణ్యత, తరచుగా హీరో అసెట్‌ల కోసం లేదా బలమైన కల్లింగ్ ఉన్న ఇంజిన్‌లలో ఉపయోగించబడుతుంది.

మెమరీ వాడకం చతురస్రాకారంలో పెరుగుతుందని గుర్తుంచుకోండి; ఒక 4096x4096 టెక్చర్ ఒక 1024x1024 దాని కంటే 16 రెట్లు ఎక్కువ మెమరీని ఉపయోగిస్తుంది.

కాంతి యొక్క ఫ్రస్టమ్‌ను ఆప్టిమైజ్ చేయడం

మీ షాడో మ్యాప్‌లోని ప్రతి పిక్సెల్ నుండి గరిష్ట ప్రయోజనం పొందడానికి, కాంతి యొక్క ప్రొజెక్షన్ వాల్యూమ్ (దాని ఆర్థోగ్రాఫిక్ బాక్స్ లేదా పర్స్పెక్టివ్ ఫ్రస్టమ్) నీడలు అవసరమయ్యే దృశ్య అంశాలకు సాధ్యమైనంత గట్టిగా సరిపోయేలా ఉండటం చాలా ముఖ్యం. ఒక డైరక్షనల్ లైట్ కోసం, దీని అర్థం దాని ఆర్థోగ్రాఫిక్ ప్రొజెక్షన్‌ను కెమెరా యొక్క ఫ్రస్టమ్ యొక్క కనిపించే భాగాన్ని మాత్రమే చుట్టుముట్టేలా సరిపోల్చడం. షాడో మ్యాప్‌లోని ఏదైనా వృధా అయిన స్థలం వృధా అయిన రిజల్యూషన్.

WebGL ఎక్స్‌టెన్షన్స్ మరియు వెర్షన్స్

WebGL 1 vs. WebGL 2: WebGL 1 లో షాడో మ్యాపింగ్ సాధ్యమే అయినప్పటికీ, WebGL 2 లో ఇది చాలా సులభం మరియు మరింత సమర్థవంతమైనది. WebGL 1 కి డెప్త్ టెక్చర్ సృష్టించడానికి `WEBGL_depth_texture` ఎక్స్‌టెన్షన్ అవసరం. WebGL 2 లో ఈ కార్యాచరణ అంతర్నిర్మితంగా ఉంది. ఇంకా, WebGL 2 షాడో శాంప్లర్‌లకు (`sampler2DShadow`) యాక్సెస్ అందిస్తుంది, ఇవి హార్డ్‌వేర్-యాక్సిలరేటెడ్ PCF ని చేయగలవు, షేడర్‌లో మాన్యువల్ PCF లూప్‌ల కంటే గణనీయమైన పనితీరును అందిస్తాయి.

నీడలను డీబగ్గింగ్ చేయడం

నీడలను డీబగ్ చేయడం చాలా కష్టంగా ఉంటుంది. అత్యంత ఉపయోగకరమైన టెక్నిక్ షాడో మ్యాప్‌ను విజువలైజ్ చేయడం. ఒక నిర్దిష్ట కాంతి మూలం నుండి డెప్త్ టెక్చర్‌ను నేరుగా స్క్రీన్‌పై ఒక క్వాడ్‌పై రెండర్ చేయడానికి మీ అప్లికేషన్‌ను తాత్కాలికంగా సవరించండి. ఇది కాంతి "ఏమి చూస్తుందో" ఖచ్చితంగా చూడటానికి మిమ్మల్ని అనుమతిస్తుంది. ఇది మీ కాంతి యొక్క మ్యాట్రిక్స్‌లు, ఫ్రస్టమ్ కల్లింగ్, లేదా డెప్త్ పాస్ సమయంలో వస్తువు రెండరింగ్‌తో ఉన్న సమస్యలను వెంటనే బహిర్గతం చేయగలదు.

ముగింపు

రియల్-టైమ్ షాడో మ్యాపింగ్ ఆధునిక 3D గ్రాఫిక్స్ యొక్క మూలస్తంభం, చదునైన, నిర్జీవమైన దృశ్యాలను నమ్మదగిన మరియు డైనమిక్ ప్రపంచాలుగా మారుస్తుంది. కాంతి యొక్క దృష్టికోణం నుండి రెండర్ చేసే భావన సులభమైనప్పటికీ, అధిక-నాణ్యత, ఆర్టిఫ్యాక్ట్-రహిత ఫలితాలను సాధించడానికి రెండు-పాస్ పైప్‌లైన్ నుండి డెప్త్ బయాస్ మరియు అలియాసింగ్ యొక్క సూక్ష్మ నైపుణ్యాల వరకు అంతర్లీన మెకానిక్స్‌పై లోతైన అవగాహన అవసరం.

ఒక ప్రాథమిక అమలుతో ప్రారంభించి, మీరు షాడో ఆక్నే మరియు జాగ్డ్ ఎడ్జెస్ వంటి సాధారణ ఆర్టిఫ్యాక్ట్‌లను క్రమంగా పరిష్కరించవచ్చు. అక్కడ నుండి, మీరు మృదువైన నీడల కోసం PCF లేదా పెద్ద-స్థాయి వాతావరణాల కోసం క్యాస్కేడెడ్ షాడో మ్యాప్స్ వంటి అధునాతన పద్ధతులతో మీ విజువల్స్‌ను ఉన్నత స్థాయికి తీసుకెళ్లవచ్చు. షాడో రెండరింగ్‌లోకి ప్రయాణం కంప్యూటర్ గ్రాఫిక్స్‌ను ఇంత ఆకర్షణీయంగా చేసే కళ మరియు విజ్ఞానం యొక్క మిశ్రమానికి ఒక సరైన ఉదాహరణ. ఈ పద్ధతులతో ప్రయోగాలు చేయమని, వాటి సరిహద్దులను నెట్టమని, మరియు మీ WebGL ప్రాజెక్ట్‌లకు కొత్త స్థాయి వాస్తవికతను తీసుకురావాలని మేము మిమ్మల్ని ప్రోత్సహిస్తున్నాము.