Keresés

Bemutatkozás

Ez az oldal elsősorban gyereknek készült. Egy általam kitalált programozási nyelvet fordít át WebGL nyelve. Az új böngészők ezt már képesek 3D-ben megjeleníteni.

Az oldal ingyenes, ezért bármilyen támogatásnak örülök. (Megosztás, reklámozás, anyagi támogatás.)

Niethammer Zoltán


PayPal azonosító:
niethammer.zoli@gmail.com 

AR marker

A marker egy olyan kép, amelyet a kamera 3D viszonyítási pontnak tekint, ha betöltesz egy AR tartalmat. Az oldalon található tartalmak a következő képet használják:

 

Ajánlott oldalak

Kémiai modellek

Egyszerű 3D kémiai modelleket a GÖMB, és a RÚD utasításokkal lehet készíteni. A gömbök méretével, és színével adhatjuk meg az atomokat. A rúd utasítással köthetők össze az atomok. Érdemes minden geometriát egy csoporthoz adni, mert akkor az egészet egyben lehet animálni.

 


Nagyobb atomszám, és kötés esetén sokkal jobb módszer, ha letöltjük a SDF formátumú leírófájlt, ami tartalmazza az atomok koordinátáit, és a kötéseket is. Az SDF fájl tisztán szöveges kódolású, könnyen ki lehet másolni belőle a szükséges sorokat.

Az SDF formátumban szóközökkel pozícionálják az egyes mezőket, tehát nem lehet tetszőlegesen beljebb tolni a sorokat!
Különösen érvényes ez az első sorra, ahol megadja az atomok, és a kötések számát. Ez max. 999 lehet, ezért 100 feletti értékekenél összefolyik a két adat. 
A pirossal jelölt rész az atomok száma, a kékkel jelölt a kötések száma. A sárga részen vannak az atomok koordinátái. Utánuk található az atom jele. 

FONTOS: Ugyanezeket a neveket kell használni a kód elején egyéni névként. Például az oxigént egy piros gömbbel definiáltuk, aminek a neve O. Ezeket a definiáló geometriákat a látómezőn kívül kell elhelyezni, mert ezeket klónozza a megfelelő helye az SDF utasítás. A példában 1000 egységgel az origó fölé helyeztem az összes atomot definiáló gömböt.

 

AR – kiterjesztett valóság

Webkamerával, vagy a telefon kamerájával megfigyelt valósághoz adjuk hozzá a digitális tartalmat. A kamera mozgatását a 3D digitális tartalomnak követnie kell. Erre a telefonban lévő szenzorok alkalmasak (GPS, mágneses érzékelő, gyorsulásmérő). Tehát amikor fordul a kamera, követi a 3D tartalom is. Ez a fajta AR nagyon sok számítást, és programozást igényel, és nem is könnyű tartalmat létrehozni.

 

Jóval egyszerűbb a marker alapú HTML5 kódolású AR működése. Egy pontosan meghatározott képet, a markert keresi a kamera, mint az arcfelismerő szoftverek. Amint megtalálta, ahhoz viszonyítva képes a 3D tartalmat a képre rajzolni.

Ezen az oldalon ezt a markert használom. Nagyítsd ki, vagy nyomtasd papírra!

 

Hátránya a módszernek, hogy lapos szögben már nem ismeri fel a markert, tehát kb. 30-90 fokos rálátásnál működik. Előnye, hogy sokkal egyszerűbb a kódolása, és a WebGlBasic is képes ilyen tartalmon előállítására.

Nézzük, hogyan készül az AR tartalom!

1. Bejelentkezés

Mivel az elkészült kódot a saját szerverem tárolja, csak bejelentkezett felhasználó készíthet AR tartalmat. Ha szükséged van egyéni azonosítóra, akkor e-mailban kérj tőlem. Használhatod a „teszt” azonosítót is, de akkor mások próbálkozásait is elérheted, illetve időnként törlöm az összes teszt mentést.

 

2. Kódolás

WebGlBasic nyelven megírod a 3D tartalom kódját. Nincs értelme a háttér, a kamera, és az interaktív utasításoknak, mivel a kamerával csak passzív nézők leszünk. A tárgyak animálása sem mindig jó ötlet, mivel pont az a cél, hogy a felhasználó mozogjon a virtuális tárgyak körül.

A jelenetet az XZ sík feletti 10 egységnyi területre kell korlátozni, mert a marker kép a Y=0 síkban lesz.

Érdemes kikapcsolni a beépített fényforrásokat, mert azok nem kerülnek az AR modellbe. Az AR LOGO bekapcsolása segíti a jelenet tervezését, de az sem kerül a mentett modellbe. 

A kódba legalább egy lámpát, és háttérfényt is érdemes berakni, hogy ne legyen sötét része a modellnek.

 

 

 

3. Csoportba helyezés

Amikor jól működik a jelenet, akkor készíteni kell egy „AR” nevű csoportot, és abba kell helyezni az összes objektumot!

 

4. Mentés

A konvertálás közben legyen bekapcsolva a mentés. Ekkor 3 db fájlt ment a konvertálás:

-          Magát a forrásfájlt webglbasic nyelven

-          Egy hagyományosan megnézhető 3D tartalmat

-          Egy VR világot, amit csak kamerával lehet megnézni

 

 

5. Marker használata

Szükségünk lesz a marker képre, amit lehetőleg nyomtatott formában helyezünk majd a kamera elé. Ha nincs papír alapú marker, akkor a képernyőn, vagy telefonos is megjeleníthetjük.

6. Megjelenítés telefonon

Be kell tölteni a telefonon egy HTML5 kompatibilis böngészőbe az elmentett AR oldalt. Javaslom a chrome böngészőt, azzal eddig minden jól működött. Az AR oldal címét be is lehet gépelni, de sokkal jobb, ha generálunk egy QR kódot a linkből. Ha a markert, és a QR kódot egy lapra nyomtatjuk, akkor könnyen hordozhatóvá válik a kiterjesztett valóság modellünk.

A példa ezen a címen található: 
https://webglbasic.com/compiler/ar/kano48_ar_tutorial01.html

 

7. Megjelenítés webkamerával

Fejlesztés közben sokkal gyorsabb a webkamerát használni. Csatlakoztassuk a PC-hez, majd a konvertálás után kattintsunk az AR linkre. Új lapon betöltődik a modell, és kérni fogja a kamera engedélyezését. Amint látható a böngészőben az élő kép, akkor már csak a marker felé kell fordítani. A marker lehet papír, vagy egy másik képernyőn megjelenő kép is.

 

Néhány tanács:

- Vagy a kamera, vagy a marker mozogjon. A kettőt együtt nem érdemes, mert eltűnik a kép.

- Előszőr kb. 45 fokos szögben kell a markerre irányítani a kamerát, majd kicsit mozgatni, ha nem látjuk az AR tartalmat.

- A marker egyenletesen legyen megvilágítva. Az árnyékok, vagy a kevés fény zavarják a felismerést.

- Érdemes többféle távolságról kipróbálni a modellt, hogy optimálisan beleférjen a 3D tartalom a kamera látómezőjébe.

 

 

OBJ import TINKERCAD-ból

A 3D modellezés egyik legnehezebb része a geometria megrajzolása. Ebben a legjobb talán a TINKERCAD. Ingyenesen, online lehet 3D-ben rajzolni, és a végeredményt ki lehet exportálni OBJ formátumú fájlba. Ez a formátum tisztán szöveges, és nagyon egyszerűen olvasható. 

Bővebben: OBJ import TINKERCAD-ból