[{"data":1,"prerenderedAt":1682},["ShallowReactive",2],{"navigation":3,"/api/loaders/use-gltf":498,"/api/loaders/use-gltf-surround":1677},[4,26],{"title":5,"path":6,"stem":7,"children":8},"Getting Started","/getting-started","1.getting-started/1.index",[9,10,14,18,22],{"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},"Loading Models","/getting-started/loading-models","1.getting-started/4.loading-models",{"title":23,"path":24,"stem":25},"Upgrade Guide","/getting-started/upgrade-guide","1.getting-started/5.upgrade-guide",{"title":27,"path":28,"stem":29,"children":30},"Api","/api","2.api",[31,34,96,126,168,210,308,334,368,418,464],{"title":32,"path":28,"stem":33},"All","2.api/index",{"title":35,"path":36,"stem":37,"children":38},"Abstractions","/api/abstractions","2.api/1.abstractions/index",[39,40,44,48,52,56,60,64,68,72,76,80,84,88,92],{"title":35,"path":36,"stem":37},{"title":41,"path":42,"stem":43},"Align","/api/abstractions/align","2.api/1.abstractions/align",{"title":45,"path":46,"stem":47},"Billboard","/api/abstractions/billboard","2.api/1.abstractions/billboard",{"title":49,"path":50,"stem":51},"Camera Shake","/api/abstractions/camera-shake","2.api/1.abstractions/camera-shake",{"title":53,"path":54,"stem":55},"Decal","/api/abstractions/decal","2.api/1.abstractions/decal",{"title":57,"path":58,"stem":59},"Edges","/api/abstractions/edges","2.api/1.abstractions/edges",{"title":61,"path":62,"stem":63},"Fit","/api/abstractions/fit","2.api/1.abstractions/fit",{"title":65,"path":66,"stem":67},"Instances","/api/abstractions/instances","2.api/1.abstractions/instances",{"title":69,"path":70,"stem":71},"Levioso (Float)","/api/abstractions/levioso","2.api/1.abstractions/levioso",{"title":73,"path":74,"stem":75},"Mask","/api/abstractions/mask","2.api/1.abstractions/mask",{"title":77,"path":78,"stem":79},"Merged","/api/abstractions/merged","2.api/1.abstractions/merged",{"title":81,"path":82,"stem":83},"Outline","/api/abstractions/outline","2.api/1.abstractions/outline",{"title":85,"path":86,"stem":87},"Sampler","/api/abstractions/sampler","2.api/1.abstractions/sampler",{"title":89,"path":90,"stem":91},"ScreenSizer","/api/abstractions/screen-sizer","2.api/1.abstractions/screen-sizer",{"title":93,"path":94,"stem":95},"ScreenSpace","/api/abstractions/screen-space","2.api/1.abstractions/screen-space",{"title":97,"path":98,"stem":99,"children":100},"Controls","/api/controls","2.api/2.controls/index",[101,102,106,110,114,118,122],{"title":97,"path":98,"stem":99},{"title":103,"path":104,"stem":105},"Camera Controls","/api/controls/camera-controls","2.api/2.controls/camera-controls",{"title":107,"path":108,"stem":109},"Keyboard Controls","/api/controls/keyboard-controls","2.api/2.controls/keyboard-controls",{"title":111,"path":112,"stem":113},"Map Controls","/api/controls/map-controls","2.api/2.controls/map-controls",{"title":115,"path":116,"stem":117},"Orbit Controls","/api/controls/orbit-controls","2.api/2.controls/orbit-controls",{"title":119,"path":120,"stem":121},"PointerLock Controls","/api/controls/pointer-lock-controls","2.api/2.controls/pointer-lock-controls",{"title":123,"path":124,"stem":125},"Transform Controls","/api/controls/transform-controls","2.api/2.controls/transform-controls",{"title":127,"path":128,"stem":129,"children":130},"Loaders","/api/loaders","2.api/3.loaders/index",[131,132,136,140,144,148,152,156,160,164],{"title":127,"path":128,"stem":129},{"title":133,"path":134,"stem":135},"useGLTF","/api/loaders/use-gltf","2.api/3.loaders/1.use-gltf",{"title":137,"path":138,"stem":139},"GLTFModel","/api/loaders/gltf-model","2.api/3.loaders/2.gltf-model",{"title":141,"path":142,"stem":143},"useFBX","/api/loaders/use-fbx","2.api/3.loaders/3.use-fbx",{"title":145,"path":146,"stem":147},"FBXModel","/api/loaders/fbx-model","2.api/3.loaders/4.fbx-model",{"title":149,"path":150,"stem":151},"useTexture","/api/loaders/use-texture","2.api/3.loaders/5.use-texture",{"title":153,"path":154,"stem":155},"useTextures","/api/loaders/use-textures","2.api/3.loaders/6.use-textures",{"title":157,"path":158,"stem":159},"useSVG","/api/loaders/use-svg","2.api/3.loaders/7.use-svg",{"title":161,"path":162,"stem":163},"useProgress","/api/loaders/use-progress","2.api/3.loaders/use-progress",{"title":165,"path":166,"stem":167},"useVideoTexture","/api/loaders/use-video-texture","2.api/3.loaders/use-video-texture",{"title":169,"path":170,"stem":171,"children":172},"Materials","/api/materials","2.api/4.materials/index",[173,174,178,182,186,190,194,198,202,206],{"title":169,"path":170,"stem":171},{"title":175,"path":176,"stem":177},"Custom Shader Material","/api/materials/custom-shader-material","2.api/4.materials/custom-shader-material",{"title":179,"path":180,"stem":181},"Mesh Glass Material","/api/materials/glass-material","2.api/4.materials/glass-material",{"title":183,"path":184,"stem":185},"Holographic Material","/api/materials/holographic-material","2.api/4.materials/holographic-material",{"title":187,"path":188,"stem":189},"Mesh Discard Material","/api/materials/mesh-discard-material","2.api/4.materials/mesh-discard-material",{"title":191,"path":192,"stem":193},"Mesh Portal Material","/api/materials/mesh-portal-material","2.api/4.materials/mesh-portal-material",{"title":195,"path":196,"stem":197},"Mesh Reflection Material","/api/materials/mesh-reflection-material","2.api/4.materials/mesh-reflection-material",{"title":199,"path":200,"stem":201},"Mesh Transmission Material","/api/materials/mesh-transmission-material","2.api/4.materials/mesh-transmission-material",{"title":203,"path":204,"stem":205},"Point Material","/api/materials/point-material","2.api/4.materials/point-material",{"title":207,"path":208,"stem":209},"Wobble Material","/api/materials/wobble-material","2.api/4.materials/wobble-material",{"title":211,"path":212,"stem":213,"children":214},"Shapes","/api/shapes","2.api/5.shapes/index",[215,216,220,224,228,232,236,240,244,248,252,256,260,264,268,272,276,280,284,288,292,296,300,304],{"title":211,"path":212,"stem":213},{"title":217,"path":218,"stem":219},"Box","/api/shapes/box","2.api/5.shapes/box",{"title":221,"path":222,"stem":223},"CatmullRomCurve3","/api/shapes/catmullromcurve3","2.api/5.shapes/catmullromcurve3",{"title":225,"path":226,"stem":227},"Circle","/api/shapes/circle","2.api/5.shapes/circle",{"title":229,"path":230,"stem":231},"Cone","/api/shapes/cone","2.api/5.shapes/cone",{"title":233,"path":234,"stem":235},"Cubic Bezier Line","/api/shapes/cubic-bezier-line","2.api/5.shapes/cubic-bezier-line",{"title":237,"path":238,"stem":239},"Cylinder","/api/shapes/cylinder","2.api/5.shapes/cylinder",{"title":241,"path":242,"stem":243},"Dodecahedron","/api/shapes/dodecahedron","2.api/5.shapes/dodecahedron",{"title":245,"path":246,"stem":247},"Grid","/api/shapes/grid","2.api/5.shapes/grid",{"title":249,"path":250,"stem":251},"Icosahedron","/api/shapes/icosahedron","2.api/5.shapes/icosahedron",{"title":253,"path":254,"stem":255},"Line2","/api/shapes/line2","2.api/5.shapes/line2",{"title":257,"path":258,"stem":259},"Octahedron","/api/shapes/octahedron","2.api/5.shapes/octahedron",{"title":261,"path":262,"stem":263},"Plane","/api/shapes/plane","2.api/5.shapes/plane",{"title":265,"path":266,"stem":267},"Quadratic Bezier Line","/api/shapes/quadratic-bezier-line","2.api/5.shapes/quadratic-bezier-line",{"title":269,"path":270,"stem":271},"Ring","/api/shapes/ring","2.api/5.shapes/ring",{"title":273,"path":274,"stem":275},"Rounded Box","/api/shapes/rounded-box","2.api/5.shapes/rounded-box",{"title":277,"path":278,"stem":279},"Rounded Plane","/api/shapes/rounded-plane","2.api/5.shapes/rounded-plane",{"title":281,"path":282,"stem":283},"Screen Quad","/api/shapes/screen-quad","2.api/5.shapes/screen-quad",{"title":285,"path":286,"stem":287},"Sphere","/api/shapes/sphere","2.api/5.shapes/sphere",{"title":289,"path":290,"stem":291},"Superformula","/api/shapes/superformula","2.api/5.shapes/superformula",{"title":293,"path":294,"stem":295},"Tetrahedron","/api/shapes/tetrahedron","2.api/5.shapes/tetrahedron",{"title":297,"path":298,"stem":299},"Torus","/api/shapes/torus","2.api/5.shapes/torus",{"title":301,"path":302,"stem":303},"Torus Knot","/api/shapes/torus-knot","2.api/5.shapes/torus-knot",{"title":305,"path":306,"stem":307},"Tube","/api/shapes/tube","2.api/5.shapes/tube",{"title":309,"path":310,"stem":311,"children":312},"Debug/Performance","/api/debug-performance","2.api/6.debug-performance/index",[313,314,318,322,326,330],{"title":309,"path":310,"stem":311},{"title":315,"path":316,"stem":317},"Helper","/api/debug-performance/helper","2.api/6.debug-performance/helper",{"title":319,"path":320,"stem":321},"LOD","/api/debug-performance/lod","2.api/6.debug-performance/lod",{"title":323,"path":324,"stem":325},"Stats","/api/debug-performance/stats","2.api/6.debug-performance/stats",{"title":327,"path":328,"stem":329},"StatsGl","/api/debug-performance/stats-gl","2.api/6.debug-performance/stats-gl",{"title":331,"path":332,"stem":333},"useBVH","/api/debug-performance/use-bvh","2.api/6.debug-performance/use-bvh",{"title":335,"path":336,"stem":337,"children":338},"Light/Shadow","/api/light-shadow","2.api/7.light-shadow/index",[339,340,344,348,352,356,360,364],{"title":335,"path":336,"stem":337},{"title":341,"path":342,"stem":343},"Accumulative Shadows","/api/light-shadow/accumulative-shadows","2.api/7.light-shadow/accumulative-shadows",{"title":345,"path":346,"stem":347},"Bake Shadows","/api/light-shadow/bake-shadows","2.api/7.light-shadow/bake-shadows",{"title":349,"path":350,"stem":351},"Circle Shadow","/api/light-shadow/circle-shadow","2.api/7.light-shadow/circle-shadow",{"title":353,"path":354,"stem":355},"Contact Shadows","/api/light-shadow/contact-shadows","2.api/7.light-shadow/contact-shadows",{"title":357,"path":358,"stem":359},"Lensflare","/api/light-shadow/lensflare","2.api/7.light-shadow/lensflare",{"title":361,"path":362,"stem":363},"Randomized Lights","/api/light-shadow/randomized-lights","2.api/7.light-shadow/randomized-lights",{"title":365,"path":366,"stem":367},"Soft Shadows","/api/light-shadow/soft-shadows","2.api/7.light-shadow/soft-shadows",{"title":369,"path":370,"stem":371,"children":372},"Staging","/api/staging","2.api/8.staging/index",[373,374,378,382,386,390,394,398,402,406,410,414],{"title":369,"path":370,"stem":371},{"title":375,"path":376,"stem":377},"Environment","/api/staging/environment","2.api/8.staging/1.environment",{"title":379,"path":380,"stem":381},"useEnvironment","/api/staging/use-environment","2.api/8.staging/2.use-environment",{"title":383,"path":384,"stem":385},"Lightformer","/api/staging/lightformer","2.api/8.staging/3.lightformer",{"title":387,"path":388,"stem":389},"Backdrop","/api/staging/backdrop","2.api/8.staging/backdrop",{"title":391,"path":392,"stem":393},"Ocean","/api/staging/ocean","2.api/8.staging/ocean",{"title":395,"path":396,"stem":397},"Precipitation","/api/staging/precipitation","2.api/8.staging/precipitation",{"title":399,"path":400,"stem":401},"Sky","/api/staging/sky","2.api/8.staging/sky",{"title":403,"path":404,"stem":405},"Smoke","/api/staging/smoke","2.api/8.staging/smoke",{"title":407,"path":408,"stem":409},"Sparkles","/api/staging/sparkles","2.api/8.staging/sparkles",{"title":411,"path":412,"stem":413},"Stage","/api/staging/stage","2.api/8.staging/stage",{"title":415,"path":416,"stem":417},"Stars","/api/staging/stars","2.api/8.staging/stars",{"title":419,"path":420,"stem":421,"children":422},"Objects","/api/objects","2.api/9.objects/index",[423,424,428,432,436,440,444,448,452,456,460],{"title":419,"path":420,"stem":421},{"title":425,"path":426,"stem":427},"AnimatedSprite","/api/objects/animated-sprite","2.api/9.objects/animated-sprite",{"title":429,"path":430,"stem":431},"CubeCamera","/api/objects/cube-camera","2.api/9.objects/cube-camera",{"title":433,"path":434,"stem":435},"Fbo","/api/objects/fbo","2.api/9.objects/fbo",{"title":437,"path":438,"stem":439},"GradientTexture","/api/objects/gradient-texture","2.api/9.objects/gradient-texture",{"title":441,"path":442,"stem":443},"HTML","/api/objects/html","2.api/9.objects/html",{"title":445,"path":446,"stem":447},"Image","/api/objects/image","2.api/9.objects/image",{"title":449,"path":450,"stem":451},"MarchingCubes","/api/objects/marching-cubes","2.api/9.objects/marching-cubes",{"title":453,"path":454,"stem":455},"Reflector","/api/objects/reflector","2.api/9.objects/reflector",{"title":457,"path":458,"stem":459},"Refractor","/api/objects/refractor","2.api/9.objects/refractor",{"title":461,"path":462,"stem":463},"Text3D","/api/objects/text-3d","2.api/9.objects/text-3d",{"title":465,"path":466,"stem":467,"children":468},"Miscellaneous","/api/miscellaneous","2.api/miscellaneous/index",[469,470,474,478,482,486,490,494],{"title":465,"path":466,"stem":467},{"title":471,"path":472,"stem":473},"Bounds","/api/miscellaneous/bounds","2.api/miscellaneous/bounds",{"title":475,"path":476,"stem":477},"GlobalAudio","/api/miscellaneous/global-audio","2.api/miscellaneous/global-audio",{"title":479,"path":480,"stem":481},"MouseParallax","/api/miscellaneous/mouse-parallax","2.api/miscellaneous/mouse-parallax",{"title":483,"path":484,"stem":485},"PositionalAudio","/api/miscellaneous/positional-audio","2.api/miscellaneous/positional-audio",{"title":487,"path":488,"stem":489},"useAnimations","/api/miscellaneous/use-animations","2.api/miscellaneous/use-animations",{"title":491,"path":492,"stem":493},"useGLTFExporter","/api/miscellaneous/use-gltf-exporter","2.api/miscellaneous/use-gltf-exporter",{"title":495,"path":496,"stem":497},"useIntersect","/api/miscellaneous/use-intersect","2.api/miscellaneous/use-intersect",{"id":499,"title":133,"body":500,"description":1671,"extension":1672,"links":1673,"meta":1674,"navigation":609,"path":134,"seo":1675,"stem":135,"__hash__":1676},"docs/2.api/3.loaders/1.use-gltf.md",{"type":501,"value":502,"toc":1663},"minimark",[503,509,518,522,982,1000,1080,1084,1231,1235,1308,1312,1315,1411,1414,1418,1435,1599,1609,1613,1622,1653,1659],[504,505,506],"scene-wrapper",{},[507,508],"loaders-gltf",{},[510,511,512,513,517],"p",{},"A composable that allows you to easily load glb/glTF models into your ",[514,515,516],"strong",{},"TresJS"," scene.",[519,520,15],"h2",{"id":521},"usage",[523,524,525,732],"code-group",{},[526,527,536],"pre",{"className":528,"code":529,"filename":530,"highlights":531,"language":534,"meta":535,"style":535},"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",[532,533],2,5,"vue","",[537,538,539,574,604,611,629,662,672,677,687,723],"code",{"__ignoreMap":535},[540,541,544,548,552,556,559,562,565,569,571],"span",{"class":542,"line":543},"line",1,[540,545,547],{"class":546},"sMK4o","\u003C",[540,549,551],{"class":550},"swJcz","script",[540,553,555],{"class":554},"spNyl"," setup",[540,557,558],{"class":554}," lang",[540,560,561],{"class":546},"=",[540,563,564],{"class":546},"\"",[540,566,568],{"class":567},"sfazB","ts",[540,570,564],{"class":546},[540,572,573],{"class":546},">\n",[540,575,578,582,585,589,592,595,598,601],{"class":576,"line":532},[542,577],"highlight",[540,579,581],{"class":580},"s7zQu","import",[540,583,584],{"class":546}," {",[540,586,588],{"class":587},"sTEyZ"," useGLTF",[540,590,591],{"class":546}," }",[540,593,594],{"class":580}," from",[540,596,597],{"class":546}," '",[540,599,600],{"class":567},"@tresjs/cientos",[540,602,603],{"class":546},"'\n",[540,605,607],{"class":542,"line":606},3,[540,608,610],{"emptyLinePlaceholder":609},true,"\n",[540,612,614,617,620,622,624,627],{"class":542,"line":613},4,[540,615,616],{"class":554},"const",[540,618,619],{"class":587}," path ",[540,621,561],{"class":546},[540,623,597],{"class":546},[540,625,626],{"class":567},"./blender-cube.glb",[540,628,603],{"class":546},[540,630,632,634,636,639,642,645,647,650,653,656,659],{"class":631,"line":533},[542,577],[540,633,616],{"class":554},[540,635,584],{"class":546},[540,637,638],{"class":587}," state",[540,640,641],{"class":546},",",[540,643,644],{"class":587}," nodes",[540,646,641],{"class":546},[540,648,649],{"class":587}," materials ",[540,651,652],{"class":546},"}",[540,654,655],{"class":546}," =",[540,657,588],{"class":658},"s2Zo4",[540,660,661],{"class":587},"(path)\n",[540,663,665,668,670],{"class":542,"line":664},6,[540,666,667],{"class":546},"\u003C/",[540,669,551],{"class":550},[540,671,573],{"class":546},[540,673,675],{"class":542,"line":674},7,[540,676,610],{"emptyLinePlaceholder":609},[540,678,680,682,685],{"class":542,"line":679},8,[540,681,547],{"class":546},[540,683,684],{"class":550},"template",[540,686,573],{"class":546},[540,688,690,693,696,699,701,703,706,708,711,713,715,718,720],{"class":542,"line":689},9,[540,691,692],{"class":546},"  \u003C",[540,694,695],{"class":550},"primitive",[540,697,698],{"class":554}," v-if",[540,700,561],{"class":546},[540,702,564],{"class":546},[540,704,705],{"class":567},"state",[540,707,564],{"class":546},[540,709,710],{"class":554}," :object",[540,712,561],{"class":546},[540,714,564],{"class":546},[540,716,717],{"class":567},"state?.scene",[540,719,564],{"class":546},[540,721,722],{"class":546}," />\n",[540,724,726,728,730],{"class":542,"line":725},10,[540,727,667],{"class":546},[540,729,684],{"class":550},[540,731,573],{"class":546},[526,733,736],{"className":528,"code":734,"filename":735,"language":534,"meta":535,"style":535},"\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",[537,737,738,758,777,797,814,822,826,834,855,877,886,896,904,920,935,941,963,973],{"__ignoreMap":535},[540,739,740,742,744,746,748,750,752,754,756],{"class":542,"line":543},[540,741,547],{"class":546},[540,743,551],{"class":550},[540,745,555],{"class":554},[540,747,558],{"class":554},[540,749,561],{"class":546},[540,751,564],{"class":546},[540,753,568],{"class":567},[540,755,564],{"class":546},[540,757,573],{"class":546},[540,759,760,762,764,767,769,771,773,775],{"class":542,"line":532},[540,761,581],{"class":580},[540,763,584],{"class":546},[540,765,766],{"class":587}," OrbitControls",[540,768,591],{"class":546},[540,770,594],{"class":580},[540,772,597],{"class":546},[540,774,600],{"class":567},[540,776,603],{"class":546},[540,778,779,781,783,786,788,790,792,795],{"class":542,"line":606},[540,780,581],{"class":580},[540,782,584],{"class":546},[540,784,785],{"class":587}," TresCanvas",[540,787,591],{"class":546},[540,789,594],{"class":580},[540,791,597],{"class":546},[540,793,794],{"class":567},"@tresjs/core",[540,796,603],{"class":546},[540,798,799,801,804,807,809,812],{"class":542,"line":613},[540,800,581],{"class":580},[540,802,803],{"class":587}," TheModel ",[540,805,806],{"class":580},"from",[540,808,597],{"class":546},[540,810,811],{"class":567},"./TheModel.vue",[540,813,603],{"class":546},[540,815,816,818,820],{"class":542,"line":533},[540,817,667],{"class":546},[540,819,551],{"class":550},[540,821,573],{"class":546},[540,823,824],{"class":542,"line":664},[540,825,610],{"emptyLinePlaceholder":609},[540,827,828,830,832],{"class":542,"line":674},[540,829,547],{"class":546},[540,831,684],{"class":550},[540,833,573],{"class":546},[540,835,836,838,841,844,846,848,851,853],{"class":542,"line":679},[540,837,692],{"class":546},[540,839,840],{"class":550},"TresCanvas",[540,842,843],{"class":554}," clear-color",[540,845,561],{"class":546},[540,847,564],{"class":546},[540,849,850],{"class":567},"#F78B3D",[540,852,564],{"class":546},[540,854,573],{"class":546},[540,856,857,860,863,866,868,870,873,875],{"class":542,"line":689},[540,858,859],{"class":546},"    \u003C",[540,861,862],{"class":550},"TresPerspectiveCamera",[540,864,865],{"class":554}," :position",[540,867,561],{"class":546},[540,869,564],{"class":546},[540,871,872],{"class":567},"[3, 2, 5]",[540,874,564],{"class":546},[540,876,722],{"class":546},[540,878,879,881,884],{"class":542,"line":725},[540,880,859],{"class":546},[540,882,883],{"class":550},"OrbitControls",[540,885,722],{"class":546},[540,887,889,891,894],{"class":542,"line":888},11,[540,890,859],{"class":546},[540,892,893],{"class":550},"TheModel",[540,895,722],{"class":546},[540,897,899,901],{"class":542,"line":898},12,[540,900,859],{"class":546},[540,902,903],{"class":550},"TresDirectionalLight\n",[540,905,907,910,912,914,917],{"class":542,"line":906},13,[540,908,909],{"class":554},"      :intensity",[540,911,561],{"class":546},[540,913,564],{"class":546},[540,915,916],{"class":567},"2",[540,918,919],{"class":546},"\"\n",[540,921,923,926,928,930,933],{"class":542,"line":922},14,[540,924,925],{"class":554},"      :position",[540,927,561],{"class":546},[540,929,564],{"class":546},[540,931,932],{"class":567},"[3, 3, 3]",[540,934,919],{"class":546},[540,936,938],{"class":542,"line":937},15,[540,939,940],{"class":546},"    />\n",[540,942,944,946,949,952,954,956,959,961],{"class":542,"line":943},16,[540,945,859],{"class":546},[540,947,948],{"class":550},"TresAmbientLight",[540,950,951],{"class":554}," :intensity",[540,953,561],{"class":546},[540,955,564],{"class":546},[540,957,958],{"class":567},"1",[540,960,564],{"class":546},[540,962,722],{"class":546},[540,964,966,969,971],{"class":542,"line":965},17,[540,967,968],{"class":546},"  \u003C/",[540,970,840],{"class":550},[540,972,573],{"class":546},[540,974,976,978,980],{"class":542,"line":975},18,[540,977,667],{"class":546},[540,979,684],{"class":550},[540,981,573],{"class":546},[510,983,984,985,987,988,991,992,999],{},"An advantage of using ",[537,986,133],{}," is that you can pass a ",[537,989,990],{},"draco"," prop to enable ",[993,994,998],"a",{"href":995,"rel":996},"https://threejs.org/docs/index.html?q=drac#examples/en/loaders/DRACOLoader",[997],"nofollow","Draco compression"," for the model. This will reduce the size of the model and improve performance.",[526,1001,1004],{"className":1002,"code":1003,"language":568,"meta":535,"style":535},"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",[537,1005,1006,1024,1028],{"__ignoreMap":535},[540,1007,1008,1010,1012,1014,1016,1018,1020,1022],{"class":542,"line":543},[540,1009,581],{"class":580},[540,1011,584],{"class":546},[540,1013,588],{"class":587},[540,1015,591],{"class":546},[540,1017,594],{"class":580},[540,1019,597],{"class":546},[540,1021,600],{"class":567},[540,1023,603],{"class":546},[540,1025,1026],{"class":542,"line":532},[540,1027,610],{"emptyLinePlaceholder":609},[540,1029,1030,1032,1034,1036,1038,1040,1042,1044,1046,1048,1050,1053,1056,1059,1061,1063,1065,1068,1071,1075,1077],{"class":542,"line":606},[540,1031,616],{"class":554},[540,1033,584],{"class":546},[540,1035,638],{"class":587},[540,1037,641],{"class":546},[540,1039,644],{"class":587},[540,1041,641],{"class":546},[540,1043,649],{"class":587},[540,1045,652],{"class":546},[540,1047,655],{"class":546},[540,1049,588],{"class":658},[540,1051,1052],{"class":587},"(",[540,1054,1055],{"class":546},"'",[540,1057,1058],{"class":567},"/models/AkuAku.gltf",[540,1060,1055],{"class":546},[540,1062,641],{"class":546},[540,1064,584],{"class":546},[540,1066,1067],{"class":550}," draco",[540,1069,1070],{"class":546},":",[540,1072,1074],{"class":1073},"sfNiH"," true",[540,1076,591],{"class":546},[540,1078,1079],{"class":587},")\n",[519,1081,1083],{"id":1082},"return-values","Return Values",[1085,1086,1087,1104],"table",{},[1088,1089,1090],"thead",{},[1091,1092,1093,1098,1101],"tr",{},[1094,1095,1097],"th",{"align":1096},"left","Name",[1094,1099,1100],{},"Type",[1094,1102,1103],{},"Description",[1105,1106,1107,1126,1141,1156,1171,1186,1201,1216],"tbody",{},[1091,1108,1109,1114,1119],{},[1110,1111,1112],"td",{"align":1096},[514,1113,705],{},[1110,1115,1116],{},[537,1117,1118],{},"Ref\u003CGLTF | null>",[1110,1120,1121,1122,1125],{},"The loaded GLTF, or ",[537,1123,1124],{},"null"," until it arrives",[1091,1127,1128,1133,1138],{},[1110,1129,1130],{"align":1096},[514,1131,1132],{},"nodes",[1110,1134,1135],{},[537,1136,1137],{},"ComputedRef\u003CTNodes>",[1110,1139,1140],{},"All nodes in the scene, keyed by name",[1091,1142,1143,1148,1153],{},[1110,1144,1145],{"align":1096},[514,1146,1147],{},"materials",[1110,1149,1150],{},[537,1151,1152],{},"ComputedRef\u003CTMaterials>",[1110,1154,1155],{},"All materials in the scene, keyed by name",[1091,1157,1158,1163,1168],{},[1110,1159,1160],{"align":1096},[514,1161,1162],{},"isLoading",[1110,1164,1165],{},[537,1166,1167],{},"Ref\u003Cboolean>",[1110,1169,1170],{},"Whether the model is currently loading",[1091,1172,1173,1178,1183],{},[1110,1174,1175],{"align":1096},[514,1176,1177],{},"error",[1110,1179,1180],{},[537,1181,1182],{},"Ref\u003Cunknown>",[1110,1184,1185],{},"Whatever the loader threw, if anything",[1091,1187,1188,1193,1198],{},[1110,1189,1190],{"align":1096},[514,1191,1192],{},"progress",[1110,1194,1195],{},[537,1196,1197],{},"{ loaded: number, total: number, percentage: number }",[1110,1199,1200],{},"Progress of the current load",[1091,1202,1203,1208,1213],{},[1110,1204,1205],{"align":1096},[514,1206,1207],{},"load",[1110,1209,1210],{},[537,1211,1212],{},"(path: string) => void",[1110,1214,1215],{},"Load a different model into the same state",[1091,1217,1218,1223,1228],{},[1110,1219,1220],{"align":1096},[514,1221,1222],{},"execute",[1110,1224,1225],{},[537,1226,1227],{},"(delay?: number) => Promise\u003CGLTF>",[1110,1229,1230],{},"Re-run the load",[519,1232,1234],{"id":1233},"options","Options",[1085,1236,1237,1250],{},[1088,1238,1239],{},[1091,1240,1241,1243,1245,1248],{},[1094,1242,1097],{"align":1096},[1094,1244,1100],{},[1094,1246,1247],{},"Default",[1094,1249,1103],{},[1105,1251,1252,1271,1291],{},[1091,1253,1254,1258,1263,1268],{},[1110,1255,1256],{"align":1096},[514,1257,990],{},[1110,1259,1260],{},[537,1261,1262],{},"boolean",[1110,1264,1265],{},[537,1266,1267],{},"false",[1110,1269,1270],{},"Whether to enable Draco compression.",[1091,1272,1273,1278,1283,1288],{},[1110,1274,1275],{"align":1096},[514,1276,1277],{},"decoderPath",[1110,1279,1280],{},[537,1281,1282],{},"string",[1110,1284,1285],{},[537,1286,1287],{},"'https://www.gstatic.com/draco/versioned/decoders/1.5.6/'",[1110,1289,1290],{},"Path to the Draco decoder.",[1091,1292,1293,1298,1303,1305],{},[1110,1294,1295],{"align":1096},[514,1296,1297],{},"traverse",[1110,1299,1300],{},[537,1301,1302],{},"Function",[1110,1304],{},[1110,1306,1307],{},"A traverse function applied to the scene upon loading the model.",[519,1309,1311],{"id":1310},"accessing-nodes-and-materials","Accessing Nodes and Materials",[510,1313,1314],{},"The composable provides computed properties to easily access nodes and materials in your scene:",[526,1316,1318],{"className":1002,"code":1317,"language":568,"meta":535,"style":535},"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",[537,1319,1320,1349,1353,1359,1381,1385,1390],{"__ignoreMap":535},[540,1321,1322,1324,1326,1328,1330,1332,1334,1336,1338,1340,1342,1345,1347],{"class":542,"line":543},[540,1323,616],{"class":554},[540,1325,584],{"class":546},[540,1327,644],{"class":587},[540,1329,641],{"class":546},[540,1331,649],{"class":587},[540,1333,652],{"class":546},[540,1335,655],{"class":546},[540,1337,588],{"class":658},[540,1339,1052],{"class":587},[540,1341,1055],{"class":546},[540,1343,1344],{"class":567},"/model.glb",[540,1346,1055],{"class":546},[540,1348,1079],{"class":587},[540,1350,1351],{"class":542,"line":532},[540,1352,610],{"emptyLinePlaceholder":609},[540,1354,1355],{"class":542,"line":606},[540,1356,1358],{"class":1357},"sHwdD","// Access a specific node\n",[540,1360,1361,1363,1366,1368,1370,1373,1376,1378],{"class":542,"line":613},[540,1362,616],{"class":554},[540,1364,1365],{"class":587}," mesh ",[540,1367,561],{"class":546},[540,1369,644],{"class":587},[540,1371,1372],{"class":546},".",[540,1374,1375],{"class":587},"value",[540,1377,1372],{"class":546},[540,1379,1380],{"class":587},"MeshName\n",[540,1382,1383],{"class":542,"line":533},[540,1384,610],{"emptyLinePlaceholder":609},[540,1386,1387],{"class":542,"line":664},[540,1388,1389],{"class":1357},"// Access a specific material\n",[540,1391,1392,1394,1397,1399,1402,1404,1406,1408],{"class":542,"line":674},[540,1393,616],{"class":554},[540,1395,1396],{"class":587}," material ",[540,1398,561],{"class":546},[540,1400,1401],{"class":587}," materials",[540,1403,1372],{"class":546},[540,1405,1375],{"class":587},[540,1407,1372],{"class":546},[540,1409,1410],{"class":587},"MaterialName\n",[510,1412,1413],{},"This makes it easier to manipulate specific parts of your model or apply materials programmatically.",[519,1415,1417],{"id":1416},"typing-nodes-and-materials","Typing Nodes and Materials",[510,1419,1420,1421,1423,1424,1426,1427,1430,1431,1434],{},"The keys of ",[537,1422,1132],{}," and ",[537,1425,1147],{}," come from the file, so by default both are a loose record and\n",[537,1428,1429],{},"nodes.value.Body"," is an ",[537,1432,1433],{},"any",". Pass the shape of your model as generics to get them typed:",[526,1436,1438],{"className":1002,"code":1437,"language":568,"meta":535,"style":535},"import type { Mesh, MeshStandardMaterial } from 'three'\nimport { useGLTF } from '@tresjs/cientos'\n\ninterface ModelNodes { Body: Mesh }\ninterface ModelMaterials { Skin: MeshStandardMaterial }\n\nconst { nodes, materials } = useGLTF\u003CModelNodes, ModelMaterials>('/models/robot.glb')\n\nnodes.value.Body.geometry // Mesh, not any\n",[537,1439,1440,1468,1486,1490,1511,1529,1533,1574,1578],{"__ignoreMap":535},[540,1441,1442,1444,1447,1449,1452,1454,1457,1459,1461,1463,1466],{"class":542,"line":543},[540,1443,581],{"class":580},[540,1445,1446],{"class":580}," type",[540,1448,584],{"class":546},[540,1450,1451],{"class":587}," Mesh",[540,1453,641],{"class":546},[540,1455,1456],{"class":587}," MeshStandardMaterial",[540,1458,591],{"class":546},[540,1460,594],{"class":580},[540,1462,597],{"class":546},[540,1464,1465],{"class":567},"three",[540,1467,603],{"class":546},[540,1469,1470,1472,1474,1476,1478,1480,1482,1484],{"class":542,"line":532},[540,1471,581],{"class":580},[540,1473,584],{"class":546},[540,1475,588],{"class":587},[540,1477,591],{"class":546},[540,1479,594],{"class":580},[540,1481,597],{"class":546},[540,1483,600],{"class":567},[540,1485,603],{"class":546},[540,1487,1488],{"class":542,"line":606},[540,1489,610],{"emptyLinePlaceholder":609},[540,1491,1492,1495,1499,1501,1504,1506,1508],{"class":542,"line":613},[540,1493,1494],{"class":554},"interface",[540,1496,1498],{"class":1497},"sBMFI"," ModelNodes",[540,1500,584],{"class":546},[540,1502,1503],{"class":550}," Body",[540,1505,1070],{"class":546},[540,1507,1451],{"class":1497},[540,1509,1510],{"class":546}," }\n",[540,1512,1513,1515,1518,1520,1523,1525,1527],{"class":542,"line":533},[540,1514,1494],{"class":554},[540,1516,1517],{"class":1497}," ModelMaterials",[540,1519,584],{"class":546},[540,1521,1522],{"class":550}," Skin",[540,1524,1070],{"class":546},[540,1526,1456],{"class":1497},[540,1528,1510],{"class":546},[540,1530,1531],{"class":542,"line":664},[540,1532,610],{"emptyLinePlaceholder":609},[540,1534,1535,1537,1539,1541,1543,1545,1547,1549,1551,1553,1556,1558,1560,1563,1565,1567,1570,1572],{"class":542,"line":674},[540,1536,616],{"class":554},[540,1538,584],{"class":546},[540,1540,644],{"class":587},[540,1542,641],{"class":546},[540,1544,649],{"class":587},[540,1546,652],{"class":546},[540,1548,655],{"class":546},[540,1550,588],{"class":658},[540,1552,547],{"class":546},[540,1554,1555],{"class":1497},"ModelNodes",[540,1557,641],{"class":546},[540,1559,1517],{"class":1497},[540,1561,1562],{"class":546},">",[540,1564,1052],{"class":587},[540,1566,1055],{"class":546},[540,1568,1569],{"class":567},"/models/robot.glb",[540,1571,1055],{"class":546},[540,1573,1079],{"class":587},[540,1575,1576],{"class":542,"line":679},[540,1577,610],{"emptyLinePlaceholder":609},[540,1579,1580,1582,1584,1586,1588,1591,1593,1596],{"class":542,"line":689},[540,1581,1132],{"class":587},[540,1583,1372],{"class":546},[540,1585,1375],{"class":587},[540,1587,1372],{"class":546},[540,1589,1590],{"class":587},"Body",[540,1592,1372],{"class":546},[540,1594,1595],{"class":587},"geometry ",[540,1597,1598],{"class":1357},"// Mesh, not any\n",[1600,1601,1602],"prose-note",{},[510,1603,1604,1605,1608],{},"These interfaces are a claim about the model, not a proof: nothing checks them against the file at\nruntime. ",[537,1606,1607],{},"tres gltf"," reads them off the model and writes them for you, which is the only version\nof this that cannot drift.",[519,1610,1612],{"id":1611},"generating-a-component-instead","Generating a Component Instead",[510,1614,1615,1616,1621],{},"For a whole model, writing an element per node by hand does not scale. The\n",[993,1617,1620],{"href":1618,"rel":1619},"https://docs.tresjs.org/cli/gltf",[997],"TresJS CLI"," generates that component from the model itself,\ntyped, with a slot for every node so your overrides survive the next export:",[526,1623,1627],{"className":1624,"code":1625,"language":1626,"meta":535,"style":535},"language-bash shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","npx @tresjs/cli gltf public/models/robot.glb\n# ✔ src/models/Robot.gen.vue\n#   3 slots: Head, Body, Base\n","bash",[537,1628,1629,1643,1648],{"__ignoreMap":535},[540,1630,1631,1634,1637,1640],{"class":542,"line":543},[540,1632,1633],{"class":1497},"npx",[540,1635,1636],{"class":567}," @tresjs/cli",[540,1638,1639],{"class":567}," gltf",[540,1641,1642],{"class":567}," public/models/robot.glb\n",[540,1644,1645],{"class":542,"line":532},[540,1646,1647],{"class":1357},"# ✔ src/models/Robot.gen.vue\n",[540,1649,1650],{"class":542,"line":606},[540,1651,1652],{"class":1357},"#   3 slots: Head, Body, Base\n",[1654,1655,1656],"read-more",{"to":20},[510,1657,1658],{},"The three ways to load a model, and when to reach for each one.",[1660,1661,1662],"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 .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}html pre.shiki code .sBMFI, html code.shiki .sBMFI{--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B}",{"title":535,"searchDepth":543,"depth":532,"links":1664},[1665,1666,1667,1668,1669,1670],{"id":521,"depth":532,"text":15},{"id":1082,"depth":532,"text":1083},{"id":1233,"depth":532,"text":1234},{"id":1310,"depth":532,"text":1311},{"id":1416,"depth":532,"text":1417},{"id":1611,"depth":532,"text":1612},"A composable to load GLTF models in TresJS scenes.","md",null,{},{"title":133,"description":1671},"mVv2TZo5-pqLqIwJ-gYXHQx7OoCZ9HEO3CnPATpAwMA",[1678,1680],{"title":127,"path":128,"stem":129,"description":1679,"children":-1},"Asset loading composables for TresJS scenes.",{"title":137,"path":138,"stem":139,"description":1681,"children":-1},"A component based on useGLTF to load models in TresJS scenes.",1787004678488]