WebXR தள வகைப்பாட்டின் ஆற்றலை ஆராயுங்கள். டெவலப்பர்களுக்கான இந்த விரிவான வழிகாட்டி, இணையத்தில் உண்மையான அதிவேக மற்றும் சூழல்-அறிந்த AR அனுபவங்களை உருவாக்க, தளங்கள், சுவர்கள் மற்றும் மேசைகளை எவ்வாறு கண்டறிவது என்பதை விளக்குகிறது.
திறமையான AR-ஐ வெளிக்கொணர்தல்: WebXR தள வகைப்பாடு பற்றிய ஒரு ஆழமான ஆய்வு
மேம்படுத்தப்பட்ட யதார்த்தம் (AR) வெறும் புதுமைகளைத் தாண்டி, நமது டிஜிட்டல் மற்றும் பௌதீக உலகங்களை தடையின்றி இணைக்கும் ஒரு மேம்பட்ட கருவியாக வேகமாக வளர்ந்து வருகிறது. ஆரம்பகால AR பயன்பாடுகள், நமது வாழ்க்கை அறையில் ஒரு டைனோசரின் 3D மாதிரியை வைக்க அனுமதித்தன, ஆனால் அது பெரும்பாலும் காற்றில் சங்கடமாக மிதந்தது அல்லது தளபாடங்களுடன் இயற்கைக்கு மாறாக குறுக்கிட்டது. அந்த அனுபவம் மாயாஜாலமாக இருந்தது, ஆனாலும் பலவீனமாக இருந்தது. விடுபட்ட அம்சம் சூழல். AR உண்மையாகவே அதிவேகமாக இருக்க, அது மேம்படுத்தும் உலகத்தைப் புரிந்துகொள்ள வேண்டும். இங்குதான் WebXR Device API, குறிப்பாக தளத்தைக் கண்டறிதல் (Plane Detection) வருகிறது. ஆனால் அதுவும் போதாது. ஒரு மேற்பரப்பு இருக்கிறது என்று அறிவது ஒரு விஷயம்; அது எந்த வகையான மேற்பரப்பு அது என்று அறிவது முற்றிலும் வேறு விஷயம்.
இதுதான் WebXR தள வகைப்பாடு (WebXR Plane Classification) வழங்கும் பாய்ச்சல், இது சொற்பொருள் மேற்பரப்பு அங்கீகாரம் (semantic surface recognition) என்றும் அழைக்கப்படுகிறது. இது இணைய அடிப்படையிலான AR பயன்பாடுகளுக்கு ஒரு தரை, சுவர், மேசை மற்றும் கூரை ஆகியவற்றை வேறுபடுத்தி அறிய அதிகாரம் அளிக்கும் ஒரு தொழில்நுட்பமாகும். இந்த எளிமையான வேறுபாடு ஒரு முன்னுதாரண மாற்றமாகும், இது டெவலப்பர்களை ஒரு நேட்டிவ் செயலியைப் பதிவிறக்கத் தேவையின்றி, உலகெங்கிலும் உள்ள பில்லியன் கணக்கான சாதனங்களில் நேரடியாக ஒரு இணைய உலாவியில் மிகவும் யதார்த்தமான, அறிவார்ந்த மற்றும் பயனுள்ள அனுபவங்களை உருவாக்க உதவுகிறது. இந்த விரிவான வழிகாட்டியில், தளத்தைக் கண்டறிதலின் அடிப்படைகளை ஆராய்வோம், வகைப்பாட்டின் ஆற்றலை ஆழமாகப் புரிந்துகொள்வோம், நடைமுறைச் செயலாக்கத்தின் மூலம் செல்வோம், மேலும் இது அதிவேக இணையத்திற்குத் திறக்கும் அற்புதமான எதிர்காலத்தைப் பார்ப்போம்.
முதலில், அடிப்படை: WebXR-இல் தளத்தைக் கண்டறிதல் என்றால் என்ன?
ஒரு மேற்பரப்பை வகைப்படுத்துவதற்கு முன்பு, நாம் முதலில் அதைக் கண்டுபிடிக்க வேண்டும். இது தளத்தைக் கண்டறிதலின் வேலை, இது நவீன AR அமைப்புகளின் ஒரு அடிப்படை அம்சமாகும். அதன் மையத்தில், தளத்தைக் கண்டறிதல் என்பது ஒரு சாதனம், அதன் கேமரா மற்றும் இயக்க உணர்விகளைப் பயன்படுத்தி (SLAM - Simultaneous Localization and Mapping என அழைக்கப்படும் ஒரு நுட்பம்), தட்டையான மேற்பரப்புகளை அடையாளம் காண பௌதீக சூழலை ஸ்கேன் செய்யும் ஒரு செயல்முறையாகும்.
நீங்கள் ஒரு WebXR அமர்வில் 'plane-detection' அம்சத்தை இயக்கும்போது, உலாவியின் அடிப்படையிலான AR தளம் (Android-இல் Google-இன் ARCore அல்லது iOS-இல் Apple-இன் ARKit போன்றவை) தொடர்ந்து உலகை பகுப்பாய்வு செய்கிறது. இது ஒரு பொதுவான தளத்தில் இருக்கும் அம்சப் புள்ளிகளின் கொத்துக்களைத் தேடுகிறது. அது ஒன்றைக் கண்டறியும்போது, அது உங்கள் வலைப் பயன்பாட்டிற்கு அதை ஒரு XRPlane பொருளாக வெளிப்படுத்துகிறது. ஒவ்வொரு XRPlane-ம் முக்கியமான தகவல்களை வழங்குகிறது:
- நிலை மற்றும் நோக்குநிலை: முப்பரிமாண வெளியில் தளம் எங்கு அமைந்துள்ளது மற்றும் அது எவ்வாறு நோக்குநிலை கொண்டுள்ளது (எ.கா., கிடைமட்டமாக அல்லது செங்குத்தாக) என்பதைக் கூறும் ஒரு அணி.
- பலகோணம்: கண்டறியப்பட்ட மேற்பரப்பின் 2D எல்லையை வரையறுக்கும் முனைகளின் தொகுப்பு. இது பொதுவாக ஒரு சரியான செவ்வகம் அல்ல; இது சாதனம் நம்பிக்கையுடன் அடையாளம் கண்டுள்ள மேற்பரப்பின் பகுதியை பிரதிநிதித்துவப்படுத்தும் ஒரு ஒழுங்கற்ற பலகோணமாகும்.
- கடைசியாகப் புதுப்பிக்கப்பட்ட நேரம்: தளம் பற்றிய தகவல் கடைசியாக எப்போது புதுப்பிக்கப்பட்டது என்பதைக் குறிக்கும் ஒரு நேரமுத்திரை, கணினி சூழலைப் பற்றி மேலும் அறியும்போது மாற்றங்களைக் கண்காணிக்க உங்களை அனுமதிக்கிறது.
இந்த அடிப்படைத் தகவல் நம்பமுடியாத அளவிற்கு சக்தி வாய்ந்தது. இது டெவலப்பர்களை மிதக்கும் பொருட்களைத் தாண்டி, மெய்நிகர் உள்ளடக்கத்தை நிஜ உலக மேற்பரப்புகளில் யதார்த்தமாக நங்கூரமிடக்கூடிய அனுபவங்களை உருவாக்க அனுமதித்தது. நீங்கள் ஒரு மெய்நிகர் பூந்தொட்டியை ஒரு உண்மையான மேசையில் வைக்கலாம், நீங்கள் அதைச் சுற்றி நடக்கும்போது அது அங்கேயே இருக்கும். இருப்பினும், ஒரு குறிப்பிடத்தக்க வரம்பு இருந்தது: உங்கள் பயன்பாட்டிற்கு அது ஒரு மேசை என்று தெரியாது. அது ஒரு 'கிடைமட்டத் தளம்' மட்டுமே. பயனரை பூந்தொட்டியை 'சுவர் தளத்தில்' அல்லது 'தரை தளத்தில்' வைப்பதைத் தடுக்க முடியவில்லை, இது யதார்த்தத்தின் மாயையை உடைக்கும் அபத்தமான சூழ்நிலைகளுக்கு வழிவகுத்தது.
தள வகைப்பாட்டின் அறிமுகம்: மேற்பரப்புகளுக்கு அர்த்தம் தருதல்
தள வகைப்பாடு அடுத்த தர்க்கரீதியான பரிணாம வளர்ச்சியாகும். இது தளத்தைக் கண்டறிதல் அம்சத்தின் ஒரு நீட்டிப்பாகும், இது கண்டறியப்பட்ட ஒவ்வொரு தளத்திற்கும் ஒரு சொற்பொருள் லேபிளைச் சேர்க்கிறது. "இங்கே ஒரு கிடைமட்ட மேற்பரப்பு உள்ளது," என்று சொல்வதற்குப் பதிலாக, அது, "இங்கே ஒரு கிடைமட்ட மேற்பரப்பு உள்ளது, அது ஒரு தரை என்பதில் நான் மிகுந்த நம்பிக்கையுடன் இருக்கிறேன்." என்று சொல்கிறது.
இது சாதனத்தில் இயங்கும், பெரும்பாலும் இயந்திர கற்றல் மாதிரிகளால் இயக்கப்படும், அதிநவீன அல்காரிதம்கள் மூலம் அடையப்படுகிறது. இந்த மாதிரிகள், பொதுவான மேற்பரப்புகளின் சிறப்பியல்பு அம்சங்கள், நிலைகள் மற்றும் நோக்குநிலைகளை அடையாளம் காண, உட்புறச் சூழல்களின் பரந்த தரவுத்தொகுப்புகளில் பயிற்சி அளிக்கப்பட்டுள்ளன. உதாரணமாக, ஒரு பெரிய, தாழ்வான, கிடைமட்டத் தளம் பெரும்பாலும் ஒரு தரையாக இருக்கும், அதே சமயம் ஒரு பெரிய செங்குத்துத் தளம் பெரும்பாலும் ஒரு சுவராக இருக்கும். ஒரு சிறிய, உயர்த்தப்பட்ட கிடைமட்டத் தளம் ஒரு மேசை அல்லது டெஸ்க் ஆக இருக்கலாம்.
நீங்கள் தளத்தைக் கண்டறிதலுடன் ஒரு WebXR அமர்வைக் கோரும்போது, கணினி ஒவ்வொரு XRPlane-க்கும் ஒரு semanticLabel பண்பை வழங்க முடியும். அதிகாரப்பூர்வ விவரக்குறிப்பு ஒரு உட்புறச் சூழலில் மிகவும் பொதுவான மேற்பரப்புகளை உள்ளடக்கிய தரப்படுத்தப்பட்ட லேபிள்களின் தொகுப்பை கோடிட்டுக் காட்டுகிறது:
floor: ஒரு அறையின் முதன்மைத் தரைப்பரப்பு.wall: ஒரு இடத்தை மூடும் செங்குத்து மேற்பரப்புகள்.ceiling: ஒரு அறையின் மேல்நிலை மேற்பரப்பு.table: பொருட்களை வைப்பதற்காக பொதுவாகப் பயன்படுத்தப்படும் ஒரு தட்டையான, உயர்த்தப்பட்ட மேற்பரப்பு.desk: மேசையைப் போன்றது, பெரும்பாலும் வேலை அல்லது படிப்பிற்காகப் பயன்படுத்தப்படுகிறது.couch: ஒரு மென்மையான, மெத்தை பொருத்தப்பட்ட இருக்கை மேற்பரப்பு. கண்டறியப்பட்ட தளம் இருக்கை பகுதியைக் குறிக்கலாம்.door: ஒரு சுவரில் உள்ள திறப்பை மூடப் பயன்படும் ஒரு நகரக்கூடிய தடை.window: ஒரு சுவரில் உள்ள திறப்பு, பொதுவாக கண்ணாடியால் மூடப்பட்டிருக்கும்.other: மற்ற வகைகளில் பொருந்தாத கண்டறியப்பட்ட தளங்களுக்கான ஒரு பொதுவான லேபிள்.
இந்த எளிய சரம் லேபிள் ஒரு வடிவியல் தரவின் ஒரு பகுதியை சூழல் புரிதலின் ஒரு பகுதியாக மாற்றுகிறது, இது திறமையான மற்றும் நம்பத்தகுந்த AR ஊடாடல்களை உருவாக்குவதற்கான சாத்தியக்கூறுகளின் உலகத்தைத் திறக்கிறது.
அதிவேக அனுபவங்களுக்கு தள வகைப்பாடு ஏன் ஒரு புரட்சிகரமான மாற்றமாக இருக்கிறது
மேற்பரப்பு வகைகளை வேறுபடுத்தி அறியும் திறன் ஒரு சிறிய முன்னேற்றம் மட்டுமல்ல; இது நாம் AR பயன்பாடுகளை எவ்வாறு வடிவமைத்து உருவாக்குகிறோம் என்பதை அடிப்படையில் மாற்றுகிறது. இது அவற்றை எளிய பார்வையாளர்களிடமிருந்து பயனரின் உண்மையான சூழலுக்குப் பதிலளிக்கும் அறிவார்ந்த, ஊடாடும் அமைப்புகளாக உயர்த்துகிறது.
மேம்பட்ட யதார்த்தம் மற்றும் அதிவேகம்
மிகவும் உடனடியான நன்மை யதார்த்தத்தில் ஒரு வியத்தகு அதிகரிப்பு ஆகும். மெய்நிகர் பொருட்கள் இப்போது நிஜ உலக தர்க்கத்தின்படி நடந்துகொள்ள முடியும். ஒரு மெய்நிகர் கூடைப்பந்து floor என பெயரிடப்பட்ட மேற்பரப்பில் துள்ள வேண்டும், wall மீது அல்ல. ஒரு டிஜிட்டல் படச்சட்டம் ஒரு wall மீது மட்டுமே வைக்கப்பட வேண்டும். ஒரு மெய்நிகர் காபி கோப்பை ஒரு table மீது இயற்கையாக ஓய்வெடுக்க வேண்டும், ceiling மீது அல்ல. சொற்பொருள் லேபிள்களின் அடிப்படையில் இந்த எளிய விதிகளைச் செயல்படுத்துவதன் மூலம், பயனர் ஒரு உருவகப்படுத்துதலில் இருப்பதை நினைவூட்டும் அதிவேகத்தை உடைக்கும் தருணங்களைத் தடுக்கிறீர்கள்.
திறமையான பயனர் இடைமுகங்கள் (UI)
பாரம்பரிய AR-இல், UI கூறுகள் பெரும்பாலும் கேமராவின் முன் மிதக்கின்றன ('ஹெட்ஸ்-அப் டிஸ்ப்ளே' அல்லது HUD) அல்லது உலகில் சங்கடமாக வைக்கப்படுகின்றன. தள வகைப்பாட்டுடன், UI சுற்றுச்சூழலின் ஒரு பகுதியாக மாறும். ஒரு கட்டிடக்கலை காட்சிப்படுத்தல் பயன்பாட்டை கற்பனை செய்து பாருங்கள், அங்கு அளவீட்டுக் கருவிகள் தானாக சுவர்களில் ஒட்டிக்கொள்கின்றன, அல்லது ஒரு தயாரிப்பு கையேடு, ஒரு பொருளின் மேற்பரப்பில் ஊடாடும் வழிமுறைகளைக் காட்டுகிறது, அதை அது ஒரு desk அல்லது table என அடையாளம் காட்டுகிறது. மெனுக்கள் மற்றும் கட்டுப்பாட்டுக் குழுக்கள் அருகிலுள்ள ஒரு வெற்று wall மீது திட்டமிடப்படலாம், இது பயனரின் மையப் பார்வையை விடுவிக்கிறது.
மேம்பட்ட இயற்பியல் மற்றும் மறைத்தல்
சுற்றுச்சூழலின் கட்டமைப்பைப் புரிந்துகொள்வது மிகவும் சிக்கலான மற்றும் யதார்த்தமான இயற்பியல் உருவகப்படுத்துதல்களை செயல்படுத்துகிறது. ஒரு விளையாட்டில் ஒரு மெய்நிகர் பாத்திரம் ஒரு அறையை அறிவார்ந்த முறையில் வழிநடத்த முடியும், floor-இல் நடந்து, ஒரு couch மீது குதித்து, walls-ஐத் தவிர்க்கும். மேலும், இந்த அறிவு மறைத்தலுக்கு (occlusion) உதவுகிறது. மறைத்தல் பொதுவாக ஆழம்-உணர்தல் மூலம் கையாளப்பட்டாலும், ஒரு table ஆனது floor-க்கு முன்னால் உள்ளது என்பதை அறிவது, தரையில் நிற்கும் ஒரு மெய்நிகர் பொருளின் எந்தப் பகுதிகள் பார்வையில் இருந்து மறைக்கப்பட வேண்டும் என்பது பற்றி கணினி சிறந்த முடிவுகளை எடுக்க உதவும்.
சூழல்-அறிந்த பயன்பாடுகள்
உண்மையான சக்தி இங்குதான் உள்ளது. பயன்பாடுகள் இப்போது பயனரின் சூழலின் அடிப்படையில் தங்கள் செயல்பாட்டை மாற்றியமைக்க முடியும்.
- ஒரு உள்துறை வடிவமைப்பு பயன்பாடு ஒரு அறையை ஸ்கேன் செய்து,
floorமற்றும்walls-ஐ அடையாளம் கண்டவுடன், தானாகவே சதுர அடியைக் கணக்கிட்டு பொருத்தமான தளபாடங்கள் தளவமைப்புகளைப் பரிந்துரைக்கலாம். - ஒரு உடற்பயிற்சி பயன்பாடு பயனருக்கு
floor-இல் புஷ்-அப்கள் செய்ய அல்லது அருகிலுள்ளtable-இல் தங்கள் தண்ணீர் பாட்டிலை வைக்க அறிவுறுத்தலாம். - ஒரு AR விளையாட்டு பயனரின் அறை தளவமைப்பின் அடிப்படையில் மாறும் நிலைகளை உருவாக்கலாம். எதிரிகள் கண்டறியப்பட்ட
couch-இன் கீழ் இருந்து ஊர்ந்து வரலாம் அல்லது ஒருwall-ஐ உடைத்துக்கொண்டு வரலாம்.
அணுகல்தன்மை மற்றும் வழிசெலுத்தல்
மேலும் முன்னோக்கிப் பார்க்கும்போது, சொற்பொருள் மேற்பரப்பு அங்கீகாரம் உதவிப் பயன்பாடுகளுக்கான ஒரு அடிப்படைத் தொழில்நுட்பமாகும். ஒரு WebXR பயன்பாடு பார்வை குறைபாடுள்ள ஒருவருக்கு ஒரு புதிய இடத்தை வழிநடத்த உதவ முடியும்: "முன்னால் floor-இல் ஒரு தெளிவான பாதை உள்ளது, உங்கள் வலதுபுறம் ஒரு table மற்றும் உங்களுக்கு முன்னால் உள்ள wall-இல் ஒரு door உள்ளது." இது AR-ஐ ஒரு பொழுதுபோக்கு ஊடகத்திலிருந்து வாழ்க்கை மேம்பாட்டுப் பயன்பாடாக மாற்றுகிறது.
ஒரு நடைமுறை வழிகாட்டி: WebXR தள வகைப்பாட்டைச் செயல்படுத்துதல்
கோட்பாட்டிலிருந்து நடைமுறைக்குச் செல்வோம். உங்கள் குறியீட்டில் இந்த அம்சத்தை நீங்கள் உண்மையில் எவ்வாறு பயன்படுத்துகிறீர்கள்? நீங்கள் பயன்படுத்தும் 3D நூலகத்தைப் பொறுத்து (Three.js, Babylon.js, அல்லது A-Frame போன்றவை) பிரத்தியேகங்கள் சற்று மாறுபடலாம் என்றாலும், முக்கிய WebXR API அழைப்புகள் உலகளாவியவை. எங்கள் எடுத்துக்காட்டுகளுக்கு Three.js-ஐப் பயன்படுத்துவோம், ஏனெனில் இது WebXR மேம்பாட்டிற்கு ஒரு பிரபலமான தேர்வாகும்.
முன்நிபந்தனைகள் மற்றும் உலாவி ஆதரவு
முதலில், WebXR, குறிப்பாக அதன் மேம்பட்ட அம்சங்கள், ஒரு அதிநவீன தொழில்நுட்பம் என்பதை ஒப்புக்கொள்வது முக்கியம். ஆதரவு இன்னும் உலகளாவியதாக இல்லை.
- சாதனம்: AR-ஐ ஆதரிக்கும் ஒரு நவீன ஸ்மார்ட்போன் அல்லது ஹெட்செட் உங்களுக்குத் தேவை (Android-க்கு ARCore-இணக்கமானது, iOS-க்கு ARKit-இணக்கமானது).
- உலாவி: ஆதரவு முதன்மையாக Android-க்கான Chrome-இல் கிடைக்கிறது. சமீபத்திய இணக்கத்தன்மை தகவல்களுக்கு எப்போதும் caniuse.com போன்ற வளங்களைச் சரிபார்க்கவும்.
- பாதுகாப்பான சூழல்: WebXR-க்கு ஒரு பாதுகாப்பான சூழல் தேவை (HTTPS அல்லது localhost).
படி 1: XR அமர்வைக் கோருதல்
தள வகைப்பாட்டைப் பயன்படுத்த, உங்கள் 'immersive-ar' அமர்வைக் கோரும்போது அதை வெளிப்படையாகக் கேட்க வேண்டும். இது requiredFeatures வரிசையில் 'plane-detection'-ஐச் சேர்ப்பதன் மூலம் செய்யப்படுகிறது. சொற்பொருள் லேபிள்கள் இந்த அம்சத்தின் ஒரு பகுதியாக இருந்தாலும், அவற்றுக்குத் தனி கொடி இல்லை; கணினி வகைப்பாட்டை ஆதரித்தால், தளத்தைக் கண்டறிதல் இயக்கப்பட்டிருக்கும்போது அது லேபிள்களை வழங்கும்.
async function activateXR() { if (navigator.xr) { try { const session = await navigator.xr.requestSession('immersive-ar', { requiredFeatures: ['local', 'hit-test', 'plane-detection'] }); // Session setup code goes here... } catch (e) { console.error("Failed to start AR session:", e); } } }
படி 2: ரெண்டர் லூப்பில் தளங்களை அணுகுதல்
உங்கள் அமர்வு இயங்கியவுடன், உங்களிடம் ஒரு ரெண்டர் லூப் இருக்கும் (ஒவ்வொரு பிரேமிற்கும் இயங்கும் ஒரு செயல்பாடு, பொதுவாக `session.requestAnimationFrame`-ஐப் பயன்படுத்தி). இந்த லூப்பின் உள்ளே, `XRFrame` பொருள் AR உலகின் தற்போதைய நிலையின் ஒரு ஸ்னாப்ஷாட்டை உங்களுக்கு வழங்குகிறது. இங்குதான் நீங்கள் கண்டறியப்பட்ட தளங்களின் தொகுப்பை அணுக முடியும்.
தளங்கள் ஒரு `XRPlaneSet`-இல் வழங்கப்படுகின்றன, இது ஒரு JavaScript `Set`-போன்ற பொருளாகும். ஒவ்வொரு தனிப்பட்ட `XRPlane`-ஐப் பெற நீங்கள் இந்தத் தொகுப்பின் மீது மீண்டும் மீண்டும் செல்லலாம். முக்கியமானது ஒவ்வொரு தளத்திலும் `semanticLabel` பண்பைச் சரிபார்ப்பது.
function onXRFrame(time, frame) { const pose = frame.getViewerPose(referenceSpace); if (pose) { // ... update camera and other objects const planes = frame.detectedPlanes; // This is the XRPlaneSet planes.forEach(plane => { // Check if we have seen this plane before if (!scenePlaneObjects.has(plane)) { // A new plane has been detected console.log(`New plane found with label: ${plane.semanticLabel}`); createPlaneVisualization(plane); } }); } session.requestAnimationFrame(onXRFrame); }
படி 3: வகைப்படுத்தப்பட்ட தளங்களைக் காட்சிப்படுத்துதல் (ஒரு Three.js எடுத்துக்காட்டு)
இப்போது வேடிக்கையான பகுதி: மேற்பரப்புகளை நாம் காட்சிப்படுத்தும் முறையை மாற்ற வகைப்பாட்டைப் பயன்படுத்துதல். ஒரு பொதுவான பிழைத்திருத்தம் மற்றும் மேம்பாட்டு நுட்பம் தளங்களை அவற்றின் வகையின் அடிப்படையில் வண்ண-குறியீடாக்குவதாகும். இது கணினி எதை அடையாளம் காண்கிறது என்பது பற்றிய உடனடி காட்சிப் பின்னூட்டத்தை உங்களுக்கு வழங்குகிறது.
முதலில், சொற்பொருள் லேபிளின் அடிப்படையில் வேறுபட்ட வண்ணப் பொருளை வழங்கும் ஒரு உதவிச் செயல்பாட்டை உருவாக்குவோம்.
function getMaterialForLabel(label) { switch (label) { case 'floor': return new THREE.MeshBasicMaterial({ color: 0x00ff00, transparent: true, opacity: 0.5 }); // Green case 'wall': return new THREE.MeshBasicMaterial({ color: 0x0000ff, transparent: true, opacity: 0.5 }); // Blue case 'table': case 'desk': return new THREE.MeshBasicMaterial({ color: 0xffff00, transparent: true, opacity: 0.5 }); // Yellow case 'ceiling': return new THREE.MeshBasicMaterial({ color: 0xff00ff, transparent: true, opacity: 0.5 }); // Magenta default: return new THREE.MeshBasicMaterial({ color: 0x808080, transparent: true, opacity: 0.5 }); // Gray } }
அடுத்து, ஒரு தளத்திற்கான 3D பொருளை உருவாக்கும் செயல்பாட்டை எழுதுவோம். `XRPlane` பொருள் நமக்கு முனைகளின் தொகுப்பால் வரையறுக்கப்பட்ட ஒரு பலகோணத்தை வழங்குகிறது. இந்த முனைகளைப் பயன்படுத்தி ஒரு `THREE.Shape`-ஐ உருவாக்கலாம், பின்னர் அதை சிறிது நீட்டித்து அதற்கு சில தடிமன் கொடுத்து அதைக் காணும்படி செய்யலாம்.
const scenePlaneObjects = new Map(); // To keep track of our planes function createPlaneVisualization(plane) { // Create the geometry from the plane's polygon vertices const polygon = plane.polygon; const shape = new THREE.Shape(); shape.moveTo(polygon[0].x, polygon[0].z); for (let i = 1; i < polygon.length; i++) { shape.lineTo(polygon[i].x, polygon[i].z); } shape.closePath(); const geometry = new THREE.ShapeGeometry(shape); geometry.rotateX(-Math.PI / 2); // Rotate to align with horizontal/vertical orientation // Get the right material for the label const material = getMaterialForLabel(plane.semanticLabel); const mesh = new THREE.Mesh(geometry, material); // Position and orient the mesh using the plane's pose const pose = new THREE.Matrix4(); pose.fromArray(plane.transform.matrix); mesh.matrix.copy(pose); mesh.matrixAutoUpdate = false; scene.add(mesh); scenePlaneObjects.set(plane, mesh); }
தளங்களின் தொகுப்பு மாறக்கூடும் என்பதை நினைவில் கொள்ளுங்கள். புதிய தளங்கள் சேர்க்கப்படலாம், ஏற்கனவே உள்ளவை புதுப்பிக்கப்படலாம் (அவற்றின் பலகோணம் வளரக்கூடும்), மற்றும் கணினி அதன் புரிதலைத் திருத்தினால் சில நீக்கப்படலாம். உங்கள் ரெண்டர் லூப் இதை நீங்கள் ஏற்கனவே எந்த `XRPlane` பொருட்களுக்கு மெஷ்களை உருவாக்கியுள்ளீர்கள் என்பதைக் கண்காணிப்பதன் மூலமும், `detectedPlanes` தொகுப்பிலிருந்து மறைந்துபோகும் தளங்களுக்கான மெஷ்களை அகற்றுவதன் மூலமும் கையாள வேண்டும்.
நிஜ உலக பயன்பாட்டு வழக்குகள் மற்றும் உத்வேகம்
தொழில்நுட்ப அடித்தளம் அமைக்கப்பட்டவுடன், இது எதை செயல்படுத்துகிறது என்பதற்கு மீண்டும் வருவோம். இதன் தாக்கம் பல தொழில்களில் பரவியுள்ளது.
இ-காமர்ஸ் மற்றும் சில்லறை விற்பனை
இது வணிக ரீதியாக மிகவும் குறிப்பிடத்தக்க பகுதிகளில் ஒன்றாகும். IKEA போன்ற நிறுவனங்கள் ஏற்கனவே மெய்நிகர் தளபாடங்களை வைப்பதன் ஆற்றலை நிரூபித்துள்ளன. தள வகைப்பாடு இதை அடுத்த கட்டத்திற்கு எடுத்துச் செல்கிறது. ஒரு பயனர் ஒரு விரிப்பைத் தேர்ந்தெடுக்கலாம், மேலும் செயலி அதை floor என பெயரிடப்பட்ட மேற்பரப்புகளில் மட்டுமே வைக்க அனுமதிக்கும். அவர்கள் ஒரு புதிய சரவிளக்கைப் பரிசோதிக்கலாம், அது ceiling-இல் ஒட்டிக்கொள்ளும். இது பயனர் உராய்வைக் குறைக்கிறது மற்றும் மெய்நிகர் முயற்சி அனுபவத்தை மிகவும் உள்ளுணர்வு மற்றும் யதார்த்தமானதாக ஆக்குகிறது, இது அதிக கொள்முதல் நம்பிக்கைக்கு வழிவகுக்கிறது.
விளையாட்டு மற்றும் பொழுதுபோக்கு
மெய்நிகர் செல்லப்பிராணிகள் உங்கள் வீட்டைப் புரிந்துகொள்ளும் ஒரு விளையாட்டை கற்பனை செய்து பாருங்கள். ஒரு பூனை ஒரு couch மீது தூங்கலாம், ஒரு நாய் floor முழுவதும் ஒரு பந்தைத் துரத்தலாம், மற்றும் ஒரு சிலந்தி ஒரு wall மீது ஏறலாம். கோபுரப் பாதுகாப்பு விளையாட்டுகள் உங்கள் table-இல் விளையாடப்படலாம், எதிரிகள் விளிம்புகளை மதித்து நடப்பார்கள். இந்த அளவிலான சுற்றுச்சூழல் தொடர்பு ஆழமான தனிப்பட்ட மற்றும் முடிவில்லாமல் மீண்டும் விளையாடக்கூடிய விளையாட்டு அனுபவங்களை உருவாக்குகிறது.
கட்டிடக்கலை, பொறியியல், மற்றும் கட்டுமானம் (AEC)
தொழில் வல்லுநர்கள் WebXR-ஐப் பயன்படுத்தி தளத்தில் அதிக துல்லியத்துடன் வடிவமைப்புகளைக் காட்சிப்படுத்தலாம். ஒரு கட்டிடக் கலைஞர் ஒரு மெய்நிகர் சுவர் நீட்டிப்பைத் திட்டமிட்டு, அது தற்போதுள்ள பௌதீக wall உடன் எவ்வாறு சரியாகப் பொருந்துகிறது என்பதைப் பார்க்கலாம். ஒரு கட்டுமான மேலாளர் ஒரு பெரிய உபகரணத்தின் 3D மாதிரியை floor-இல் வைத்து அது பொருந்துகிறதா என்பதை உறுதிசெய்து, தளவாடங்களைத் திட்டமிடலாம். இது பிழைகளைக் குறைக்கிறது மற்றும் பங்குதாரர்களிடையே தகவல்தொடர்பை மேம்படுத்துகிறது.
பயிற்சி மற்றும் உருவகப்படுத்துதல்
தொழில்துறைப் பயிற்சிக்கு, WebXR பாதுகாப்பான மற்றும் செலவு குறைந்த உருவகப்படுத்துதல்களை உருவாக்க முடியும். ஒரு பயிற்சியாளர் ஒரு சிக்கலான இயந்திரத்தை இயக்குவது எப்படி என்பதை ஒரு உண்மையான desk-இல் ஒரு மெய்நிகர் மாதிரியை வைப்பதன் மூலம் கற்றுக்கொள்ளலாம். வழிமுறைகள் மற்றும் எச்சரிக்கைகள் அருகிலுள்ள wall மேற்பரப்புகளில் தோன்றலாம், இது விலையுயர்ந்த பௌதீக உருவகப்படுத்திகள் தேவையில்லாமல் ஒரு வளமான, சூழல்-அறிந்த கற்றல் சூழலை உருவாக்குகிறது.
சவால்கள் மற்றும் முன்னோக்கிய பாதை
நம்பமுடியாத அளவிற்கு நம்பிக்கைக்குரியதாக இருந்தாலும், WebXR தள வகைப்பாடு இன்னும் ஒரு வளர்ந்து வரும் தொழில்நுட்பமாகும் மற்றும் அதன் சவால்களைக் கொண்டுள்ளது.
- துல்லியம் மற்றும் நம்பகத்தன்மை: வகைப்பாடு நிகழ்தகவு சார்ந்தது, தீர்மானகரமானதல்ல. ஒரு தாழ்வான காபி டேபிள் ஆரம்பத்தில்
floor-இன் ஒரு பகுதியாக தவறாக அடையாளம் காணப்படலாம், அல்லது ஒரு ஒழுங்கற்ற டெஸ்க்全くஅடையாளம் காணப்படாமல் போகலாம். துல்லியம் சாதனத்தின் வன்பொருள், லைட்டிங் நிலைமைகள், மற்றும் சுற்றுச்சூழலின் சிக்கலான தன்மையைப் பெரிதும் சார்ந்துள்ளது. டெவலப்பர்கள் அவ்வப்போது ஏற்படும் தவறான வகைப்பாடுகளைக் கையாளும் அளவிற்கு வலுவான அனுபவங்களை வடிவமைக்க வேண்டும். - வரையறுக்கப்பட்ட லேபிள் தொகுப்பு: தற்போதைய சொற்பொருள் லேபிள்களின் தொகுப்பு பயனுள்ளதாக இருந்தாலும், முழுமையானதாக இல்லை. இது படிக்கட்டுகள், கவுண்டர்டாப்புகள், நாற்காலிகள், அல்லது புத்தக அலமாரிகள் போன்ற பொதுவான பொருட்களை உள்ளடக்கவில்லை. தொழில்நுட்பம் முதிர்ச்சியடையும் போது, இந்த பட்டியல் விரிவடையும் என்று நாம் எதிர்பார்க்கலாம், இது இன்னும் நுணுக்கமான சுற்றுச்சூழல் புரிதலை வழங்கும்.
- செயல்திறன்: சுற்றுச்சூழலைத் தொடர்ந்து ஸ்கேன் செய்தல், மெஷ் செய்தல், மற்றும் வகைப்படுத்துதல் கணக்கீட்டு ரீதியாக தீவிரமானது. இது பேட்டரி மற்றும் செயலாக்க சக்தியைப் பயன்படுத்துகிறது, இது மொபைல் சாதனங்களில் முக்கியமான வளங்களாகும். ஒரு மென்மையான பயனர் அனுபவத்தை உறுதிப்படுத்த டெவலப்பர்கள் செயல்திறனைக் கவனத்தில் கொள்ள வேண்டும்.
- தனியுரிமை: அதன் இயல்பாலேயே, சூழல்-உணர்தல் தொழில்நுட்பம் ஒரு பயனரின் தனிப்பட்ட இடம் பற்றிய விரிவான தகவல்களைப் பிடிக்கிறது. WebXR விவரக்குறிப்பு தனியுரிமையை அதன் மையத்தில் கொண்டு வடிவமைக்கப்பட்டுள்ளது—அனைத்து செயலாக்கமும் சாதனத்தில் நடக்கிறது, மற்றும் கேமரா தரவு எதுவும் வலைப்பக்கத்திற்கு அனுப்பப்படுவதில்லை. இருப்பினும், வெளிப்படைத்தன்மை மற்றும் தெளிவான ஒப்புதல் மாதிரிகள் மூலம் பயனர் நம்பிக்கையைத் தக்கவைப்பது தொழில்துறைக்கு முக்கியமானது.
எதிர்கால திசைகள்
மேற்பரப்பு அங்கீகாரத்தின் எதிர்காலம் பிரகாசமாக உள்ளது. பல முக்கிய பகுதிகளில் முன்னேற்றங்களை நாம் எதிர்பார்க்கலாம். கண்டறியக்கூடிய சொற்பொருள் லேபிள்களின் தொகுப்பு சந்தேகத்திற்கு இடமின்றி வளரும். ஒரு டெவலப்பர் TensorFlow.js போன்ற வலை அடிப்படையிலான இயந்திர கற்றல் கட்டமைப்புகளைப் பயன்படுத்தி தங்கள் பயன்பாட்டிற்குத் தொடர்புடைய குறிப்பிட்ட பொருட்களை அல்லது மேற்பரப்புகளை அடையாளம் காண ஒரு மாதிரியைப் பயிற்றுவிக்கக்கூடிய தனிப்பயன் வகைப்படுத்திகளின் எழுச்சியையும் நாம் காணலாம். ஒரு எலக்ட்ரீஷியனின் பயன்பாடு வெவ்வேறு வகையான சுவர் அவுட்லெட்டுகளை அடையாளம் கண்டு லேபிளிட முடியும் என்று கற்பனை செய்து பாருங்கள். தள வகைப்பாட்டை DOM Overlay API போன்ற பிற WebXR தொகுதிகளுடன் ஒருங்கிணைப்பது, 2D வலை உள்ளடக்கம் மற்றும் 3D உலகிற்கு இடையே இன்னும் இறுக்கமான ஒருங்கிணைப்பை அனுமதிக்கும்.
முடிவுரை: இடஞ்சார்ந்து-அறியும் வலையை உருவாக்குதல்
WebXR தள வகைப்பாடு AR-இன் இறுதி இலக்கை நோக்கிய ஒரு மகத்தான படியைப் பிரதிபலிக்கிறது: டிஜிட்டல் மற்றும் பௌதீகத்தின் தடையற்ற மற்றும் அறிவார்ந்த இணைவு. இது வெறுமனே உள்ளடக்கத்தை உலகில் வைப்பதிலிருந்து, உலகை உண்மையாக புரிந்துகொண்டு ஊடாடக்கூடிய அனுபவங்களை உருவாக்குவதற்கு நம்மை நகர்த்துகிறது. டெவலப்பர்களுக்கு, இது உயர் மட்ட யதார்த்தம், பயன்பாடு, மற்றும் படைப்பாற்றலைத் திறக்கும் ஒரு சக்திவாய்ந்த புதிய கருவியாகும். பயனர்களுக்கு, இது AR ஒரு புதுமை மட்டுமல்ல, நாம் கற்றுக்கொள்ள, வேலை செய்ய, விளையாட, மற்றும் தகவல்களுடன் இணைவதற்கான ஒரு உள்ளுணர்வு மற்றும் இன்றியமையாத பகுதியாக இருக்கும் ஒரு எதிர்காலத்தை உறுதியளிக்கிறது.
அதிவேக வலை இன்னும் அதன் ஆரம்ப நாட்களில் உள்ளது, மேலும் நாம் அதன் எதிர்காலத்தின் கட்டிடக் கலைஞர்கள். தள வகைப்பாடு போன்ற தொழில்நுட்பங்களைத் தழுவுவதன் மூலம், டெவலப்பர்கள் இன்று இடஞ்சார்ந்து-அறியும் பயன்பாடுகளின் அடுத்த தலைமுறையை உருவாக்கத் தொடங்கலாம். எனவே, பரிசோதனை செய்யத் தொடங்குங்கள், டெமோக்களை உருவாக்குங்கள், உங்கள் கண்டுபிடிப்புகளைப் பகிர்ந்து கொள்ளுங்கள், மேலும் நம்மைச் சுற்றியுள்ள இடத்தைப் புரிந்துகொள்ளும் ஒரு வலையை வடிவமைக்க உதவுங்கள்.