Hogyan adhatunk animációkat, interakciókat és sok más testreszabást a 3D környezethez egy JSON fájl segítségével.

·

·

A 3D interakció lehetővé tételéhez vagy a kamerák, a világítás és még néhány dolog beállításához az egyes beállítási lehetőségeket a klar.land admin menüjének színpadán található JSON szövegmezőn keresztül kell elvégezni. Itt részletesen elmagyarázzuk, hogyan működik ez.

JSON szövegmező (ajánlás: hozzon létre JSON-t egy kód/szövegszerkesztő programban, például notepad++-ban, és illessze be ide)

Egy minimális JSON kód generálható egy glb fájl feltöltése után a „Generate defaultjson” gomb megnyomásával (a glb fájlnak legalább egy kamerát kell tartalmaznia „Defaultcam” névvel).

A minimális JSON kód így néz ki (egy szakasz már működik ezzel). Ez a kód tetszés szerint bővíthető az alábbi dokumentáció segítségével.

{
 "Stage3dData" :[
{
 "threedfile" : "Dateiname.glb",
 "outlinelevel" : 0,
 "lightsetup": 0,
 "spritescale": 1,
 "defaultqualitylevel": 0,
 "scenetype": "_3d"
}
]
}

(!) fontos megjegyzés: az alábbi JSON kódrészletekben a zárójelek egyes esetekben hiányozhatnak, vagy a paraméterek csak általános formában vannak megadva, például [number]. Ezért ajánlott a kódot csak a szakaszok működő JSON-jaiból másolni vagy adaptálni.

Adatkérés

Stage3dData meg kell adni:

Szerkezet:

"Stage3dData" :[
    {
   "threedfile" : "szenenname.glb",
    "outlinelevel" : [number],
  "perspectives":[
          {
              "name":"Standard Kamera",
              "camera":"Defaultcam"
          }
],
    "lightsetup": [number],
    "spritescale": [number],
    "defaultqualitylevel": [number],
    "scenetype": [string]
    },
 ],
"AOMaps" : [
    {
    "mesh":"Meshname",
    "aomap":"Texturname.jpg"
    }
],

Magyarázat:

„threedfile” : „szenenname.glb” A jelenet fájlneve (jelenleg csak glbs támogatott)

„outlinelevel” : 0, ha az objektumok már a jelenet betöltésekor megkapják a körvonalukat (kék keret a kattintható objektumok kiemelésére), 1, ha az objektumok csak a gombra kattintás után kapják meg a körvonalukat.

„perspectives” : opcionális, a menüben megjelenő kamerák listája.

„lightsetup” : 0 csak HDR-t használ, 1 HDR + Point + Arealight (jelenleg nem implementálva)

„spritescale” : 1 a gombok textúráinak méretezése,

„defaultqualitylevel” : 0 = renderpass + outlinepass + fxaapass (kompromisszum a teljesítmény + megjelenés között), 1 = ssaapass + outlinepass (jobb anti-aliasing, rosszabb teljesítmény).

„scenetype” : „3d” vagy „360”.

