[{"data":1,"prerenderedAt":1409},["ShallowReactive",2],{"navigation":3,"/api/loaders/use-gltf":466,"/api/loaders/use-gltf-surround":1404},[4,22],{"title":5,"path":6,"stem":7,"children":8},"Getting Started","/getting-started","1.getting-started/1.index",[9,10,14,18],{"title":5,"path":6,"stem":7},{"title":11,"path":12,"stem":13},"Installation Guide","/getting-started/installation","1.getting-started/2.installation",{"title":15,"path":16,"stem":17},"Usage","/getting-started/usage","1.getting-started/3.usage",{"title":19,"path":20,"stem":21},"Upgrade Guide","/getting-started/upgrade-guide","1.getting-started/4.upgrade-guide",{"title":23,"path":24,"stem":25,"children":26},"Api","/api","2.api",[27,30,80,110,152,186,280,306,340,390,432],{"title":28,"path":24,"stem":29},"All","2.api/index",{"title":31,"path":32,"stem":33,"children":34},"Abstractions","/api/abstractions","2.api/1.abstractions/index",[35,36,40,44,48,52,56,60,64,68,72,76],{"title":31,"path":32,"stem":33},{"title":37,"path":38,"stem":39},"Align","/api/abstractions/align","2.api/1.abstractions/align",{"title":41,"path":42,"stem":43},"Billboard","/api/abstractions/billboard","2.api/1.abstractions/billboard",{"title":45,"path":46,"stem":47},"Camera Shake","/api/abstractions/camera-shake","2.api/1.abstractions/camera-shake",{"title":49,"path":50,"stem":51},"Edges","/api/abstractions/edges","2.api/1.abstractions/edges",{"title":53,"path":54,"stem":55},"Fit","/api/abstractions/fit","2.api/1.abstractions/fit",{"title":57,"path":58,"stem":59},"Levioso (Float)","/api/abstractions/levioso","2.api/1.abstractions/levioso",{"title":61,"path":62,"stem":63},"Mask","/api/abstractions/mask","2.api/1.abstractions/mask",{"title":65,"path":66,"stem":67},"Outline","/api/abstractions/outline","2.api/1.abstractions/outline",{"title":69,"path":70,"stem":71},"Sampler","/api/abstractions/sampler","2.api/1.abstractions/sampler",{"title":73,"path":74,"stem":75},"ScreenSizer","/api/abstractions/screen-sizer","2.api/1.abstractions/screen-sizer",{"title":77,"path":78,"stem":79},"ScreenSpace","/api/abstractions/screen-space","2.api/1.abstractions/screen-space",{"title":81,"path":82,"stem":83,"children":84},"Controls","/api/controls","2.api/2.controls/index",[85,86,90,94,98,102,106],{"title":81,"path":82,"stem":83},{"title":87,"path":88,"stem":89},"Camera Controls","/api/controls/camera-controls","2.api/2.controls/camera-controls",{"title":91,"path":92,"stem":93},"Keyboard Controls","/api/controls/keyboard-controls","2.api/2.controls/keyboard-controls",{"title":95,"path":96,"stem":97},"Map Controls","/api/controls/map-controls","2.api/2.controls/map-controls",{"title":99,"path":100,"stem":101},"Orbit Controls","/api/controls/orbit-controls","2.api/2.controls/orbit-controls",{"title":103,"path":104,"stem":105},"PointerLock Controls","/api/controls/pointer-lock-controls","2.api/2.controls/pointer-lock-controls",{"title":107,"path":108,"stem":109},"Transform Controls","/api/controls/transform-controls","2.api/2.controls/transform-controls",{"title":111,"path":112,"stem":113,"children":114},"Loaders","/api/loaders","2.api/3.loaders/index",[115,116,120,124,128,132,136,140,144,148],{"title":111,"path":112,"stem":113},{"title":117,"path":118,"stem":119},"useGLTF","/api/loaders/use-gltf","2.api/3.loaders/1.use-gltf",{"title":121,"path":122,"stem":123},"GLTFModel","/api/loaders/gltf-model","2.api/3.loaders/2.gltf-model",{"title":125,"path":126,"stem":127},"useFBX","/api/loaders/use-fbx","2.api/3.loaders/3.use-fbx",{"title":129,"path":130,"stem":131},"FBXModel","/api/loaders/fbx-model","2.api/3.loaders/4.fbx-model",{"title":133,"path":134,"stem":135},"useTexture","/api/loaders/use-texture","2.api/3.loaders/5.use-texture",{"title":137,"path":138,"stem":139},"useTextures","/api/loaders/use-textures","2.api/3.loaders/6.use-textures",{"title":141,"path":142,"stem":143},"useSVG","/api/loaders/use-svg","2.api/3.loaders/7.use-svg",{"title":145,"path":146,"stem":147},"useProgress","/api/loaders/use-progress","2.api/3.loaders/use-progress",{"title":149,"path":150,"stem":151},"useVideoTexture","/api/loaders/use-video-texture","2.api/3.loaders/use-video-texture",{"title":153,"path":154,"stem":155,"children":156},"Materials","/api/materials","2.api/4.materials/index",[157,158,162,166,170,174,178,182],{"title":153,"path":154,"stem":155},{"title":159,"path":160,"stem":161},"Custom Shader Material","/api/materials/custom-shader-material","2.api/4.materials/custom-shader-material",{"title":163,"path":164,"stem":165},"Mesh Glass Material","/api/materials/glass-material","2.api/4.materials/glass-material",{"title":167,"path":168,"stem":169},"Holographic Material","/api/materials/holographic-material","2.api/4.materials/holographic-material",{"title":171,"path":172,"stem":173},"Mesh Discard Material","/api/materials/mesh-discard-material","2.api/4.materials/mesh-discard-material",{"title":175,"path":176,"stem":177},"Mesh Reflection Material","/api/materials/mesh-reflection-material","2.api/4.materials/mesh-reflection-material",{"title":179,"path":180,"stem":181},"Point Material","/api/materials/point-material","2.api/4.materials/point-material",{"title":183,"path":184,"stem":185},"Wobble Material","/api/materials/wobble-material","2.api/4.materials/wobble-material",{"title":187,"path":188,"stem":189,"children":190},"Shapes","/api/shapes","2.api/5.shapes/index",[191,192,196,200,204,208,212,216,220,224,228,232,236,240,244,248,252,256,260,264,268,272,276],{"title":187,"path":188,"stem":189},{"title":193,"path":194,"stem":195},"Box","/api/shapes/box","2.api/5.shapes/box",{"title":197,"path":198,"stem":199},"CatmullRomCurve3","/api/shapes/catmullromcurve3","2.api/5.shapes/catmullromcurve3",{"title":201,"path":202,"stem":203},"Circle","/api/shapes/circle","2.api/5.shapes/circle",{"title":205,"path":206,"stem":207},"Cone","/api/shapes/cone","2.api/5.shapes/cone",{"title":209,"path":210,"stem":211},"Cubic Bezier Line","/api/shapes/cubic-bezier-line","2.api/5.shapes/cubic-bezier-line",{"title":213,"path":214,"stem":215},"Cylinder","/api/shapes/cylinder","2.api/5.shapes/cylinder",{"title":217,"path":218,"stem":219},"Dodecahedron","/api/shapes/dodecahedron","2.api/5.shapes/dodecahedron",{"title":221,"path":222,"stem":223},"Grid","/api/shapes/grid","2.api/5.shapes/grid",{"title":225,"path":226,"stem":227},"Icosahedron","/api/shapes/icosahedron","2.api/5.shapes/icosahedron",{"title":229,"path":230,"stem":231},"Line2","/api/shapes/line2","2.api/5.shapes/line2",{"title":233,"path":234,"stem":235},"Octahedron","/api/shapes/octahedron","2.api/5.shapes/octahedron",{"title":237,"path":238,"stem":239},"Plane","/api/shapes/plane","2.api/5.shapes/plane",{"title":241,"path":242,"stem":243},"Quadratic Bezier Line","/api/shapes/quadratic-bezier-line","2.api/5.shapes/quadratic-bezier-line",{"title":245,"path":246,"stem":247},"Ring","/api/shapes/ring","2.api/5.shapes/ring",{"title":249,"path":250,"stem":251},"Rounded Box","/api/shapes/rounded-box","2.api/5.shapes/rounded-box",{"title":253,"path":254,"stem":255},"Screen Quad","/api/shapes/screen-quad","2.api/5.shapes/screen-quad",{"title":257,"path":258,"stem":259},"Sphere","/api/shapes/sphere","2.api/5.shapes/sphere",{"title":261,"path":262,"stem":263},"Superformula","/api/shapes/superformula","2.api/5.shapes/superformula",{"title":265,"path":266,"stem":267},"Tetrahedron","/api/shapes/tetrahedron","2.api/5.shapes/tetrahedron",{"title":269,"path":270,"stem":271},"Torus","/api/shapes/torus","2.api/5.shapes/torus",{"title":273,"path":274,"stem":275},"Torus Knot","/api/shapes/torus-knot","2.api/5.shapes/torus-knot",{"title":277,"path":278,"stem":279},"Tube","/api/shapes/tube","2.api/5.shapes/tube",{"title":281,"path":282,"stem":283,"children":284},"Debug/Performance","/api/debug-performance","2.api/6.debug-performance/index",[285,286,290,294,298,302],{"title":281,"path":282,"stem":283},{"title":287,"path":288,"stem":289},"Helper","/api/debug-performance/helper","2.api/6.debug-performance/helper",{"title":291,"path":292,"stem":293},"LOD","/api/debug-performance/lod","2.api/6.debug-performance/lod",{"title":295,"path":296,"stem":297},"Stats","/api/debug-performance/stats","2.api/6.debug-performance/stats",{"title":299,"path":300,"stem":301},"StatsGl","/api/debug-performance/stats-gl","2.api/6.debug-performance/stats-gl",{"title":303,"path":304,"stem":305},"useBVH","/api/debug-performance/use-bvh","2.api/6.debug-performance/use-bvh",{"title":307,"path":308,"stem":309,"children":310},"Light/Shadow","/api/light-shadow","2.api/7.light-shadow/index",[311,312,316,320,324,328,332,336],{"title":307,"path":308,"stem":309},{"title":313,"path":314,"stem":315},"Accumulative Shadows","/api/light-shadow/accumulative-shadows","2.api/7.light-shadow/accumulative-shadows",{"title":317,"path":318,"stem":319},"Bake Shadows","/api/light-shadow/bake-shadows","2.api/7.light-shadow/bake-shadows",{"title":321,"path":322,"stem":323},"Circle Shadow","/api/light-shadow/circle-shadow","2.api/7.light-shadow/circle-shadow",{"title":325,"path":326,"stem":327},"Contact Shadows","/api/light-shadow/contact-shadows","2.api/7.light-shadow/contact-shadows",{"title":329,"path":330,"stem":331},"Lensflare","/api/light-shadow/lensflare","2.api/7.light-shadow/lensflare",{"title":333,"path":334,"stem":335},"Randomized Lights","/api/light-shadow/randomized-lights","2.api/7.light-shadow/randomized-lights",{"title":337,"path":338,"stem":339},"Soft Shadows","/api/light-shadow/soft-shadows","2.api/7.light-shadow/soft-shadows",{"title":341,"path":342,"stem":343,"children":344},"Staging","/api/staging","2.api/8.staging/index",[345,346,350,354,358,362,366,370,374,378,382,386],{"title":341,"path":342,"stem":343},{"title":347,"path":348,"stem":349},"Environment","/api/staging/environment","2.api/8.staging/1.environment",{"title":351,"path":352,"stem":353},"useEnvironment","/api/staging/use-environment","2.api/8.staging/2.use-environment",{"title":355,"path":356,"stem":357},"Lightformer","/api/staging/lightformer","2.api/8.staging/3.lightformer",{"title":359,"path":360,"stem":361},"Backdrop","/api/staging/backdrop","2.api/8.staging/backdrop",{"title":363,"path":364,"stem":365},"Ocean","/api/staging/ocean","2.api/8.staging/ocean",{"title":367,"path":368,"stem":369},"Precipitation","/api/staging/precipitation","2.api/8.staging/precipitation",{"title":371,"path":372,"stem":373},"Sky","/api/staging/sky","2.api/8.staging/sky",{"title":375,"path":376,"stem":377},"Smoke","/api/staging/smoke","2.api/8.staging/smoke",{"title":379,"path":380,"stem":381},"Sparkles","/api/staging/sparkles","2.api/8.staging/sparkles",{"title":383,"path":384,"stem":385},"Stage","/api/staging/stage","2.api/8.staging/stage",{"title":387,"path":388,"stem":389},"Stars","/api/staging/stars","2.api/8.staging/stars",{"title":391,"path":392,"stem":393,"children":394},"Objects","/api/objects","2.api/9.objects/index",[395,396,400,404,408,412,416,420,424,428],{"title":391,"path":392,"stem":393},{"title":397,"path":398,"stem":399},"AnimatedSprite","/api/objects/animated-sprite","2.api/9.objects/animated-sprite",{"title":401,"path":402,"stem":403},"CubeCamera","/api/objects/cube-camera","2.api/9.objects/cube-camera",{"title":405,"path":406,"stem":407},"Fbo","/api/objects/fbo","2.api/9.objects/fbo",{"title":409,"path":410,"stem":411},"GradientTexture","/api/objects/gradient-texture","2.api/9.objects/gradient-texture",{"title":413,"path":414,"stem":415},"HTML","/api/objects/html","2.api/9.objects/html",{"title":417,"path":418,"stem":419},"Image","/api/objects/image","2.api/9.objects/image",{"title":421,"path":422,"stem":423},"MarchingCubes","/api/objects/marching-cubes","2.api/9.objects/marching-cubes",{"title":425,"path":426,"stem":427},"Reflector","/api/objects/reflector","2.api/9.objects/reflector",{"title":429,"path":430,"stem":431},"Text3D","/api/objects/text-3d","2.api/9.objects/text-3d",{"title":433,"path":434,"stem":435,"children":436},"Miscellaneous","/api/miscellaneous","2.api/miscellaneous/index",[437,438,442,446,450,454,458,462],{"title":433,"path":434,"stem":435},{"title":439,"path":440,"stem":441},"Bounds","/api/miscellaneous/bounds","2.api/miscellaneous/bounds",{"title":443,"path":444,"stem":445},"GlobalAudio","/api/miscellaneous/global-audio","2.api/miscellaneous/global-audio",{"title":447,"path":448,"stem":449},"MouseParallax","/api/miscellaneous/mouse-parallax","2.api/miscellaneous/mouse-parallax",{"title":451,"path":452,"stem":453},"PositionalAudio","/api/miscellaneous/positional-audio","2.api/miscellaneous/positional-audio",{"title":455,"path":456,"stem":457},"useAnimations","/api/miscellaneous/use-animations","2.api/miscellaneous/use-animations",{"title":459,"path":460,"stem":461},"useGLTFExporter","/api/miscellaneous/use-gltf-exporter","2.api/miscellaneous/use-gltf-exporter",{"title":463,"path":464,"stem":465},"useIntersect","/api/miscellaneous/use-intersect","2.api/miscellaneous/use-intersect",{"id":467,"title":117,"body":468,"description":1398,"extension":1399,"links":1400,"meta":1401,"navigation":577,"path":118,"seo":1402,"stem":119,"__hash__":1403},"docs/2.api/3.loaders/1.use-gltf.md",{"type":469,"value":470,"toc":1392},"minimark",[471,477,486,490,993,1011,1091,1095,1206,1210,1282,1286,1289,1385,1388],[472,473,474],"scene-wrapper",{},[475,476],"loaders-gltf",{},[478,479,480,481,485],"p",{},"A composable that allows you to easily load glb/glTF models into your ",[482,483,484],"strong",{},"TresJS"," scene.",[487,488,15],"h2",{"id":489},"usage",[491,492,493,708],"code-group",{},[494,495,504],"pre",{"className":496,"code":497,"filename":498,"highlights":499,"language":502,"meta":503,"style":503},"language-vue shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003Cscript setup lang=\"ts\">\nimport { useGLTF } from '@tresjs/cientos'\n\nconst path = './blender-cube.glb'\nconst { state, nodes, materials } = useGLTF(path)\n\u003C/script>\n\n\u003Ctemplate>\n  \u003Cprimitive v-if=\"state\" :object=\"state?.scene\" />\n\u003C/template>\n","TheModel.vue",[500,501],2,5,"vue","",[505,506,507,542,572,579,597,630,640,645,655,699],"code",{"__ignoreMap":503},[508,509,512,516,520,524,527,530,533,537,539],"span",{"class":510,"line":511},"line",1,[508,513,515],{"class":514},"sMK4o","\u003C",[508,517,519],{"class":518},"swJcz","script",[508,521,523],{"class":522},"spNyl"," setup",[508,525,526],{"class":522}," lang",[508,528,529],{"class":514},"=",[508,531,532],{"class":514},"\"",[508,534,536],{"class":535},"sfazB","ts",[508,538,532],{"class":514},[508,540,541],{"class":514},">\n",[508,543,546,550,553,557,560,563,566,569],{"class":544,"line":500},[510,545],"highlight",[508,547,549],{"class":548},"s7zQu","import",[508,551,552],{"class":514}," {",[508,554,556],{"class":555},"sTEyZ"," useGLTF",[508,558,559],{"class":514}," }",[508,561,562],{"class":548}," from",[508,564,565],{"class":514}," '",[508,567,568],{"class":535},"@tresjs/cientos",[508,570,571],{"class":514},"'\n",[508,573,575],{"class":510,"line":574},3,[508,576,578],{"emptyLinePlaceholder":577},true,"\n",[508,580,582,585,588,590,592,595],{"class":510,"line":581},4,[508,583,584],{"class":522},"const",[508,586,587],{"class":555}," path ",[508,589,529],{"class":514},[508,591,565],{"class":514},[508,593,594],{"class":535},"./blender-cube.glb",[508,596,571],{"class":514},[508,598,600,602,604,607,610,613,615,618,621,624,627],{"class":599,"line":501},[510,545],[508,601,584],{"class":522},[508,603,552],{"class":514},[508,605,606],{"class":555}," state",[508,608,609],{"class":514},",",[508,611,612],{"class":555}," nodes",[508,614,609],{"class":514},[508,616,617],{"class":555}," materials ",[508,619,620],{"class":514},"}",[508,622,623],{"class":514}," =",[508,625,556],{"class":626},"s2Zo4",[508,628,629],{"class":555},"(path)\n",[508,631,633,636,638],{"class":510,"line":632},6,[508,634,635],{"class":514},"\u003C/",[508,637,519],{"class":518},[508,639,541],{"class":514},[508,641,643],{"class":510,"line":642},7,[508,644,578],{"emptyLinePlaceholder":577},[508,646,648,650,653],{"class":510,"line":647},8,[508,649,515],{"class":514},[508,651,652],{"class":518},"template",[508,654,541],{"class":514},[508,656,658,661,664,667,669,671,674,676,679,682,684,686,688,691,694,696],{"class":510,"line":657},9,[508,659,660],{"class":514},"  \u003C",[508,662,663],{"class":518},"primitive",[508,665,666],{"class":548}," v-if",[508,668,529],{"class":514},[508,670,532],{"class":514},[508,672,673],{"class":555},"state",[508,675,532],{"class":514},[508,677,678],{"class":514}," :",[508,680,681],{"class":522},"object",[508,683,529],{"class":514},[508,685,532],{"class":514},[508,687,673],{"class":555},[508,689,690],{"class":514},"?.",[508,692,693],{"class":555},"scene",[508,695,532],{"class":514},[508,697,698],{"class":514}," />\n",[508,700,702,704,706],{"class":510,"line":701},10,[508,703,635],{"class":514},[508,705,652],{"class":518},[508,707,541],{"class":514},[494,709,712],{"className":496,"code":710,"filename":711,"language":502,"meta":503,"style":503},"\u003Cscript setup lang=\"ts\">\nimport { OrbitControls } from '@tresjs/cientos'\nimport { TresCanvas } from '@tresjs/core'\nimport TheModel from './TheModel.vue'\n\u003C/script>\n\n\u003Ctemplate>\n  \u003CTresCanvas clear-color=\"#F78B3D\">\n    \u003CTresPerspectiveCamera :position=\"[3, 2, 5]\" />\n    \u003COrbitControls />\n    \u003CTheModel />\n    \u003CTresDirectionalLight\n      :intensity=\"2\"\n      :position=\"[3, 3, 3]\"\n    />\n    \u003CTresAmbientLight :intensity=\"1\" />\n  \u003C/TresCanvas>\n\u003C/template>\n","app.vue",[505,713,714,734,753,773,790,798,802,810,831,873,882,892,900,918,945,951,974,984],{"__ignoreMap":503},[508,715,716,718,720,722,724,726,728,730,732],{"class":510,"line":511},[508,717,515],{"class":514},[508,719,519],{"class":518},[508,721,523],{"class":522},[508,723,526],{"class":522},[508,725,529],{"class":514},[508,727,532],{"class":514},[508,729,536],{"class":535},[508,731,532],{"class":514},[508,733,541],{"class":514},[508,735,736,738,740,743,745,747,749,751],{"class":510,"line":500},[508,737,549],{"class":548},[508,739,552],{"class":514},[508,741,742],{"class":555}," OrbitControls",[508,744,559],{"class":514},[508,746,562],{"class":548},[508,748,565],{"class":514},[508,750,568],{"class":535},[508,752,571],{"class":514},[508,754,755,757,759,762,764,766,768,771],{"class":510,"line":574},[508,756,549],{"class":548},[508,758,552],{"class":514},[508,760,761],{"class":555}," TresCanvas",[508,763,559],{"class":514},[508,765,562],{"class":548},[508,767,565],{"class":514},[508,769,770],{"class":535},"@tresjs/core",[508,772,571],{"class":514},[508,774,775,777,780,783,785,788],{"class":510,"line":581},[508,776,549],{"class":548},[508,778,779],{"class":555}," TheModel ",[508,781,782],{"class":548},"from",[508,784,565],{"class":514},[508,786,787],{"class":535},"./TheModel.vue",[508,789,571],{"class":514},[508,791,792,794,796],{"class":510,"line":501},[508,793,635],{"class":514},[508,795,519],{"class":518},[508,797,541],{"class":514},[508,799,800],{"class":510,"line":632},[508,801,578],{"emptyLinePlaceholder":577},[508,803,804,806,808],{"class":510,"line":642},[508,805,515],{"class":514},[508,807,652],{"class":518},[508,809,541],{"class":514},[508,811,812,814,817,820,822,824,827,829],{"class":510,"line":647},[508,813,660],{"class":514},[508,815,816],{"class":518},"TresCanvas",[508,818,819],{"class":522}," clear-color",[508,821,529],{"class":514},[508,823,532],{"class":514},[508,825,826],{"class":535},"#F78B3D",[508,828,532],{"class":514},[508,830,541],{"class":514},[508,832,833,836,839,841,844,846,848,851,855,858,861,863,866,869,871],{"class":510,"line":657},[508,834,835],{"class":514},"    \u003C",[508,837,838],{"class":518},"TresPerspectiveCamera",[508,840,678],{"class":514},[508,842,843],{"class":522},"position",[508,845,529],{"class":514},[508,847,532],{"class":514},[508,849,850],{"class":514},"[",[508,852,854],{"class":853},"sbssI","3",[508,856,857],{"class":514},", ",[508,859,860],{"class":853},"2",[508,862,857],{"class":514},[508,864,865],{"class":853},"5",[508,867,868],{"class":514},"]",[508,870,532],{"class":514},[508,872,698],{"class":514},[508,874,875,877,880],{"class":510,"line":701},[508,876,835],{"class":514},[508,878,879],{"class":518},"OrbitControls",[508,881,698],{"class":514},[508,883,885,887,890],{"class":510,"line":884},11,[508,886,835],{"class":514},[508,888,889],{"class":518},"TheModel",[508,891,698],{"class":514},[508,893,895,897],{"class":510,"line":894},12,[508,896,835],{"class":514},[508,898,899],{"class":518},"TresDirectionalLight\n",[508,901,903,906,909,911,913,915],{"class":510,"line":902},13,[508,904,905],{"class":514},"      :",[508,907,908],{"class":522},"intensity",[508,910,529],{"class":514},[508,912,532],{"class":514},[508,914,860],{"class":853},[508,916,917],{"class":514},"\"\n",[508,919,921,923,925,927,929,931,933,935,937,939,941,943],{"class":510,"line":920},14,[508,922,905],{"class":514},[508,924,843],{"class":522},[508,926,529],{"class":514},[508,928,532],{"class":514},[508,930,850],{"class":514},[508,932,854],{"class":853},[508,934,857],{"class":514},[508,936,854],{"class":853},[508,938,857],{"class":514},[508,940,854],{"class":853},[508,942,868],{"class":514},[508,944,917],{"class":514},[508,946,948],{"class":510,"line":947},15,[508,949,950],{"class":514},"    />\n",[508,952,954,956,959,961,963,965,967,970,972],{"class":510,"line":953},16,[508,955,835],{"class":514},[508,957,958],{"class":518},"TresAmbientLight",[508,960,678],{"class":514},[508,962,908],{"class":522},[508,964,529],{"class":514},[508,966,532],{"class":514},[508,968,969],{"class":853},"1",[508,971,532],{"class":514},[508,973,698],{"class":514},[508,975,977,980,982],{"class":510,"line":976},17,[508,978,979],{"class":514},"  \u003C/",[508,981,816],{"class":518},[508,983,541],{"class":514},[508,985,987,989,991],{"class":510,"line":986},18,[508,988,635],{"class":514},[508,990,652],{"class":518},[508,992,541],{"class":514},[478,994,995,996,998,999,1002,1003,1010],{},"An advantage of using ",[505,997,117],{}," is that you can pass a ",[505,1000,1001],{},"draco"," prop to enable ",[1004,1005,1009],"a",{"href":1006,"rel":1007},"https://threejs.org/docs/index.html?q=drac#examples/en/loaders/DRACOLoader",[1008],"nofollow","Draco compression"," for the model. This will reduce the size of the model and improve performance.",[494,1012,1015],{"className":1013,"code":1014,"language":536,"meta":503,"style":503},"language-ts shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","import { useGLTF } from '@tresjs/cientos'\n\nconst { state, nodes, materials } = useGLTF('/models/AkuAku.gltf', { draco: true })\n",[505,1016,1017,1035,1039],{"__ignoreMap":503},[508,1018,1019,1021,1023,1025,1027,1029,1031,1033],{"class":510,"line":511},[508,1020,549],{"class":548},[508,1022,552],{"class":514},[508,1024,556],{"class":555},[508,1026,559],{"class":514},[508,1028,562],{"class":548},[508,1030,565],{"class":514},[508,1032,568],{"class":535},[508,1034,571],{"class":514},[508,1036,1037],{"class":510,"line":500},[508,1038,578],{"emptyLinePlaceholder":577},[508,1040,1041,1043,1045,1047,1049,1051,1053,1055,1057,1059,1061,1064,1067,1070,1072,1074,1076,1079,1082,1086,1088],{"class":510,"line":574},[508,1042,584],{"class":522},[508,1044,552],{"class":514},[508,1046,606],{"class":555},[508,1048,609],{"class":514},[508,1050,612],{"class":555},[508,1052,609],{"class":514},[508,1054,617],{"class":555},[508,1056,620],{"class":514},[508,1058,623],{"class":514},[508,1060,556],{"class":626},[508,1062,1063],{"class":555},"(",[508,1065,1066],{"class":514},"'",[508,1068,1069],{"class":535},"/models/AkuAku.gltf",[508,1071,1066],{"class":514},[508,1073,609],{"class":514},[508,1075,552],{"class":514},[508,1077,1078],{"class":518}," draco",[508,1080,1081],{"class":514},":",[508,1083,1085],{"class":1084},"sfNiH"," true",[508,1087,559],{"class":514},[508,1089,1090],{"class":555},")\n",[487,1092,1094],{"id":1093},"return-values","Return Values",[1096,1097,1098,1115],"table",{},[1099,1100,1101],"thead",{},[1102,1103,1104,1109,1112],"tr",{},[1105,1106,1108],"th",{"align":1107},"left","Name",[1105,1110,1111],{},"Type",[1105,1113,1114],{},"Description",[1116,1117,1118,1133,1147,1161,1176,1191],"tbody",{},[1102,1119,1120,1125,1130],{},[1121,1122,1123],"td",{"align":1107},[482,1124,673],{},[1121,1126,1127],{},[505,1128,1129],{},"GLTF",[1121,1131,1132],{},"The loaded GLTF model state",[1102,1134,1135,1140,1144],{},[1121,1136,1137],{"align":1107},[482,1138,1139],{},"nodes",[1121,1141,1142],{},[505,1143,681],{},[1121,1145,1146],{},"Computed object containing all nodes in the scene",[1102,1148,1149,1154,1158],{},[1121,1150,1151],{"align":1107},[482,1152,1153],{},"materials",[1121,1155,1156],{},[505,1157,681],{},[1121,1159,1160],{},"Computed object containing all materials in the scene",[1102,1162,1163,1168,1173],{},[1121,1164,1165],{"align":1107},[482,1166,1167],{},"isLoading",[1121,1169,1170],{},[505,1171,1172],{},"boolean",[1121,1174,1175],{},"Whether the model is currently loading",[1102,1177,1178,1183,1188],{},[1121,1179,1180],{"align":1107},[482,1181,1182],{},"progress",[1121,1184,1185],{},[505,1186,1187],{},"number",[1121,1189,1190],{},"The progress of the model loading",[1102,1192,1193,1198,1203],{},[1121,1194,1195],{"align":1107},[482,1196,1197],{},"load",[1121,1199,1200],{},[505,1201,1202],{},"() => Promise\u003Cvoid>",[1121,1204,1205],{},"Function to reload the model",[487,1207,1209],{"id":1208},"options","Options",[1096,1211,1212,1225],{},[1099,1213,1214],{},[1102,1215,1216,1218,1220,1223],{},[1105,1217,1108],{"align":1107},[1105,1219,1111],{},[1105,1221,1222],{},"Default",[1105,1224,1114],{},[1116,1226,1227,1245,1265],{},[1102,1228,1229,1233,1237,1242],{},[1121,1230,1231],{"align":1107},[482,1232,1001],{},[1121,1234,1235],{},[505,1236,1172],{},[1121,1238,1239],{},[505,1240,1241],{},"false",[1121,1243,1244],{},"Whether to enable Draco compression.",[1102,1246,1247,1252,1257,1262],{},[1121,1248,1249],{"align":1107},[482,1250,1251],{},"decoderPath",[1121,1253,1254],{},[505,1255,1256],{},"string",[1121,1258,1259],{},[505,1260,1261],{},"'https://www.gstatic.com/draco/versioned/decoders/1.5.6/'",[1121,1263,1264],{},"Path to the Draco decoder.",[1102,1266,1267,1272,1277,1279],{},[1121,1268,1269],{"align":1107},[482,1270,1271],{},"traverse",[1121,1273,1274],{},[505,1275,1276],{},"Function",[1121,1278],{},[1121,1280,1281],{},"A traverse function applied to the scene upon loading the model.",[487,1283,1285],{"id":1284},"accessing-nodes-and-materials","Accessing Nodes and Materials",[478,1287,1288],{},"The composable provides computed properties to easily access nodes and materials in your scene:",[494,1290,1292],{"className":1013,"code":1291,"language":536,"meta":503,"style":503},"const { nodes, materials } = useGLTF('/model.glb')\n\n// Access a specific node\nconst mesh = nodes.value.MeshName\n\n// Access a specific material\nconst material = materials.value.MaterialName\n",[505,1293,1294,1323,1327,1333,1355,1359,1364],{"__ignoreMap":503},[508,1295,1296,1298,1300,1302,1304,1306,1308,1310,1312,1314,1316,1319,1321],{"class":510,"line":511},[508,1297,584],{"class":522},[508,1299,552],{"class":514},[508,1301,612],{"class":555},[508,1303,609],{"class":514},[508,1305,617],{"class":555},[508,1307,620],{"class":514},[508,1309,623],{"class":514},[508,1311,556],{"class":626},[508,1313,1063],{"class":555},[508,1315,1066],{"class":514},[508,1317,1318],{"class":535},"/model.glb",[508,1320,1066],{"class":514},[508,1322,1090],{"class":555},[508,1324,1325],{"class":510,"line":500},[508,1326,578],{"emptyLinePlaceholder":577},[508,1328,1329],{"class":510,"line":574},[508,1330,1332],{"class":1331},"sHwdD","// Access a specific node\n",[508,1334,1335,1337,1340,1342,1344,1347,1350,1352],{"class":510,"line":581},[508,1336,584],{"class":522},[508,1338,1339],{"class":555}," mesh ",[508,1341,529],{"class":514},[508,1343,612],{"class":555},[508,1345,1346],{"class":514},".",[508,1348,1349],{"class":555},"value",[508,1351,1346],{"class":514},[508,1353,1354],{"class":555},"MeshName\n",[508,1356,1357],{"class":510,"line":501},[508,1358,578],{"emptyLinePlaceholder":577},[508,1360,1361],{"class":510,"line":632},[508,1362,1363],{"class":1331},"// Access a specific material\n",[508,1365,1366,1368,1371,1373,1376,1378,1380,1382],{"class":510,"line":642},[508,1367,584],{"class":522},[508,1369,1370],{"class":555}," material ",[508,1372,529],{"class":514},[508,1374,1375],{"class":555}," materials",[508,1377,1346],{"class":514},[508,1379,1349],{"class":555},[508,1381,1346],{"class":514},[508,1383,1384],{"class":555},"MaterialName\n",[478,1386,1387],{},"This makes it easier to manipulate specific parts of your model or apply materials programmatically.",[1389,1390,1391],"style",{},"html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html pre.shiki code .s7zQu, html code.shiki .s7zQu{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html pre.shiki code .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .sbssI, html code.shiki .sbssI{--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C}html pre.shiki code .sfNiH, html code.shiki .sfNiH{--shiki-light:#FF5370;--shiki-default:#FF9CAC;--shiki-dark:#FF9CAC}html pre.shiki code .sHwdD, html code.shiki .sHwdD{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#546E7A;--shiki-default-font-style:italic;--shiki-dark:#676E95;--shiki-dark-font-style:italic}",{"title":503,"searchDepth":511,"depth":500,"links":1393},[1394,1395,1396,1397],{"id":489,"depth":500,"text":15},{"id":1093,"depth":500,"text":1094},{"id":1208,"depth":500,"text":1209},{"id":1284,"depth":500,"text":1285},"A composable to load GLTF models in TresJS scenes.","md",null,{},{"title":117,"description":1398},"a8ph-37nMzF-TmW17rRFWQHDIwN83OfaztvKYiWzP30",[1405,1407],{"title":111,"path":112,"stem":113,"description":1406,"children":-1},"Asset loading composables for TresJS scenes.",{"title":121,"path":122,"stem":123,"description":1408,"children":-1},"A component based on useGLTF to load models in TresJS scenes.",1774953653394]