"useCases" :[
    
            {
        "name":"Usecasename",
        "group":"Usecasegroup",
        "animationlayer": [number],
        "state":[number],
            "trigger_objects":["triggerobject"],
            "cam":
            {
                "name": "camname",
                "position": [0, 0, 0],
                "rotation":[0, 0, 0],
                "lookatTarget": "lookatobject"
            },
            "animations":
            [
                {
                    "name":"Objektname Anim01",
                    "tc":0,
                    "loop":"true"
                },
                {
                    "name":"Objektname Anim02",
                    "tc":0 
                }
            ]
    },

„camname” végződésének cam-re kell végződnie

„lookatTarget” : „lookatobject” (ha nincs megadva, a kattintott objektumot használja lookattargetként)

„name” : „[Objektname Anim01]” (a glb-ben és a JSON-ban is az animációs objektummal kell kezdődnie, amelyet egy szóköz, majd az animáció egyedi neve követ) // pl. ‘flap_up_armature open’, ha az animáció nevében a szoftver miatt (pl. 3dsMax esetén) nem lehet szóköz, akkor egy % karakter is használható.

„tc” :[number] (timecode másodpercben, az animáció a megadott idő után kerül lejátszásra, azaz csak a kezdés késleltetése – az animáció teljes egészében lejátszásra kerül).

„loop” : true (ha megadva és igaz, az animáció loopként játszódik le, azaz ismétli önmagát)

„autoplay” : true – ha az animáció automatikusan lejátszásra kerül az elejétől kezdve.

Az animációs rétegek/állapotok magyarázata

Az animációs rétegek elsősorban az objektumok kiemelésére és annak kijelölésére szolgálnak, hogy mely objektumok mely objektumokra kattintva legyenek kiemelve és kiválaszthatók.

Az állapotot akkor használjuk, ha egy objektumnak több állapota van, és az állapottól függően más-más animációt kell lejátszani.

z. B.:

Animációs réteg 0: Nem kap kiemelést, és a gomboknál használatos, azaz amikor a kamera interakció nélkül ugrik egy helyre.

Animációs réteg 1: Kiemelt, amint a csoport animációs réteg 0 objektumára (a gombra) kattintanak.

2. animációs réteg: A csoport 0. animációs rétegének objektumára kattintás után azonnal felugrik.

Példa:

Animációs réteg 0: ugrás a 3. fiókba

Animációs réteg 1: nyitott fiók 3

Animációs réteg 2: Play animáció a kattintott kés, mi van a fiókban.

A 0/1 állapotot jelenleg az animáció váltására használják:

Szóval:

Az objektum alapértelmezés szerint 0 állapotú, ha rákattintunk, akkor megnézzük, hogy van-e 1 állapotú animációja. Ha ez a helyzet, az animáció lejátszásra kerül, és az objektum az 1-es állapotba kerül.

Ha most ismét rákattintunk, az 1-es állapotú animáció lejátszódik, és az objektum visszatér a 0-ás állapotba.

Példa:

0. állapot: A gabonapelyhes szekrény ajtaja kinyílik.

1. állapot: A gabonapelyhes szekrény ajtaja becsukódik (szerkesztve)

A 0-nál és az 1-nél több állapot és ezek lekérdezése jelenleg tervben van/ folyamatban van.

További információk:

Az Animációk tömb animációként beilleszthető egy animációs tömbbe. Ez az animációs szekvencia ezután ismétlődhet.

Háttérszín

A háttérszín beállítása:

{
  "Stage3dData": [
    {
	"backgroundColor": "rgb(81, 87, 99)",
	.....

Az rgb mellett a háttérszín a következőképpen is megadható:
„rgb(255, 0, 0, 0)”
„rgb(100%, 0%, 0%, 0%)”
X11 színnév – mind a 140 színnév támogatott.
‘skyblue’
//HSL karakterlánc
„hsl(0, 100%, 50%)”

Hdr környezeti fény

Választható.

Ha nincs megadva, az alapértelmezett stúdió hdr-t használja: /files/stages/hdr/studio_01.hdr.

A„hdr” –„név” alatt megadhatja az adott szakasz Hdr fájljának nevét. Ennek a szerveren a „/files/stages/hdr” alatt kell lennie. Küldje el a fájlt klar.land fiókmenedzserének, aki ott elérhetővé teszi az Ön számára.

Jelenleg a következő szabványos HDRI-t kínáljuk:

  • adams_place_brigde_1k.hdr
  • autoshop_01_1k.hdr
  • comfy_cafe_1k.hdr
  • gradient_01.hdr
  • hotel_room_1k.hdr
  • shanghai_bund_1k.hdr
  • skylit_garage_1k.hdr
  • studio_01.hdr
  • studio_01_heller.hdr
  • studio_small_06_1k.hdr
  • studio_small_08_1k.hdr
  • venice_sunset_1k.hdr
  • white.hdr

„intenzitás” : a fény intenzitása – esetleg többször kell tesztelni.

Példa – JSON:

"Stage3dData" :[
    {
      "threedfile" : "muellmaschiene.glb",
      "outlinelevel" : 0,
      "lightsetup": 0,
       "hdr":{
          "name":"venice_sunset_1k.hdr",
         		 "intensity": 3
      },
      "spritescale": 1,
      "defaultqualitylevel": 0,
      "scenetype": "3d",

HTML-dokumentumok előhívása objektumkattintással

Ezt a dokumentumokat a dokumentumok területén lehet létrehozni egy felhasználási eseten belül:

Példa – JSON:

 {
      "cam": {
        "name": "rauchmelder01cam",
        "position": [
          0,
          0,
          0
        ],
        "rotation": [
          0,
          0,
          0
        ],
        "lookattarget": "rauchmelder01"
      },
      "name": "rm",
      "group": "rm",
      "state": 0,
      "documents": [
        {
          "name": "rauchmelder.html",
          "type": "html",
          "uuid": "d90701d8-0769-4ba6-b23e-327ca0637df1",
          "playonclick": true
        }
      ],
      "animationlayer": 0,
      "trigger_objects": [
        "rauchmeldergruppe01"
      ]
    },

Hiperhivatkozás meghívása objektumra kattintással

Ebből a célból egy felhasználási esetben

„gotourl” : „URL” megadása szükséges

(jelenleg új lapon nyílik meg)

Példa – Usecase:

  {
	"name":"zb out",
        "group":"zb",
        "animationlayer": 0,
        "state":0,
        "gotourl":"https://www.klar.land",
	"trigger_objects":["zbgroup"],
	"cam":
	{
        "name": "zbcam",
	"position": [0, 0, 0],
	"rotation":[0, 0, 0]
	},
        "animations":
            [
	        {
                    "name":"zbgroup%out",
                    "tc":0
		}
	]
    }

Anyag – Animációk

Alapvetően bármilyen useCase-ben létrehozhat egy materialAnimations Array objektumot:

„materialAnimations„: [{}] A következő paramétereket lehet megadni:

name: itt semmit sem kell figyelembe venni, kivéve, hogy a név egyedi legyen, és ne jelenjen meg másodszor a jsonban.

action: itt kell megadni, hogy milyen anyaganimációt kell végrehajtani.
A lehetséges értékek a következők:

changeMaterialValue
addMaterialValueTween

changeTexturePositionValue
addTexturePositionValue

changeTextureRotationDegreeValue
addTextureRotationDegreeValue

stopMaterialAnimation

Magyarázatképpen:

A különbség az add és a change között az, hogy az add esetében a kívánt értékek hozzáadódnak a régi anyagértékekhez, a change esetében pedig a jelenlegi értékek módosulnak a megadott értékekre.
Ez különösen fontos a hurkok esetében.

Ha például egy textúrának az x tengelyen jobbra kell mozognia, használhatjuk a changeTexturePositionValue parancsot, például 0-ról 2-re. Ha ezután megadjuk, hogy ez egy ciklusban történjen, a textúra az x=0 pozícióból x=2-re mozog. Amikor azonban a ciklus másodszor is végrehajtásra kerül, a textúra már nem mozog, mert x=2-re mozdul, de már ezen a pozícióban van.

Ha az értéket ciklusfuttatásonként 1-gyel szeretné növelni, akkor a megfelelő „add” műveletet kell használnia. Ez lehetővé teszi az anyagértékek beállítását, valamint a textúrák elforgatását vagy mozgatását. A stopMaterialAnimation segítségével a futó MaterialAnimations leállítható. Ez például olyan animációk esetében fontos, amelyek végtelen ciklusban vannak, és meg kell állítani őket.

Hurok:

Ez egy opcionális paraméter.

Ha nincs beállítva, a materialAnimation egyszer kerül végrehajtásra.
Ha ez a paraméter be van állítva, és értéke 0 vagy true, akkor a ciklus végtelenítve van.
Ha itt egy numerikus értéket ad meg, az animáció az értékben megadott gyakorisággal ismétlődik.
loop = 12 az anyag animáció pontosan 12-szer ismétlődik.

start_tc:
end_tc:

Itt az animáció kezdő- és végidejét másodpercben adjuk meg (tizedesjegyek is lehetségesek).
A start_tc azt jelzi, hogy a UseCase végrehajtása után mikor kell elindulnia az anyaganimációnak.

start_tc = 2 esetén az animáció 2 másodperces késéssel indul, start_tc = 0 esetén az animáció azonnal elindul.
end_tc jelzi, hogy az animációnak mikor kell leállnia.

A két érték kombinációja határozza meg, hogy milyen gyorsan kell végrehajtani az animációt. Minél közelebb van egymáshoz a start_tc és az end_tc, annál gyorsabban fog lejátszódni az animáció.

materialName:Itt kell megadni az animálandó anyag nevét.

materialproperty:meghatározza, hogy melyik anyagtulajdonságot/textúrát kell befolyásolni.

lehetséges materialProperties:

opacitás
emissiveIntensity
emissziós
aoMapIntensity
bumpScale
szín
displacementScale
envMapIntensity
lightMapIntensity
fémesség
érdesség

lehetséges textúrák:

térkép
alphaMap
emissiveMap
aoMap
bumpMap
envMap
displacementMap
lightMap
metalnessMap
normalMap

érintett értékű:
Ez egy opcionális paraméter, amelyet csak akkor kell megadni, ha az addTexturePositionValue vagy a changeTexturePositionValue művelet van megadva.
Jelenleg x vagy y adható meg itt.
Ha egy textúrának vízszintesen kell mozognia, akkor x-et kell beírni, ha függőlegesen kell mozognia, akkor y-t kell beírni.
pl: „affectedvalue”: „x”,

tweenValue
Az a számérték, amelyre a kiválasztott tulajdonságot állítani kell.
Ha a textúra elforgatását választja, a kívánt elforgatást fokban kell megadni.
pl. a textúrát egyszer 180 fokkal elforgatni:
„tweenValue”: 180,

json Példa:

{
  "useCases": [
    {
      "name": "Start Opacity Animation",
      "group": "Material",
      "state": 0,
      "animationlayer": 0,
      "trigger_objects": [
        "Cube0"
      ],
      "materialAnimations": [
        {
          "loop": true,
          "name": "changeOpacity",
          "action": "changeMaterialValue",
          "end_tc": 10,
          "start_tc": 0,
          "tweenValue": 0,
          "materialName": "Material0",
          "materialproperty": "opacity"
        }
      ]
    },
    {
      "name": "Start Diffuse Map Animation",
      "group": "Material",
      "state": 0,
      "animationlayer": 0,
      "trigger_objects": [
        "Cube1"
      ],
      "materialAnimations": [
        {
          "loop": 0,
          "name": "add diffuse pos",
          "action": "addTexturePositionValue",
          "end_tc": 2,
          "start_tc": 0,
          "tweenValue": 2,
          "materialName": "Material1",
          "affectedvalue": "x",
          "materialproperty": "map"
        }
      ]
    },
    {
      "name": "Start AlphaMap Animation",
      "group": "Material",
      "state": 0,
      "animationlayer": 0,
      "trigger_objects": [
        "Cube5"
      ],
      "materialAnimations": [
        {
          "name": "add diffuse pos",
          "action": "addTexturePositionValue",
          "end_tc": 8,
          "start_tc": 0,
          "tweenValue": 2,
          "materialName": "Material5",
          "affectedvalue": "x",
          "materialproperty": "map"
        }
      ]
    },
    {
      "name": "Start Diffuse Map Animation",
      "group": "Material",
      "state": 0,
      "animationlayer": 0,
      "trigger_objects": [
        "Cube2"
      ],
      "materialAnimations": [
        {
          "loop": 2,
          "name": "change diffuse pos",
          "action": "changeTexturePositionValue",
          "end_tc": 10,
          "start_tc": 0,
          "tweenValue": 2,
          "materialName": "Material2",
          "affectedvalue": "y",
          "materialproperty": "map"
        }
      ]
    },
    {
      "name": "Start Diffuse Map Rotation Animation",
      "group": "Material",
      "state": 0,
      "animationlayer": 0,
      "trigger_objects": [
        "Cube3"
      ],
      "materialAnimations": [
        {
          "loop": 1,
          "name": "add diffuse rotation",
          "action": "addTextureRotationDegreeValue",
          "end_tc": 10,
          "start_tc": 0,
          "tweenValue": 180,
          "materialName": "Material3",
          "materialproperty": "map"
        }
      ]
    },
    {
      "name": "trigger lod1 anim",
      "group": "Cube6",
      "state": 0,
      "animations": [
        {
          "tc": 0,
          "name": "Cube6_lod1 Action"
        }
      ],
      "animationlayer": 0,
      "trigger_objects": [
        "Cube6_lod1"
      ]
    },
    {
      "name": "Stop Opacity Animation",
      "group": "Material",
      "state": 0,
      "animationlayer": 0,
      "trigger_objects": [
        "Cube4"
      ],
      "materialAnimations": [
        {
          "name": "changeOpacity",
          "action": "stopMaterialAnimation",
          "start_tc": 0
        }
      ]
    }
  ],
  "Stage3dData": [
    {
      "controls": {
        "maxZoom": 100000,
        "minZoom": 1,
        "zoomMode": 1,
        "maxDistance": 100000,
        "minDistance": 1
      },
      "scenetype": "_3d",
      "lightsetup": 0,
      "threedfile": "cube6.glb",
      "loddistance": 5,
      "spritescale": 1,
      "outlinelevel": 0,
      "defaultqualitylevel": 0
    }
  ]
}

Médiafelhívás (pdf-ek/videók/…)

Videó egy gombra vagy egy objektumra kattintva indítható el

Lehetőség van egy vagy több dokumentum (videó/mp4, pdf, jpg, png) lekérdezésére, amikor egy objektumra vagy gombra kattint, amelyek aztán a „Média” fülön jelennek meg a lekérdezéshez.

A médiát az adott szakasz docs mappájába kell feltölteni a szerverre: /files/stages/[uuid]/docs. (Ön elküldi az adatokat a klar.land fiókkezelőjének, aki ott tárolja az adatokat az Ön számára).

„trigger_objects” kiváltó objektum vagy gomb

„cam” – itt többek között a társított kamera neve és a kamera célpontja van megadva.

„documents” – egy vagy több lekérdezendő dokumentum

„type” – videó | kép | pdf

„uuid” – online generálás a https://www.uuidgenerator.net/ oldalon és másolás + beillesztés

„playonclick” : true | false – ha a dokumentum közvetlenül megjelenik.

Példa – JSON:

"useCases" : [
{
"name":"klick_dl_pdf",
"group":"01",
"animationlayer": 0,
"poi_uuid": "0f7fa12e-dd7c-11eb-ba80-0242ac130004",
"state":0,
"trigger_objects":["button_vorne_rechts"],
"cam":
{
"name": "Pdfcam",
"position": [0, 0, 0],
"rotation":[0, 0, 0],
"lookatTarget":"button_vorne_rechts"
},"documents":
[
{
"name":"01/Freund_Demovideo.mp4",
"type":"video",
"uuid":"ac848c20-e879-11eb-9a03-0242ac130003",
"playonclick":true
},{
"name":"01/Freunde_DemoPDF.pdf",
"type":"pdf",
"uuid":"1bd675a6-dd7c-11eb-ba80-0242ac130004"
},{
"name":"01/klardenker_Unternehmenspräsentation_DE.pdf",
"type":"pdf",
"uuid":"cb5473d6-e879-11eb-9a03-0242ac130003"
},{
"name":"01/netzwerken-web.jpg",
"type":"image",
"uuid":"fe743ad0-e879-11eb-9a03-0242ac130003"
},{
"name":"01/Showroom_Demo.mp4",
"type":"video",
"uuid":"139e7574-e87a-11eb-9a03-0242ac130003"
},{
"name":"01/Vorwort_DemoPDF.pdf",
"type":"pdf",
"uuid":"2ef28950-e87a-11eb-9a03-0242ac130003"
}
]

 

Média előhívása a „Dokumentumok”-ból – fontos a többnyelvűség szempontjából

Először hozza létre a dokumentumokat a kívánt helyen. Ezt a következőképpen kell megtenni:

Navigáljon a kívánt helyre.
Válassza a Saját számítógép -> Docs.
Ezután hozzon létre például egy saját „stages” mappát, itt természetesen szabadon választhatja meg a nevét tetszése szerint.
Kattintson a / mappa megnyitása gombra.
Ezután hozzon létre egy dokumentumot a „+” segítségével.
Keressen egy újonnan létrehozott mezőt egy dokumentumhoz, és keresse meg a kívánt fájlt a számítógépén a „Böngésző” segítségével, majd töltse fel. Ezután kattintson a „Mentés” gombra.
Ha a fájlt más nyelven szeretné felajánlani, akkor válassza ki a kívánt más nyelvet, majd a „Fájlböngésző” segítségével a kívánt fájlt a megfelelő nyelven. Kattintson ismét a „Mentés” gombra, a dokumentum ezután az újonnan hozzáadott nyelven lesz elérhető.

Ezután másolja ki a dokumentum UUID-jét. Erre azért van szükséged, hogy beilleszthesd a stage-ben lévő jsonba, ami ugyanúgy ott történik, mint a fent felsorolt többi esetben.


A szkript úgy működik, hogy ha létezik egy UUID, akkor ellenőrzi, hogy létezik-e megfelelő adatbázis-bejegyzés. Ha ez a helyzet, a dokumentum betöltődik és megjelenik. Ha nem, akkor a nevet/útvonalat veszi, és a megfelelő fájlt tölti be. Ez azt jelenti, hogy a meglévő szakaszokat nem lövik fel.

Az új szakaszok esetében elegendő az UUID és a típus megadása.

Egy példa egy json bejegyzésre, amely a Doc UUID-n keresztüli fájlkapcsolással rendelkezik:

"useCases" : [
"name": "klick_dl_pdf_03",
"group": "03",
"state": 0,
"poi_uuid": "5cdbbbbc-e883-11eb-9a03-0242ac130003",
"documents": [
{
"name": "03/klardenker_Unternehmenspräsentation_DE.pdf",
"type": "pdf",
"uuid": "8107123e-e883-11eb-9a03-0242ac130003"
},
{
"name": "03/Meditation_DemoVideo.mp4",
"type": "video",
"uuid": "3e7da4a1-6122-483b-9749-2c11caa87fd4",
"playonclick": true
},
{
"name": "03/Sein1_DemoPDF.pdf",
"type": "pdf",
"uuid": "a4ad3ec0-e883-11eb-9a03-0242ac130003"
},
{
"name": "03/Sein2_DemoPDF.pdf",
"type": "pdf",
"uuid": "b2d9a1c8-e883-11eb-9a03-0242ac130003"
},
{
"name": "03/Seminar-web.jpg",
"type": "image",
"uuid": "c1f88a5c-e883-11eb-9a03-0242ac130003"
}
],
"animationlayer": 0,
"trigger_objects": [
"button_03"
]
},
]

Spritesheets (kvázi apngs) (gombokhoz)

Gombok egy színpadon, amelyek spritesheet-eken keresztül animáltak

Az apngs által használt spritesheet-ek a„buttons”csoportban vannak definiálva.

A spritesheeteket tartalmazó png fájlok a szerveren a „/files/stages/sprites” könyvtárban vannak tárolva. (Ha egyedi spritesheet-eket szeretnél használni, kérjük, add meg őket a klar.land fiókkezelőjének, és ő elérhetővé teheti őket a szerveren).

„buttonObjectName” a 3D objektum neve a jelenetben. A névben a „button” karakterláncnak szerepelnie kell. Ezáltal az objektum gombként viselkedik. Vagyis mindig a kamera felé néz, és ha rákattint, a gomb eltűnik.

„spritename” a „/files/stages/sprites” könyvtárban található png fájl neve.

„tilesHoriz” : A vízszintes lapok száma

„tilesVert” : A függőleges lapok száma

„numTiles” : általában ez az előző két érték szorzata. Kivételes esetekben azonban ez más érték is lehet (pl. ha a végén üres lapok vannak).

„tileDispDuration” : Az ezredmásodpercek száma, amely alatt egy csempe megjelenik.

„invisibleOnClick” : igaz vagy hamis, opcionális. Megmutatja, hogy egy gomb láthatatlanná válik-e kattintás után vagy sem (=false). Az alapértelmezett érték true.

Példa – JSON:

"Stage3dData" :[
{
"threedfile" : "01.glb",
"outlinelevel" : 0,
"lightsetup": 0,
"spritescale": 1,
"defaultqualitylevel": 0,
"scenetype": "3d",
"buttons":[
{
"buttonObjectName":"button_vorne_rechts",
"spritename":"floorbutton_spritesheet.png",
"tilesHoriz":25,
"tilesVert":1,
"numTiles":25,
"tileDispDuration":55,
"invisibleOnClick":"false"
}		
],

Tonemapping

5 mód közül választhat a színpad megjelenésének beállításához tone mapping (utólagos színezés utáni hatás) segítségével.

Ehhez több vizsgálatra lehet szükség a Hdr és a fényerősség kombinációjával, hogy az adott színpadhoz optimális megjelenést érjen el.

Ha nincs megadva semmi, akkor alapértelmezés szerint a THREE.ACESFilmicToneMapping kerül alkalmazásra.

Példa – JSON:

{
"Stage3dData": [
{
"tonemapping": 2,
....

a tonemapping 0, 1, 2, 3, 4 vagy 5 értékeket vehet fel – ahol

0 = THREE.NoToneMapping

1 = THREE.LinearToneMapping

2 = THREE.ReinhardToneMapping

3 = THREE.CineonToneMapping

4 = THREE.ACESFilmicFilmicToneMapping

5 = THREE.CustomToneMapping

Lapos színpad ReinhardToneMapping / „tonemapping”: 2

Lapos színpad ACESFilmicToneMapping / „tonemapping”: 4 vagy nincs meghatározás

Videó textúrák

Video textúrák egy színpadon

A videoszövegek esetében meg kell adni a 3D objektumok („videoObject„) nevét, amelyeken a videoszövegek megjelennek, valamint a kiszolgálón található videófájl („videoFile„) relatív elérési útvonalát.

A videókat az adott szakasz docs mappájába kell feltölteni a szerverre: /files/stages/[uuid]/docs

(Az adatok tárolását egyeztesse a klar.land fiókkezelőjével).

Példa – JSON:

"Stage3dData" :[
{
"threedfile" : "01.glb",
"outlinelevel" : 0,
"lightsetup": 100,
"spritescale": 1,
"defaultqualitylevel": 0,
"scenetype": "3d",
"videotextures":[
{
"videoObject":"_videoplane",
"videoFile":"01/Freund_Demovideo.mp4"
}
]
}
]

„controls” opciók

Különböző paraméterek a kamerák zoomjának és távolságának beállításához, valamint a színpad egérgombjának hozzárendeléséhez.

Példa – JSON:

{
"Stage3dData": [
{
"hdr": {
"name": "autoshop_01_1k.hdr",
"intensity": 2
},
"controls": {
"maxZoom": 5,
"minZoom": 1,
"zoomMode": 2,
"maxDistance": 5,
"minDistance": 1
},
{
"Stage3dData": [
{
"controls": {
"zoomMode": 3,
"leftMouseMode":5,
"middleMouseMode":1,
"rightMouseMode": 1,
},
......

A „zoomMode” a következő értékeket veheti fel: 1 / 2 / 3. Ezek az eszközök

1 = Dolly (standard)
2 = ZOOM
3 = NINCS

azaz a 3 kikapcsolja a zoomot.

„leftMouseMode” / „middleMouseMode” / „rightMouseMode” az 1 / 2 / 3 / 4 / 5 / 6 értékeket veheti fel. Ezek az eszközök

1 = FORGATÁS
2 = TRUCK
3 = OFFSET
4 = DOLLY
5 = ZOOM
6 = NINCS

Ha a JSON-kódban nincs semmi megadva, az alapértelmezett értékek a következők

zoomMode = Dolly
leftMouseMode = ROTATE
rightMouseMode = TRUCK
middleMouseMode = DOLLY

360° szakaszok

(Dokumentáció következik)

"spaces" : [ (werden nur in 360° Szenen verwendet)
{
"id" : [number] Stageid,
"name": [string] Stagename,
"ClickSpots":
[
{
"name":"Gehe in Flur",
"position": [8.67872, 15.1609, -12.1186],
"type":"spaceChangeSpot",
"gotoSpace": [number]
},{
"name":"Zeige Lampeninfo",
"position": [-15.4345, 6.06061, 0],
"type":"infoSpot"
}
]
},

Vélemény, hozzászólás?

Az e-mail címet nem tesszük közzé. A kötelező mezőket * karakterrel jelöltük