[{"data":1,"prerenderedAt":4747},["ShallowReactive",2],{"navigation":3,"/api/miscellaneous":470,"/api/miscellaneous-surround":495,"misc-list":500},[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,114,156,190,284,310,344,394,436],{"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,110],{"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},"Drag Controls","/api/controls/drag-controls","2.api/2.controls/drag-controls",{"title":95,"path":96,"stem":97},"Keyboard Controls","/api/controls/keyboard-controls","2.api/2.controls/keyboard-controls",{"title":99,"path":100,"stem":101},"Map Controls","/api/controls/map-controls","2.api/2.controls/map-controls",{"title":103,"path":104,"stem":105},"Orbit Controls","/api/controls/orbit-controls","2.api/2.controls/orbit-controls",{"title":107,"path":108,"stem":109},"PointerLock Controls","/api/controls/pointer-lock-controls","2.api/2.controls/pointer-lock-controls",{"title":111,"path":112,"stem":113},"Transform Controls","/api/controls/transform-controls","2.api/2.controls/transform-controls",{"title":115,"path":116,"stem":117,"children":118},"Loaders","/api/loaders","2.api/3.loaders/index",[119,120,124,128,132,136,140,144,148,152],{"title":115,"path":116,"stem":117},{"title":121,"path":122,"stem":123},"useGLTF","/api/loaders/use-gltf","2.api/3.loaders/1.use-gltf",{"title":125,"path":126,"stem":127},"GLTFModel","/api/loaders/gltf-model","2.api/3.loaders/2.gltf-model",{"title":129,"path":130,"stem":131},"useFBX","/api/loaders/use-fbx","2.api/3.loaders/3.use-fbx",{"title":133,"path":134,"stem":135},"FBXModel","/api/loaders/fbx-model","2.api/3.loaders/4.fbx-model",{"title":137,"path":138,"stem":139},"useTexture","/api/loaders/use-texture","2.api/3.loaders/5.use-texture",{"title":141,"path":142,"stem":143},"useTextures","/api/loaders/use-textures","2.api/3.loaders/6.use-textures",{"title":145,"path":146,"stem":147},"useSVG","/api/loaders/use-svg","2.api/3.loaders/7.use-svg",{"title":149,"path":150,"stem":151},"useProgress","/api/loaders/use-progress","2.api/3.loaders/use-progress",{"title":153,"path":154,"stem":155},"useVideoTexture","/api/loaders/use-video-texture","2.api/3.loaders/use-video-texture",{"title":157,"path":158,"stem":159,"children":160},"Materials","/api/materials","2.api/4.materials/index",[161,162,166,170,174,178,182,186],{"title":157,"path":158,"stem":159},{"title":163,"path":164,"stem":165},"Custom Shader Material","/api/materials/custom-shader-material","2.api/4.materials/custom-shader-material",{"title":167,"path":168,"stem":169},"Mesh Glass Material","/api/materials/glass-material","2.api/4.materials/glass-material",{"title":171,"path":172,"stem":173},"Holographic Material","/api/materials/holographic-material","2.api/4.materials/holographic-material",{"title":175,"path":176,"stem":177},"Mesh Discard Material","/api/materials/mesh-discard-material","2.api/4.materials/mesh-discard-material",{"title":179,"path":180,"stem":181},"Mesh Reflection Material","/api/materials/mesh-reflection-material","2.api/4.materials/mesh-reflection-material",{"title":183,"path":184,"stem":185},"Point Material","/api/materials/point-material","2.api/4.materials/point-material",{"title":187,"path":188,"stem":189},"Wobble Material","/api/materials/wobble-material","2.api/4.materials/wobble-material",{"title":191,"path":192,"stem":193,"children":194},"Shapes","/api/shapes","2.api/5.shapes/index",[195,196,200,204,208,212,216,220,224,228,232,236,240,244,248,252,256,260,264,268,272,276,280],{"title":191,"path":192,"stem":193},{"title":197,"path":198,"stem":199},"Box","/api/shapes/box","2.api/5.shapes/box",{"title":201,"path":202,"stem":203},"CatmullRomCurve3","/api/shapes/catmullromcurve3","2.api/5.shapes/catmullromcurve3",{"title":205,"path":206,"stem":207},"Circle","/api/shapes/circle","2.api/5.shapes/circle",{"title":209,"path":210,"stem":211},"Cone","/api/shapes/cone","2.api/5.shapes/cone",{"title":213,"path":214,"stem":215},"Cubic Bezier Line","/api/shapes/cubic-bezier-line","2.api/5.shapes/cubic-bezier-line",{"title":217,"path":218,"stem":219},"Cylinder","/api/shapes/cylinder","2.api/5.shapes/cylinder",{"title":221,"path":222,"stem":223},"Dodecahedron","/api/shapes/dodecahedron","2.api/5.shapes/dodecahedron",{"title":225,"path":226,"stem":227},"Grid","/api/shapes/grid","2.api/5.shapes/grid",{"title":229,"path":230,"stem":231},"Icosahedron","/api/shapes/icosahedron","2.api/5.shapes/icosahedron",{"title":233,"path":234,"stem":235},"Line2","/api/shapes/line2","2.api/5.shapes/line2",{"title":237,"path":238,"stem":239},"Octahedron","/api/shapes/octahedron","2.api/5.shapes/octahedron",{"title":241,"path":242,"stem":243},"Plane","/api/shapes/plane","2.api/5.shapes/plane",{"title":245,"path":246,"stem":247},"Quadratic Bezier Line","/api/shapes/quadratic-bezier-line","2.api/5.shapes/quadratic-bezier-line",{"title":249,"path":250,"stem":251},"Ring","/api/shapes/ring","2.api/5.shapes/ring",{"title":253,"path":254,"stem":255},"Rounded Box","/api/shapes/rounded-box","2.api/5.shapes/rounded-box",{"title":257,"path":258,"stem":259},"Screen Quad","/api/shapes/screen-quad","2.api/5.shapes/screen-quad",{"title":261,"path":262,"stem":263},"Sphere","/api/shapes/sphere","2.api/5.shapes/sphere",{"title":265,"path":266,"stem":267},"Superformula","/api/shapes/superformula","2.api/5.shapes/superformula",{"title":269,"path":270,"stem":271},"Tetrahedron","/api/shapes/tetrahedron","2.api/5.shapes/tetrahedron",{"title":273,"path":274,"stem":275},"Torus","/api/shapes/torus","2.api/5.shapes/torus",{"title":277,"path":278,"stem":279},"Torus Knot","/api/shapes/torus-knot","2.api/5.shapes/torus-knot",{"title":281,"path":282,"stem":283},"Tube","/api/shapes/tube","2.api/5.shapes/tube",{"title":285,"path":286,"stem":287,"children":288},"Debug/Performance","/api/debug-performance","2.api/6.debug-performance/index",[289,290,294,298,302,306],{"title":285,"path":286,"stem":287},{"title":291,"path":292,"stem":293},"Helper","/api/debug-performance/helper","2.api/6.debug-performance/helper",{"title":295,"path":296,"stem":297},"LOD","/api/debug-performance/lod","2.api/6.debug-performance/lod",{"title":299,"path":300,"stem":301},"Stats","/api/debug-performance/stats","2.api/6.debug-performance/stats",{"title":303,"path":304,"stem":305},"StatsGl","/api/debug-performance/stats-gl","2.api/6.debug-performance/stats-gl",{"title":307,"path":308,"stem":309},"useBVH","/api/debug-performance/use-bvh","2.api/6.debug-performance/use-bvh",{"title":311,"path":312,"stem":313,"children":314},"Light/Shadow","/api/light-shadow","2.api/7.light-shadow/index",[315,316,320,324,328,332,336,340],{"title":311,"path":312,"stem":313},{"title":317,"path":318,"stem":319},"Accumulative Shadows","/api/light-shadow/accumulative-shadows","2.api/7.light-shadow/accumulative-shadows",{"title":321,"path":322,"stem":323},"Bake Shadows","/api/light-shadow/bake-shadows","2.api/7.light-shadow/bake-shadows",{"title":325,"path":326,"stem":327},"Circle Shadow","/api/light-shadow/circle-shadow","2.api/7.light-shadow/circle-shadow",{"title":329,"path":330,"stem":331},"Contact Shadows","/api/light-shadow/contact-shadows","2.api/7.light-shadow/contact-shadows",{"title":333,"path":334,"stem":335},"Lensflare","/api/light-shadow/lensflare","2.api/7.light-shadow/lensflare",{"title":337,"path":338,"stem":339},"Randomized Lights","/api/light-shadow/randomized-lights","2.api/7.light-shadow/randomized-lights",{"title":341,"path":342,"stem":343},"Soft Shadows","/api/light-shadow/soft-shadows","2.api/7.light-shadow/soft-shadows",{"title":345,"path":346,"stem":347,"children":348},"Staging","/api/staging","2.api/8.staging/index",[349,350,354,358,362,366,370,374,378,382,386,390],{"title":345,"path":346,"stem":347},{"title":351,"path":352,"stem":353},"Environment","/api/staging/environment","2.api/8.staging/1.environment",{"title":355,"path":356,"stem":357},"useEnvironment","/api/staging/use-environment","2.api/8.staging/2.use-environment",{"title":359,"path":360,"stem":361},"Lightformer","/api/staging/lightformer","2.api/8.staging/3.lightformer",{"title":363,"path":364,"stem":365},"Backdrop","/api/staging/backdrop","2.api/8.staging/backdrop",{"title":367,"path":368,"stem":369},"Ocean","/api/staging/ocean","2.api/8.staging/ocean",{"title":371,"path":372,"stem":373},"Precipitation","/api/staging/precipitation","2.api/8.staging/precipitation",{"title":375,"path":376,"stem":377},"Sky","/api/staging/sky","2.api/8.staging/sky",{"title":379,"path":380,"stem":381},"Smoke","/api/staging/smoke","2.api/8.staging/smoke",{"title":383,"path":384,"stem":385},"Sparkles","/api/staging/sparkles","2.api/8.staging/sparkles",{"title":387,"path":388,"stem":389},"Stage","/api/staging/stage","2.api/8.staging/stage",{"title":391,"path":392,"stem":393},"Stars","/api/staging/stars","2.api/8.staging/stars",{"title":395,"path":396,"stem":397,"children":398},"Objects","/api/objects","2.api/9.objects/index",[399,400,404,408,412,416,420,424,428,432],{"title":395,"path":396,"stem":397},{"title":401,"path":402,"stem":403},"AnimatedSprite","/api/objects/animated-sprite","2.api/9.objects/animated-sprite",{"title":405,"path":406,"stem":407},"CubeCamera","/api/objects/cube-camera","2.api/9.objects/cube-camera",{"title":409,"path":410,"stem":411},"Fbo","/api/objects/fbo","2.api/9.objects/fbo",{"title":413,"path":414,"stem":415},"GradientTexture","/api/objects/gradient-texture","2.api/9.objects/gradient-texture",{"title":417,"path":418,"stem":419},"HTML","/api/objects/html","2.api/9.objects/html",{"title":421,"path":422,"stem":423},"Image","/api/objects/image","2.api/9.objects/image",{"title":425,"path":426,"stem":427},"MarchingCubes","/api/objects/marching-cubes","2.api/9.objects/marching-cubes",{"title":429,"path":430,"stem":431},"Reflector","/api/objects/reflector","2.api/9.objects/reflector",{"title":433,"path":434,"stem":435},"Text3D","/api/objects/text-3d","2.api/9.objects/text-3d",{"title":437,"path":438,"stem":439,"children":440},"Miscellaneous","/api/miscellaneous","2.api/miscellaneous/index",[441,442,446,450,454,458,462,466],{"title":437,"path":438,"stem":439},{"title":443,"path":444,"stem":445},"Bounds","/api/miscellaneous/bounds","2.api/miscellaneous/bounds",{"title":447,"path":448,"stem":449},"GlobalAudio","/api/miscellaneous/global-audio","2.api/miscellaneous/global-audio",{"title":451,"path":452,"stem":453},"MouseParallax","/api/miscellaneous/mouse-parallax","2.api/miscellaneous/mouse-parallax",{"title":455,"path":456,"stem":457},"PositionalAudio","/api/miscellaneous/positional-audio","2.api/miscellaneous/positional-audio",{"title":459,"path":460,"stem":461},"useAnimations","/api/miscellaneous/use-animations","2.api/miscellaneous/use-animations",{"title":463,"path":464,"stem":465},"useGLTFExporter","/api/miscellaneous/use-gltf-exporter","2.api/miscellaneous/use-gltf-exporter",{"title":467,"path":468,"stem":469},"useIntersect","/api/miscellaneous/use-intersect","2.api/miscellaneous/use-intersect",{"id":471,"title":437,"body":472,"description":488,"extension":489,"links":490,"meta":491,"navigation":492,"path":438,"seo":493,"stem":439,"__hash__":494},"docs/2.api/miscellaneous/index.md",{"type":473,"value":474,"toc":483},"minimark",[475,479],[476,477,478],"p",{},"Utility components and composables for audio, animations, intersections, and more.",[480,481],"api-list",{"list-name":482},"misc-list",{"title":484,"searchDepth":485,"depth":486,"links":487},"",1,2,[],"Various utility components and composables","md",null,{},true,{"title":437,"description":488},"4eMaArcOfuKgECd4U-MWl3y1M65wxATYDIXn2bAcd9A",[496,498],{"title":433,"path":434,"stem":435,"description":497,"children":-1},"Render text in 3D using TextGeometry.",{"title":443,"path":444,"stem":445,"description":499,"children":-1},"Calculate boundary box and center camera accordingly.",[501,1211,1536,1965,3117,3774,4446],{"id":502,"title":443,"body":503,"description":499,"extension":489,"links":490,"meta":1208,"navigation":492,"path":444,"seo":1209,"stem":445,"__hash__":1210},"docs/2.api/miscellaneous/bounds.md",{"type":473,"value":504,"toc":1201},[505,511,519,552,556,1013,1017,1165,1168,1184,1189,1197],[506,507,508],"scene-wrapper",{},[509,510],"miscellaneous-bounds",{},[476,512,513,514,518],{},"Calculates a boundary box and centers the camera accordingly. Its ",[515,516,517],"code",{},"lookAt"," method accepts a target to look at imperatively e.g., after a click.",[520,521,522,525],"prose-note",{},[476,523,524],{},"If you are using other camera controls, be sure to make them the 'default'.",[526,527,531],"pre",{"className":528,"code":529,"language":530,"meta":484,"style":484},"language-vue shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003COrbitControls make-default />\n","vue",[515,532,533],{"__ignoreMap":484},[534,535,537,541,545,549],"span",{"class":536,"line":485},"line",[534,538,540],{"class":539},"sMK4o","\u003C",[534,542,544],{"class":543},"swJcz","OrbitControls",[534,546,548],{"class":547},"spNyl"," make-default",[534,550,551],{"class":539}," />\n",[553,554,15],"h2",{"id":555},"usage",[526,557,568],{"className":528,"code":558,"highlights":559,"language":530,"meta":484,"style":484},"\u003Cscript setup lang=\"ts\">\nimport { TresCanvas } from '@tresjs/core'\nimport { Bounds, OrbitControls } from '@tresjs/cientos'\nimport { shallowRef } from 'vue'\n\nconst boundsRef = shallowRef()\nconst objectRef = shallowRef()\n\nfunction focusObject() {\n  boundsRef.value?.instance.lookAt(objectRef.value)\n}\n\u003C/script>\n\n\u003Ctemplate>\n  \u003CTresCanvas>\n    \u003CTresPerspectiveCamera :position=\"[0, 2, 5]\" />\n    \u003COrbitControls make-default />\n    \u003CBounds ref=\"boundsRef\" clip use-mounted :offset=\"0.75\">\n      \u003CTresMesh ref=\"objectRef\" @click=\"(e) => focusObject()\">\n        \u003CTresBoxGeometry />\n        \u003CTresMeshNormalMaterial />\n      \u003C/TresMesh>\n    \u003C/Bounds>\n  \u003C/TresCanvas>\n\u003C/template>\n",[560,561,562,563,564,565,566,567],3,6,7,9,10,11,18,23,[515,569,570,598,626,654,674,680,697,711,716,731,766,772,782,787,797,808,852,863,904,953,964,974,984,994,1004],{"__ignoreMap":484},[534,571,572,574,577,580,583,586,589,593,595],{"class":536,"line":485},[534,573,540],{"class":539},[534,575,576],{"class":543},"script",[534,578,579],{"class":547}," setup",[534,581,582],{"class":547}," lang",[534,584,585],{"class":539},"=",[534,587,588],{"class":539},"\"",[534,590,592],{"class":591},"sfazB","ts",[534,594,588],{"class":539},[534,596,597],{"class":539},">\n",[534,599,600,604,607,611,614,617,620,623],{"class":536,"line":486},[534,601,603],{"class":602},"s7zQu","import",[534,605,606],{"class":539}," {",[534,608,610],{"class":609},"sTEyZ"," TresCanvas",[534,612,613],{"class":539}," }",[534,615,616],{"class":602}," from",[534,618,619],{"class":539}," '",[534,621,622],{"class":591},"@tresjs/core",[534,624,625],{"class":539},"'\n",[534,627,630,632,634,637,640,643,645,647,649,652],{"class":628,"line":560},[536,629],"highlight",[534,631,603],{"class":602},[534,633,606],{"class":539},[534,635,636],{"class":609}," Bounds",[534,638,639],{"class":539},",",[534,641,642],{"class":609}," OrbitControls",[534,644,613],{"class":539},[534,646,616],{"class":602},[534,648,619],{"class":539},[534,650,651],{"class":591},"@tresjs/cientos",[534,653,625],{"class":539},[534,655,657,659,661,664,666,668,670,672],{"class":536,"line":656},4,[534,658,603],{"class":602},[534,660,606],{"class":539},[534,662,663],{"class":609}," shallowRef",[534,665,613],{"class":539},[534,667,616],{"class":602},[534,669,619],{"class":539},[534,671,530],{"class":591},[534,673,625],{"class":539},[534,675,677],{"class":536,"line":676},5,[534,678,679],{"emptyLinePlaceholder":492},"\n",[534,681,683,686,689,691,694],{"class":682,"line":561},[536,629],[534,684,685],{"class":547},"const",[534,687,688],{"class":609}," boundsRef ",[534,690,585],{"class":539},[534,692,663],{"class":693},"s2Zo4",[534,695,696],{"class":609},"()\n",[534,698,700,702,705,707,709],{"class":699,"line":562},[536,629],[534,701,685],{"class":547},[534,703,704],{"class":609}," objectRef ",[534,706,585],{"class":539},[534,708,663],{"class":693},[534,710,696],{"class":609},[534,712,714],{"class":536,"line":713},8,[534,715,679],{"emptyLinePlaceholder":492},[534,717,719,722,725,728],{"class":718,"line":563},[536,629],[534,720,721],{"class":547},"function",[534,723,724],{"class":693}," focusObject",[534,726,727],{"class":539},"()",[534,729,730],{"class":539}," {\n",[534,732,734,737,740,743,746,749,751,753,756,759,761,763],{"class":733,"line":564},[536,629],[534,735,736],{"class":609},"  boundsRef",[534,738,739],{"class":539},".",[534,741,742],{"class":609},"value",[534,744,745],{"class":539},"?.",[534,747,748],{"class":609},"instance",[534,750,739],{"class":539},[534,752,517],{"class":693},[534,754,755],{"class":543},"(",[534,757,758],{"class":609},"objectRef",[534,760,739],{"class":539},[534,762,742],{"class":609},[534,764,765],{"class":543},")\n",[534,767,769],{"class":768,"line":565},[536,629],[534,770,771],{"class":539},"}\n",[534,773,775,778,780],{"class":536,"line":774},12,[534,776,777],{"class":539},"\u003C/",[534,779,576],{"class":543},[534,781,597],{"class":539},[534,783,785],{"class":536,"line":784},13,[534,786,679],{"emptyLinePlaceholder":492},[534,788,790,792,795],{"class":536,"line":789},14,[534,791,540],{"class":539},[534,793,794],{"class":543},"template",[534,796,597],{"class":539},[534,798,800,803,806],{"class":536,"line":799},15,[534,801,802],{"class":539},"  \u003C",[534,804,805],{"class":543},"TresCanvas",[534,807,597],{"class":539},[534,809,811,814,817,820,823,825,827,830,834,837,840,842,845,848,850],{"class":536,"line":810},16,[534,812,813],{"class":539},"    \u003C",[534,815,816],{"class":543},"TresPerspectiveCamera",[534,818,819],{"class":539}," :",[534,821,822],{"class":547},"position",[534,824,585],{"class":539},[534,826,588],{"class":539},[534,828,829],{"class":539},"[",[534,831,833],{"class":832},"sbssI","0",[534,835,836],{"class":539},", ",[534,838,839],{"class":832},"2",[534,841,836],{"class":539},[534,843,844],{"class":832},"5",[534,846,847],{"class":539},"]",[534,849,588],{"class":539},[534,851,551],{"class":539},[534,853,855,857,859,861],{"class":536,"line":854},17,[534,856,813],{"class":539},[534,858,544],{"class":543},[534,860,548],{"class":547},[534,862,551],{"class":539},[534,864,866,868,870,873,875,877,880,882,885,888,890,893,895,897,900,902],{"class":865,"line":566},[536,629],[534,867,813],{"class":539},[534,869,443],{"class":543},[534,871,872],{"class":547}," ref",[534,874,585],{"class":539},[534,876,588],{"class":539},[534,878,879],{"class":591},"boundsRef",[534,881,588],{"class":539},[534,883,884],{"class":547}," clip",[534,886,887],{"class":547}," use-mounted",[534,889,819],{"class":539},[534,891,892],{"class":547},"offset",[534,894,585],{"class":539},[534,896,588],{"class":539},[534,898,899],{"class":832},"0.75",[534,901,588],{"class":539},[534,903,597],{"class":539},[534,905,907,910,913,915,917,919,921,923,926,929,931,933,935,939,942,945,947,949,951],{"class":536,"line":906},19,[534,908,909],{"class":539},"      \u003C",[534,911,912],{"class":543},"TresMesh",[534,914,872],{"class":547},[534,916,585],{"class":539},[534,918,588],{"class":539},[534,920,758],{"class":591},[534,922,588],{"class":539},[534,924,925],{"class":539}," @",[534,927,928],{"class":547},"click",[534,930,585],{"class":539},[534,932,588],{"class":539},[534,934,755],{"class":539},[534,936,938],{"class":937},"sHdIc","e",[534,940,941],{"class":539},") ",[534,943,944],{"class":547},"=>",[534,946,724],{"class":693},[534,948,727],{"class":539},[534,950,588],{"class":539},[534,952,597],{"class":539},[534,954,956,959,962],{"class":536,"line":955},20,[534,957,958],{"class":539},"        \u003C",[534,960,961],{"class":543},"TresBoxGeometry",[534,963,551],{"class":539},[534,965,967,969,972],{"class":536,"line":966},21,[534,968,958],{"class":539},[534,970,971],{"class":543},"TresMeshNormalMaterial",[534,973,551],{"class":539},[534,975,977,980,982],{"class":536,"line":976},22,[534,978,979],{"class":539},"      \u003C/",[534,981,912],{"class":543},[534,983,597],{"class":539},[534,985,987,990,992],{"class":986,"line":567},[536,629],[534,988,989],{"class":539},"    \u003C/",[534,991,443],{"class":543},[534,993,597],{"class":539},[534,995,997,1000,1002],{"class":536,"line":996},24,[534,998,999],{"class":539},"  \u003C/",[534,1001,805],{"class":543},[534,1003,597],{"class":539},[534,1005,1007,1009,1011],{"class":536,"line":1006},25,[534,1008,777],{"class":539},[534,1010,794],{"class":543},[534,1012,597],{"class":539},[553,1014,1016],{"id":1015},"props","Props",[1018,1019,1020,1037],"table",{},[1021,1022,1023],"thead",{},[1024,1025,1026,1031,1034],"tr",{},[1027,1028,1030],"th",{"align":1029},"left","Name",[1027,1032,1033],{"align":1029},"Description",[1027,1035,1036],{},"Default",[1038,1039,1040,1059,1083,1101,1121,1145],"tbody",{},[1024,1041,1042,1048,1054],{},[1043,1044,1045],"td",{"align":1029},[515,1046,1047],{},"duration",[1043,1049,1050,1051,1053],{"align":1029},"Duration of the ",[515,1052,517],{}," animation in seconds",[1043,1055,1056],{},[515,1057,1058],{},"1.0",[1024,1060,1061,1065,1078],{},[1043,1062,1063],{"align":1029},[515,1064,892],{},[1043,1066,1067,1068,1070,1071,1074,1075],{"align":1029},"Additional distance from the target when using ",[515,1069,517],{}," with a ",[515,1072,1073],{},"Box3"," or ",[515,1076,1077],{},"Object3D",[1043,1079,1080],{},[515,1081,1082],{},"0.2",[1024,1084,1085,1090,1096],{},[1043,1086,1087],{"align":1029},[515,1088,1089],{},"useResize",[1043,1091,1092,1093,1095],{"align":1029},"Whether to re",[515,1094,517],{}," the last target when the screen is resized",[1043,1097,1098],{},[515,1099,1100],{},"false",[1024,1102,1103,1108,1117],{},[1043,1104,1105],{"align":1029},[515,1106,1107],{},"useMounted",[1043,1109,1110,1111,1113,1114,1116],{"align":1029},"Whether to ",[515,1112,517],{}," the ",[515,1115,443],{}," object when the component is mounts",[1043,1118,1119],{},[515,1120,1100],{},[1024,1122,1123,1128,1141],{},[1043,1124,1125],{"align":1029},[515,1126,1127],{},"clip",[1043,1129,1130,1131,1134,1135,1138,1139],{"align":1029},"Whether to adjust the camera's ",[515,1132,1133],{},"near"," and ",[515,1136,1137],{},"far"," settings when using ",[515,1140,517],{},[1043,1142,1143],{},[515,1144,1100],{},[1024,1146,1147,1152,1162],{},[1043,1148,1149],{"align":1029},[515,1150,1151],{},"easing",[1043,1153,1154,1155,1158,1159],{"align":1029},"Animation's easing function. ",[515,1156,1157],{},"t"," and the returned value should be in the interval ",[515,1160,1161],{},"[0, 1]",[1043,1163,1164],{},"Cubic ease out",[553,1166,517],{"id":1167},"lookat",[476,1169,1170,1173,1174,1176,1177,836,1179,1074,1181,739],{},[515,1171,1172],{},"\u003CBounds />"," ",[515,1175,517],{}," points the camera at its first argument: an ",[515,1178,1077],{},[515,1180,1073],{},[515,1182,1183],{},"Vector3",[1185,1186,1188],"h3",{"id":1187},"method-signatures","Method Signatures",[526,1190,1195],{"className":1191,"code":1193,"language":1194},[1192],"language-text","/**\n * Calculates a boundary box around an `Object3D` and centers the camera accordingly.\n */\nlookAt(object: Object3D): void\n\n/**\n * Calculates a boundary box around an `Object3D` and centers the camera accordingly and animates the camera's `up` vector.\n */\nlookAt(object: Object3D, up: VectorFlexibleParams): void\n\n/**\n * Centers the camera's viewport on a `Box3`.\n */\nlookAt(box3: Box3): void\n\n/**\n * Centers the camera's viewport on a `Box3` and animates the camera's `up` vector.\n */\nlookAt(box3: Box3, up: VectorFlexibleParams): void\n\n/**\n * Look at a `Vector3`.\n */\nlookAt(target: VectorFlexibleParams): void\n\n/**\n * Look at a `Vector3`, if provided. Move the camera to `position`.\n */\nlookAt(target: VectorFlexibleParams | undefined | null, position: VectorFlexibleParams): void\n\n/**\n * Look at a `Vector3`, if provided. Move the camera to `position` and animate the camera's `up` vector.\n */\nlookAt(target: VectorFlexibleParams | undefined | null, position: VectorFlexibleParams, up: VectorFlexibleParams): void\n\n/**\n * Rerun `lookAt` using the prior arguments. If `lookAt` has never been called, uses the `Bounds` object.\n */\nlookAt(): void\n","text",[515,1196,1193],{"__ignoreMap":484},[1198,1199,1200],"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 .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 .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 pre.shiki code .sbssI, html code.shiki .sbssI{--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C}html pre.shiki code .sHdIc, html code.shiki .sHdIc{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#EEFFFF;--shiki-default-font-style:italic;--shiki-dark:#BABED8;--shiki-dark-font-style:italic}",{"title":484,"searchDepth":485,"depth":486,"links":1202},[1203,1204,1205],{"id":555,"depth":486,"text":15},{"id":1015,"depth":486,"text":1016},{"id":1167,"depth":486,"text":517,"children":1206},[1207],{"id":1187,"depth":560,"text":1188},{},{"title":443,"description":499},"99p1FD8mbl4hP9wZB60es2RXMg_34kRJyloKHcDBk80",{"id":1212,"title":447,"body":1213,"description":1532,"extension":489,"links":490,"meta":1533,"navigation":492,"path":448,"seo":1534,"stem":449,"__hash__":1535},"docs/2.api/miscellaneous/global-audio.md",{"type":473,"value":1214,"toc":1527},[1215,1226,1236,1238,1392,1398,1400,1497,1501,1524],[476,1216,1217,1218,1221,1222,1225],{},"The ",[515,1219,1220],{},"cientos"," package provides a ",[515,1223,1224],{},"\u003CGlobalAudio />"," component that serves to easily add a global sound to your scene.",[476,1227,1228,1229],{},"Reference: ",[1230,1231,1235],"a",{"href":1232,"rel":1233},"https://threejs.org/docs/index.html?q=audio#api/en/audio/Audio",[1234],"nofollow","Audio",[553,1237,15],{"id":555},[526,1239,1242],{"className":528,"code":1240,"highlights":1241,"language":530,"meta":484,"style":484},"\u003Cscript setup>\nimport { TresCanvas } from '@tresjs/core'\nimport { GlobalAudio } from '@tresjs/cientos'\n\u003C/script>\n\n\u003Ctemplate>\n  \u003CTresCanvas>\n    \u003CTresPerspectiveCamera :position=\"[0, 0, 7.5]\" />\n    \u003CGlobalAudio :src=\"exampleAudio\" />\n  \u003C/TresCanvas>\n\u003C/template>\n",[560,563],[515,1243,1244,1254,1272,1292,1300,1304,1312,1320,1353,1376,1384],{"__ignoreMap":484},[534,1245,1246,1248,1250,1252],{"class":536,"line":485},[534,1247,540],{"class":539},[534,1249,576],{"class":543},[534,1251,579],{"class":547},[534,1253,597],{"class":539},[534,1255,1256,1258,1260,1262,1264,1266,1268,1270],{"class":536,"line":486},[534,1257,603],{"class":602},[534,1259,606],{"class":539},[534,1261,610],{"class":609},[534,1263,613],{"class":539},[534,1265,616],{"class":602},[534,1267,619],{"class":539},[534,1269,622],{"class":591},[534,1271,625],{"class":539},[534,1273,1275,1277,1279,1282,1284,1286,1288,1290],{"class":1274,"line":560},[536,629],[534,1276,603],{"class":602},[534,1278,606],{"class":539},[534,1280,1281],{"class":609}," GlobalAudio",[534,1283,613],{"class":539},[534,1285,616],{"class":602},[534,1287,619],{"class":539},[534,1289,651],{"class":591},[534,1291,625],{"class":539},[534,1293,1294,1296,1298],{"class":536,"line":656},[534,1295,777],{"class":539},[534,1297,576],{"class":543},[534,1299,597],{"class":539},[534,1301,1302],{"class":536,"line":676},[534,1303,679],{"emptyLinePlaceholder":492},[534,1305,1306,1308,1310],{"class":536,"line":561},[534,1307,540],{"class":539},[534,1309,794],{"class":543},[534,1311,597],{"class":539},[534,1313,1314,1316,1318],{"class":536,"line":562},[534,1315,802],{"class":539},[534,1317,805],{"class":543},[534,1319,597],{"class":539},[534,1321,1322,1324,1326,1328,1330,1332,1334,1336,1338,1340,1342,1344,1347,1349,1351],{"class":536,"line":713},[534,1323,813],{"class":539},[534,1325,816],{"class":543},[534,1327,819],{"class":539},[534,1329,822],{"class":547},[534,1331,585],{"class":539},[534,1333,588],{"class":539},[534,1335,829],{"class":539},[534,1337,833],{"class":832},[534,1339,836],{"class":539},[534,1341,833],{"class":832},[534,1343,836],{"class":539},[534,1345,1346],{"class":832},"7.5",[534,1348,847],{"class":539},[534,1350,588],{"class":539},[534,1352,551],{"class":539},[534,1354,1356,1358,1360,1362,1365,1367,1369,1372,1374],{"class":1355,"line":563},[536,629],[534,1357,813],{"class":539},[534,1359,447],{"class":543},[534,1361,819],{"class":539},[534,1363,1364],{"class":547},"src",[534,1366,585],{"class":539},[534,1368,588],{"class":539},[534,1370,1371],{"class":609},"exampleAudio",[534,1373,588],{"class":539},[534,1375,551],{"class":539},[534,1377,1378,1380,1382],{"class":536,"line":564},[534,1379,999],{"class":539},[534,1381,805],{"class":543},[534,1383,597],{"class":539},[534,1385,1386,1388,1390],{"class":536,"line":565},[534,1387,777],{"class":539},[534,1389,794],{"class":543},[534,1391,597],{"class":539},[476,1393,1394,1395,1397],{},"*The ",[515,1396,1364],{}," prop is required",[553,1399,1016],{"id":1015},[1018,1401,1402,1413],{},[1021,1403,1404],{},[1024,1405,1406,1409,1411],{},[1027,1407,1408],{"align":1029},"Prop",[1027,1410,1033],{"align":1029},[1027,1412,1036],{},[1038,1414,1415,1426,1441,1453,1467,1482],{},[1024,1416,1417,1421,1424],{},[1043,1418,1419],{"align":1029},[515,1420,1364],{},[1043,1422,1423],{"align":1029},"Path to your audio file",[1043,1425],{},[1024,1427,1428,1433,1436],{},[1043,1429,1430],{"align":1029},[515,1431,1432],{},"playTrigger",[1043,1434,1435],{"align":1029},"Id of the DOM element that triggers the play/pause state",[1043,1437,1438],{},[515,1439,1440],{},"renderer.domElement",[1024,1442,1443,1448,1451],{},[1043,1444,1445],{"align":1029},[515,1446,1447],{},"stopTrigger",[1043,1449,1450],{"align":1029},"Id of the DOM element that triggers the stop state",[1043,1452],{},[1024,1454,1455,1460,1463],{},[1043,1456,1457],{"align":1029},[515,1458,1459],{},"loop",[1043,1461,1462],{"align":1029},"If the audio must be replayed when ends",[1043,1464,1465],{},[515,1466,1100],{},[1024,1468,1469,1474,1477],{},[1043,1470,1471],{"align":1029},[515,1472,1473],{},"volume",[1043,1475,1476],{"align":1029},"Volume of the audio",[1043,1478,1479],{},[515,1480,1481],{},"0.5",[1024,1483,1484,1489,1492],{},[1043,1485,1486],{"align":1029},[515,1487,1488],{},"playbackRate",[1043,1490,1491],{"align":1029},"PlaybackRate of the audio",[1043,1493,1494],{},[515,1495,1496],{},"1",[553,1498,1500],{"id":1499},"events","Events",[1018,1502,1503,1512],{},[1021,1504,1505],{},[1024,1506,1507,1510],{},[1027,1508,1509],{"align":1029},"Event",[1027,1511,1033],{"align":1029},[1038,1513,1514],{},[1024,1515,1516,1521],{},[1043,1517,1518],{"align":1029},[515,1519,1520],{},"isPlaying",[1043,1522,1523],{"align":1029},"Dispatched when the Audio change its state (play, pause or stop)",[1198,1525,1526],{},"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 .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 .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html pre.shiki code .sbssI, html code.shiki .sbssI{--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C}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);}",{"title":484,"searchDepth":485,"depth":486,"links":1528},[1529,1530,1531],{"id":555,"depth":486,"text":15},{"id":1015,"depth":486,"text":1016},{"id":1499,"depth":486,"text":1500},"Add global sound to your scene.",{},{"title":447,"description":1532},"XaoiVKl16tz4uOX0ZskSCuPQUgYB0CYUZjEEuh4q_uU",{"id":1537,"title":451,"body":1538,"description":1961,"extension":489,"links":490,"meta":1962,"navigation":492,"path":452,"seo":1963,"stem":453,"__hash__":1964},"docs/2.api/miscellaneous/mouse-parallax.md",{"type":473,"value":1539,"toc":1957},[1540,1546,1558,1560,1566,1575,1584,1590,1891,1893,1954],[1541,1542,1543],"scene-controls-wrapper",{},[1544,1545],"miscellaneous-mouse-parallax",{},[476,1547,1548,1551,1552,1557],{},[515,1549,1550],{},"\u003CMouseParallax />"," is a component that allows you to easily create a ",[1230,1553,1556],{"href":1554,"rel":1555},"https://en.wikipedia.org/wiki/Parallax",[1234],"parallax"," effect. The camera will update automatically according to the mouse position.",[553,1559,15],{"id":555},[476,1561,1562,1563,1565],{},"You only need to import and add it to your template as ",[515,1564,1550],{},". Additionally, you can pass the following props:",[476,1567,1568,1571,1572,739],{},[515,1569,1570],{},"factor"," is a number to increase the movement range of the camera. This could be an array of two values corresponding to the x and y values, in that order: ",[515,1573,1574],{},":factor=[x,y]",[476,1576,1577,1580,1581,739],{},[515,1578,1579],{},"ease"," is a number that smooths the movement. This could be an array of two values corresponding to the x and y values, in that order: ",[515,1582,1583],{},":ease=[x,y]",[476,1585,1586,1589],{},[515,1587,1588],{},"local"," is a boolean that enables movement based on the position of the mouse on the canvas rather than the window.",[526,1591,1594],{"className":528,"code":1592,"highlights":1593,"language":530,"meta":484,"style":484},"\u003Cscript setup lang=\"ts\">\nimport { MouseParallax, TorusKnot } from \"@tresjs/cientos\";\nimport { TresCanvas } from \"@tresjs/core\";\n\u003C/script>\n\n\u003Ctemplate>\n  \u003CTresCanvas clear-color=\"#82DBC5\">\n    \u003CTresPerspectiveCamera :position=\"[0, 0, 7.5]\" :fov=\"75\" />\n    \u003CTorusKnot>\n      \u003CTresMeshToonMaterial color=\"orange\" />\n    \u003C/TorusKnot>\n    \u003CMouseParallax :factor=\"5\" :ease=\"[3, 0.1]\" />\n    \u003CTresAmbientLight />\n    \u003CTresDirectionalLight :position=\"[0, 2, 4]\" />\n  \u003C/TresCanvas>\n\u003C/template>\n",[486,774],[515,1595,1596,1616,1645,1665,1673,1677,1685,1705,1751,1760,1781,1789,1832,1841,1875,1883],{"__ignoreMap":484},[534,1597,1598,1600,1602,1604,1606,1608,1610,1612,1614],{"class":536,"line":485},[534,1599,540],{"class":539},[534,1601,576],{"class":543},[534,1603,579],{"class":547},[534,1605,582],{"class":547},[534,1607,585],{"class":539},[534,1609,588],{"class":539},[534,1611,592],{"class":591},[534,1613,588],{"class":539},[534,1615,597],{"class":539},[534,1617,1619,1621,1623,1626,1628,1631,1633,1635,1638,1640,1642],{"class":1618,"line":486},[536,629],[534,1620,603],{"class":602},[534,1622,606],{"class":539},[534,1624,1625],{"class":609}," MouseParallax",[534,1627,639],{"class":539},[534,1629,1630],{"class":609}," TorusKnot",[534,1632,613],{"class":539},[534,1634,616],{"class":602},[534,1636,1637],{"class":539}," \"",[534,1639,651],{"class":591},[534,1641,588],{"class":539},[534,1643,1644],{"class":539},";\n",[534,1646,1647,1649,1651,1653,1655,1657,1659,1661,1663],{"class":536,"line":560},[534,1648,603],{"class":602},[534,1650,606],{"class":539},[534,1652,610],{"class":609},[534,1654,613],{"class":539},[534,1656,616],{"class":602},[534,1658,1637],{"class":539},[534,1660,622],{"class":591},[534,1662,588],{"class":539},[534,1664,1644],{"class":539},[534,1666,1667,1669,1671],{"class":536,"line":656},[534,1668,777],{"class":539},[534,1670,576],{"class":543},[534,1672,597],{"class":539},[534,1674,1675],{"class":536,"line":676},[534,1676,679],{"emptyLinePlaceholder":492},[534,1678,1679,1681,1683],{"class":536,"line":561},[534,1680,540],{"class":539},[534,1682,794],{"class":543},[534,1684,597],{"class":539},[534,1686,1687,1689,1691,1694,1696,1698,1701,1703],{"class":536,"line":562},[534,1688,802],{"class":539},[534,1690,805],{"class":543},[534,1692,1693],{"class":547}," clear-color",[534,1695,585],{"class":539},[534,1697,588],{"class":539},[534,1699,1700],{"class":591},"#82DBC5",[534,1702,588],{"class":539},[534,1704,597],{"class":539},[534,1706,1707,1709,1711,1713,1715,1717,1719,1721,1723,1725,1727,1729,1731,1733,1735,1737,1740,1742,1744,1747,1749],{"class":536,"line":713},[534,1708,813],{"class":539},[534,1710,816],{"class":543},[534,1712,819],{"class":539},[534,1714,822],{"class":547},[534,1716,585],{"class":539},[534,1718,588],{"class":539},[534,1720,829],{"class":539},[534,1722,833],{"class":832},[534,1724,836],{"class":539},[534,1726,833],{"class":832},[534,1728,836],{"class":539},[534,1730,1346],{"class":832},[534,1732,847],{"class":539},[534,1734,588],{"class":539},[534,1736,819],{"class":539},[534,1738,1739],{"class":547},"fov",[534,1741,585],{"class":539},[534,1743,588],{"class":539},[534,1745,1746],{"class":832},"75",[534,1748,588],{"class":539},[534,1750,551],{"class":539},[534,1752,1753,1755,1758],{"class":536,"line":563},[534,1754,813],{"class":539},[534,1756,1757],{"class":543},"TorusKnot",[534,1759,597],{"class":539},[534,1761,1762,1764,1767,1770,1772,1774,1777,1779],{"class":536,"line":564},[534,1763,909],{"class":539},[534,1765,1766],{"class":543},"TresMeshToonMaterial",[534,1768,1769],{"class":547}," color",[534,1771,585],{"class":539},[534,1773,588],{"class":539},[534,1775,1776],{"class":591},"orange",[534,1778,588],{"class":539},[534,1780,551],{"class":539},[534,1782,1783,1785,1787],{"class":536,"line":565},[534,1784,989],{"class":539},[534,1786,1757],{"class":543},[534,1788,597],{"class":539},[534,1790,1792,1794,1796,1798,1800,1802,1804,1806,1808,1810,1812,1814,1816,1818,1821,1823,1826,1828,1830],{"class":1791,"line":774},[536,629],[534,1793,813],{"class":539},[534,1795,451],{"class":543},[534,1797,819],{"class":539},[534,1799,1570],{"class":547},[534,1801,585],{"class":539},[534,1803,588],{"class":539},[534,1805,844],{"class":832},[534,1807,588],{"class":539},[534,1809,819],{"class":539},[534,1811,1579],{"class":547},[534,1813,585],{"class":539},[534,1815,588],{"class":539},[534,1817,829],{"class":539},[534,1819,1820],{"class":832},"3",[534,1822,836],{"class":539},[534,1824,1825],{"class":832},"0.1",[534,1827,847],{"class":539},[534,1829,588],{"class":539},[534,1831,551],{"class":539},[534,1833,1834,1836,1839],{"class":536,"line":784},[534,1835,813],{"class":539},[534,1837,1838],{"class":543},"TresAmbientLight",[534,1840,551],{"class":539},[534,1842,1843,1845,1848,1850,1852,1854,1856,1858,1860,1862,1864,1866,1869,1871,1873],{"class":536,"line":789},[534,1844,813],{"class":539},[534,1846,1847],{"class":543},"TresDirectionalLight",[534,1849,819],{"class":539},[534,1851,822],{"class":547},[534,1853,585],{"class":539},[534,1855,588],{"class":539},[534,1857,829],{"class":539},[534,1859,833],{"class":832},[534,1861,836],{"class":539},[534,1863,839],{"class":832},[534,1865,836],{"class":539},[534,1867,1868],{"class":832},"4",[534,1870,847],{"class":539},[534,1872,588],{"class":539},[534,1874,551],{"class":539},[534,1876,1877,1879,1881],{"class":536,"line":799},[534,1878,999],{"class":539},[534,1880,805],{"class":543},[534,1882,597],{"class":539},[534,1884,1885,1887,1889],{"class":536,"line":810},[534,1886,777],{"class":539},[534,1888,794],{"class":543},[534,1890,597],{"class":539},[553,1892,1016],{"id":1015},[1018,1894,1895,1905],{},[1021,1896,1897],{},[1024,1898,1899,1901,1903],{},[1027,1900,1408],{"align":1029},[1027,1902,1033],{"align":1029},[1027,1904,1036],{},[1038,1906,1907,1920,1932,1943],{},[1024,1908,1909,1915,1918],{},[1043,1910,1911],{"align":1029},[1912,1913,1914],"strong",{},"disabled",[1043,1916,1917],{"align":1029},"Enable or disable the effect",[1043,1919,1100],{},[1024,1921,1922,1926,1929],{},[1043,1923,1924],{"align":1029},[1912,1925,1570],{},[1043,1927,1928],{"align":1029},"Increase the range of the parallax",[1043,1930,1931],{},"2.5",[1024,1933,1934,1938,1941],{},[1043,1935,1936],{"align":1029},[1912,1937,1579],{},[1043,1939,1940],{"align":1029},"Increase the camera movement speed",[1043,1942,1825],{},[1024,1944,1945,1949,1952],{},[1043,1946,1947],{"align":1029},[1912,1948,1588],{},[1043,1950,1951],{"align":1029},"Whether the mouse coordinates are calculated from the element or the window",[1043,1953,1100],{},[1198,1955,1956],{},"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 .sbssI, html code.shiki .sbssI{--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C}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);}",{"title":484,"searchDepth":485,"depth":486,"links":1958},[1959,1960],{"id":555,"depth":486,"text":15},{"id":1015,"depth":486,"text":1016},"Create parallax effects based on mouse movement.",{},{"title":451,"description":1961},"-wMRikeU1CMiiuet3URQZ7L0rwjhY5Q0pVMViyyOwK0",{"id":1966,"title":455,"body":1967,"description":3113,"extension":489,"links":490,"meta":3114,"navigation":492,"path":456,"seo":3115,"stem":457,"__hash__":3116},"docs/2.api/miscellaneous/positional-audio.md",{"type":473,"value":1968,"toc":3106},[1969,1974,1988,1999,2001,2017,2308,2337,2341,2347,2349,2551,2555,2628,2876,3074,3076,3103],[1541,1970,1971],{},[1972,1973],"miscellaneous-positional-audio",{},[476,1975,1217,1976,1978,1979,1983,1984,1987],{},[515,1977,1220],{}," package provides an abstraction of the ",[1230,1980,455],{"href":1981,"rel":1982},"https://threejs.org/docs/index.html?q=posi#api/en/audio/PositionalAudio",[1234],".\n",[515,1985,1986],{},"\u003CPositionalAudio>"," is an object specifically designed for controlling sounds in a scene graph space. This allows, for the simulation of various audio environments, creating a more immersive user experience.",[476,1989,1990,1992,1993,1998],{},[515,1991,1986],{}," includes a helper 🛠️ that allows you to view the directional cone of te audio. The helper is based on the ",[1230,1994,1997],{"href":1995,"rel":1996},"https://threejs.org/docs/#examples/en/helpers/PositionalAudioHelper",[1234],"PositionalAudioHelper"," class.",[553,2000,15],{"id":555},[476,2002,1217,2003,2005,2006,2008,2009,2012,2013,2016],{},[515,2004,1986],{}," component is very simple to set up and use, allowing you to bring your 3D scenes to life.  All you need to do is call the ",[515,2007,1986],{}," component and set the ",[515,2010,2011],{},"url",". It must be wrapped around the ",[515,2014,2015],{},"\u003CSuspense>"," component to enable it to load your audio asynchronously. 💥",[526,2018,2021],{"className":528,"code":2019,"highlights":2020,"language":530,"meta":484,"style":484},"\u003Cscript setup lang=\"ts\">\nimport { Box, PositionalAudio } from '@tresjs/cientos'\nimport { onUnmounted, shallowRef } from 'vue'\n\nconst positionalAudioRef = shallowRef(null)\n\nonUnmounted(() => {\n  positionalAudioRef?.value?.dispose()\n})\n\u003C/script>\n\n\u003Ctemplate>\n  \u003CTresCanvas>\n    \u003CBox :args=\"[1, 1, 1]\">\n      \u003CTresMeshNormalMaterial />\n      \u003CSuspense>\n        \u003CPositionalAudio\n          ref=\"positionalAudioRef\"\n          url=\"your-sound.mp3\"\n        />\n      \u003C/Suspense>\n    \u003C/Box>\n  \u003C/TresCanvas>\n\u003C/template>\n",[486,854,566,906],[515,2022,2023,2043,2068,2091,2095,2113,2117,2131,2147,2154,2162,2166,2174,2182,2215,2223,2232,2240,2256,2271,2276,2284,2292,2300],{"__ignoreMap":484},[534,2024,2025,2027,2029,2031,2033,2035,2037,2039,2041],{"class":536,"line":485},[534,2026,540],{"class":539},[534,2028,576],{"class":543},[534,2030,579],{"class":547},[534,2032,582],{"class":547},[534,2034,585],{"class":539},[534,2036,588],{"class":539},[534,2038,592],{"class":591},[534,2040,588],{"class":539},[534,2042,597],{"class":539},[534,2044,2046,2048,2050,2053,2055,2058,2060,2062,2064,2066],{"class":2045,"line":486},[536,629],[534,2047,603],{"class":602},[534,2049,606],{"class":539},[534,2051,2052],{"class":609}," Box",[534,2054,639],{"class":539},[534,2056,2057],{"class":609}," PositionalAudio",[534,2059,613],{"class":539},[534,2061,616],{"class":602},[534,2063,619],{"class":539},[534,2065,651],{"class":591},[534,2067,625],{"class":539},[534,2069,2070,2072,2074,2077,2079,2081,2083,2085,2087,2089],{"class":536,"line":560},[534,2071,603],{"class":602},[534,2073,606],{"class":539},[534,2075,2076],{"class":609}," onUnmounted",[534,2078,639],{"class":539},[534,2080,663],{"class":609},[534,2082,613],{"class":539},[534,2084,616],{"class":602},[534,2086,619],{"class":539},[534,2088,530],{"class":591},[534,2090,625],{"class":539},[534,2092,2093],{"class":536,"line":656},[534,2094,679],{"emptyLinePlaceholder":492},[534,2096,2097,2099,2102,2104,2106,2108,2111],{"class":536,"line":676},[534,2098,685],{"class":547},[534,2100,2101],{"class":609}," positionalAudioRef ",[534,2103,585],{"class":539},[534,2105,663],{"class":693},[534,2107,755],{"class":609},[534,2109,2110],{"class":539},"null",[534,2112,765],{"class":609},[534,2114,2115],{"class":536,"line":561},[534,2116,679],{"emptyLinePlaceholder":492},[534,2118,2119,2122,2124,2126,2129],{"class":536,"line":562},[534,2120,2121],{"class":693},"onUnmounted",[534,2123,755],{"class":609},[534,2125,727],{"class":539},[534,2127,2128],{"class":547}," =>",[534,2130,730],{"class":539},[534,2132,2133,2136,2138,2140,2142,2145],{"class":536,"line":713},[534,2134,2135],{"class":609},"  positionalAudioRef",[534,2137,745],{"class":539},[534,2139,742],{"class":609},[534,2141,745],{"class":539},[534,2143,2144],{"class":693},"dispose",[534,2146,696],{"class":543},[534,2148,2149,2152],{"class":536,"line":563},[534,2150,2151],{"class":539},"}",[534,2153,765],{"class":609},[534,2155,2156,2158,2160],{"class":536,"line":564},[534,2157,777],{"class":539},[534,2159,576],{"class":543},[534,2161,597],{"class":539},[534,2163,2164],{"class":536,"line":565},[534,2165,679],{"emptyLinePlaceholder":492},[534,2167,2168,2170,2172],{"class":536,"line":774},[534,2169,540],{"class":539},[534,2171,794],{"class":543},[534,2173,597],{"class":539},[534,2175,2176,2178,2180],{"class":536,"line":784},[534,2177,802],{"class":539},[534,2179,805],{"class":543},[534,2181,597],{"class":539},[534,2183,2184,2186,2188,2190,2193,2195,2197,2199,2201,2203,2205,2207,2209,2211,2213],{"class":536,"line":789},[534,2185,813],{"class":539},[534,2187,197],{"class":543},[534,2189,819],{"class":539},[534,2191,2192],{"class":547},"args",[534,2194,585],{"class":539},[534,2196,588],{"class":539},[534,2198,829],{"class":539},[534,2200,1496],{"class":832},[534,2202,836],{"class":539},[534,2204,1496],{"class":832},[534,2206,836],{"class":539},[534,2208,1496],{"class":832},[534,2210,847],{"class":539},[534,2212,588],{"class":539},[534,2214,597],{"class":539},[534,2216,2217,2219,2221],{"class":536,"line":799},[534,2218,909],{"class":539},[534,2220,971],{"class":543},[534,2222,551],{"class":539},[534,2224,2225,2227,2230],{"class":536,"line":810},[534,2226,909],{"class":539},[534,2228,2229],{"class":543},"Suspense",[534,2231,597],{"class":539},[534,2233,2235,2237],{"class":2234,"line":854},[536,629],[534,2236,958],{"class":539},[534,2238,2239],{"class":543},"PositionalAudio\n",[534,2241,2243,2246,2248,2250,2253],{"class":2242,"line":566},[536,629],[534,2244,2245],{"class":547},"          ref",[534,2247,585],{"class":539},[534,2249,588],{"class":539},[534,2251,2252],{"class":591},"positionalAudioRef",[534,2254,2255],{"class":539},"\"\n",[534,2257,2259,2262,2264,2266,2269],{"class":2258,"line":906},[536,629],[534,2260,2261],{"class":547},"          url",[534,2263,585],{"class":539},[534,2265,588],{"class":539},[534,2267,2268],{"class":591},"your-sound.mp3",[534,2270,2255],{"class":539},[534,2272,2273],{"class":536,"line":955},[534,2274,2275],{"class":539},"        />\n",[534,2277,2278,2280,2282],{"class":536,"line":966},[534,2279,979],{"class":539},[534,2281,2229],{"class":543},[534,2283,597],{"class":539},[534,2285,2286,2288,2290],{"class":536,"line":976},[534,2287,989],{"class":539},[534,2289,197],{"class":543},[534,2291,597],{"class":539},[534,2293,2294,2296,2298],{"class":536,"line":567},[534,2295,999],{"class":539},[534,2297,805],{"class":543},[534,2299,597],{"class":539},[534,2301,2302,2304,2306],{"class":536,"line":996},[534,2303,777],{"class":539},[534,2305,794],{"class":543},[534,2307,597],{"class":539},[2309,2310,2311],"prose-warning",{},[476,2312,2313,2314,2317,2318,2325,2326,2329,2330,1134,2333,2336],{},"AudioContext is authorized when a user gesture has been made on the page. The property ",[515,2315,2316],{},":autoplay=\"true\""," cannot be activated if no user gesture has been made previously ",[1230,2319,2322],{"href":2320,"rel":2321},"https://goo.gl/7K7WLu",[1234],[515,2323,2324],{},"read more",".\nIf you are sure that there will be a user gesture before your ",[515,2327,2328],{},"\u003CPositionAudio>"," component appears/is created, you can directly add ",[515,2331,2332],{},":ready=\"true\"",[515,2334,2335],{},"autoplay=\"true\""," for a direct launch.",[553,2338,2340],{"id":2339},"how-does-it-work","How does it work?",[2342,2343],"img",{"className":2344,"src":2346},[2345],"mx-auto","/cientos/sketch.jpg",[553,2348,1016],{"id":1015},[1018,2350,2351,2361],{},[1021,2352,2353],{},[1024,2354,2355,2357,2359],{},[1027,2356,1408],{"align":1029},[1027,2358,1033],{"align":1029},[1027,2360,1036],{},[1038,2362,2363,2381,2405,2427,2460,2478,2493,2510,2530],{},[1024,2364,2365,2369,2379],{},[1043,2366,2367],{"align":1029},[1912,2368,2011],{},[1043,2370,2371,2374,2375,2378],{"align":1029},[515,2372,2373],{},"string"," - ",[1912,2376,2377],{},"required"," — The path or URL to the file.",[1043,2380],{},[1024,2382,2383,2388,2401],{},[1043,2384,2385],{"align":1029},[1912,2386,2387],{},"helper",[1043,2389,2390,2393,2394,1173,2397],{"align":1029},[515,2391,2392],{},"boolean"," — Selects whether helper mode is enabled. ",[2395,2396],"br",{},[2398,2399,2400],"em",{},"(Useful for visualising the angle of sound propagation)",[1043,2402,2403],{},[515,2404,1100],{},[1024,2406,2407,2412,2423],{},[1043,2408,2409],{"align":1029},[1912,2410,2411],{},"distance",[1043,2413,2414,2417,2418],{"align":1029},[515,2415,2416],{},"number"," — The distance at which the volume reduction starts taking effect. ",[2398,2419,2420],{},[1912,2421,2422],{},"A non-negative number.",[1043,2424,2425],{},[515,2426,1496],{},[1024,2428,2429,2434,2456],{},[1043,2430,2431],{"align":1029},[1912,2432,2433],{},"ready",[1043,2435,2436,2438,2439,2441,2442,2445,2446,2449,2450,2453,2454],{"align":1029},[515,2437,2392],{}," — Tells ",[515,2440,1986],{}," that ",[515,2443,2444],{},"AudioContext"," is authorised because an user gesture has been made on the page. This is imperative, as ",[515,2447,2448],{},"autoplay"," cannot be activated if no user gesture has been made previously (",[1230,2451,2320],{"href":2320,"rel":2452},[1234],"). ",[2395,2455],{},[1043,2457,2458],{},[515,2459,1100],{},[1024,2461,2462,2466,2474],{},[1043,2463,2464],{"align":1029},[1912,2465,2448],{},[1043,2467,2468,2470,2471,2473],{"align":1029},[515,2469,2392],{}," — Selects whether the audio is launched automatically. Please refer to the ",[515,2472,2433],{}," prop for a better understanding of how to use autoplay.",[1043,2475,2476],{},[515,2477,1100],{},[1024,2479,2480,2484,2489],{},[1043,2481,2482],{"align":1029},[1912,2483,1459],{},[1043,2485,2486,2488],{"align":1029},[515,2487,2392],{}," — Specifies whether the audio should loop.",[1043,2490,2491],{},[515,2492,1100],{},[1024,2494,2495,2500,2505],{},[1043,2496,2497],{"align":1029},[1912,2498,2499],{},"innerAngle",[1043,2501,2502,2504],{"align":1029},[515,2503,2416],{}," —  A parameter for directional audio sources, this is an angle, inside of which there will be no volume reduction.",[1043,2506,2507],{},[515,2508,2509],{},"360",[1024,2511,2512,2517,2526],{},[1043,2513,2514],{"align":1029},[1912,2515,2516],{},"outerAngle",[1043,2518,2519,2521,2522,2525],{"align":1029},[515,2520,2416],{}," —  A parameter for directional audio sources, this is an angle, outside of which the volume will be reduced to a constant value of ",[515,2523,2524],{},"outerGain"," prop.",[1043,2527,2528],{},[515,2529,833],{},[1024,2531,2532,2536,2547],{},[1043,2533,2534],{"align":1029},[1912,2535,2524],{},[1043,2537,2538,2540,2541,2543,2544,2546],{"align":1029},[515,2539,2416],{}," —  A parameter for directional audio sources, this is the amount of volume reduction outside of the ",[515,2542,2516],{}," prop. When the value is ",[515,2545,833],{}," no sound can be heard.",[1043,2548,2549],{},[515,2550,833],{},[553,2552,2554],{"id":2553},"exposed-properties","Exposed properties",[1018,2556,2557,2565],{},[1021,2558,2559],{},[1024,2560,2561,2563],{},[1027,2562,1509],{"align":1029},[1027,2564,1033],{"align":1029},[1038,2566,2567,2579,2592,2605,2618],{},[1024,2568,2569,2573],{},[1043,2570,2571],{"align":1029},[515,2572,748],{},[1043,2574,2575,2576,739],{"align":1029},"Instance reference — Inheritance of ",[1230,2577,455],{"href":1981,"rel":2578},[1234],[1024,2580,2581,2586],{},[1043,2582,2583],{"align":1029},[515,2584,2585],{},"play()",[1043,2587,2588,2589],{"align":1029},"Play audio — ",[2398,2590,2591],{},"Cannot be fired if audio is already running.",[1024,2593,2594,2599],{},[1043,2595,2596],{"align":1029},[515,2597,2598],{},"pause()",[1043,2600,2601,2602],{"align":1029},"Pause audio — ",[2398,2603,2604],{},"Cannot be fired if audio is already paused.",[1024,2606,2607,2612],{},[1043,2608,2609],{"align":1029},[515,2610,2611],{},"stop()",[1043,2613,2614,2615],{"align":1029},"Stop audio — ",[2398,2616,2617],{},"Cannot be fired if audio is already stopped.",[1024,2619,2620,2625],{},[1043,2621,2622],{"align":1029},[515,2623,2624],{},"dispose()",[1043,2626,2627],{"align":1029},"Dispose component — Deletion of the AudioListener in the camera, disconnection of the audio source and deletion of the PositionalAudioHelper (if it exists).",[526,2629,2633],{"className":2630,"code":2631,"language":2632,"meta":484,"style":484},"language-typescript shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","const positionalAudioRef = shallowRef(null)\n\nconsole.log(positionalAudioRef.value.instance) // instance properties\n\nconst handlerAudio = (action: string) => {\n  if (!positionalAudioRef.value) { return }\n\n  const { play, pause, stop } = positionalAudioRef.value\n\n  if (action === 'play') { play() }\n  else if (action === 'pause') { pause() }\n  else if (action === 'stop') { stop() }\n}\n","typescript",[515,2634,2635,2651,2655,2681,2685,2714,2741,2745,2778,2782,2812,2843,2872],{"__ignoreMap":484},[534,2636,2637,2639,2641,2643,2645,2647,2649],{"class":536,"line":485},[534,2638,685],{"class":547},[534,2640,2101],{"class":609},[534,2642,585],{"class":539},[534,2644,663],{"class":693},[534,2646,755],{"class":609},[534,2648,2110],{"class":539},[534,2650,765],{"class":609},[534,2652,2653],{"class":536,"line":486},[534,2654,679],{"emptyLinePlaceholder":492},[534,2656,2657,2660,2662,2665,2668,2670,2672,2674,2677],{"class":536,"line":560},[534,2658,2659],{"class":609},"console",[534,2661,739],{"class":539},[534,2663,2664],{"class":693},"log",[534,2666,2667],{"class":609},"(positionalAudioRef",[534,2669,739],{"class":539},[534,2671,742],{"class":609},[534,2673,739],{"class":539},[534,2675,2676],{"class":609},"instance) ",[534,2678,2680],{"class":2679},"sHwdD","// instance properties\n",[534,2682,2683],{"class":536,"line":656},[534,2684,679],{"emptyLinePlaceholder":492},[534,2686,2687,2689,2692,2694,2697,2700,2703,2707,2710,2712],{"class":536,"line":676},[534,2688,685],{"class":547},[534,2690,2691],{"class":609}," handlerAudio ",[534,2693,585],{"class":539},[534,2695,2696],{"class":539}," (",[534,2698,2699],{"class":937},"action",[534,2701,2702],{"class":539},":",[534,2704,2706],{"class":2705},"sBMFI"," string",[534,2708,2709],{"class":539},")",[534,2711,2128],{"class":547},[534,2713,730],{"class":539},[534,2715,2716,2719,2721,2724,2726,2728,2730,2732,2735,2738],{"class":536,"line":561},[534,2717,2718],{"class":602},"  if",[534,2720,2696],{"class":543},[534,2722,2723],{"class":539},"!",[534,2725,2252],{"class":609},[534,2727,739],{"class":539},[534,2729,742],{"class":609},[534,2731,941],{"class":543},[534,2733,2734],{"class":539},"{",[534,2736,2737],{"class":602}," return",[534,2739,2740],{"class":539}," }\n",[534,2742,2743],{"class":536,"line":562},[534,2744,679],{"emptyLinePlaceholder":492},[534,2746,2747,2750,2752,2755,2757,2760,2762,2765,2767,2770,2773,2775],{"class":536,"line":713},[534,2748,2749],{"class":547},"  const",[534,2751,606],{"class":539},[534,2753,2754],{"class":609}," play",[534,2756,639],{"class":539},[534,2758,2759],{"class":609}," pause",[534,2761,639],{"class":539},[534,2763,2764],{"class":609}," stop",[534,2766,613],{"class":539},[534,2768,2769],{"class":539}," =",[534,2771,2772],{"class":609}," positionalAudioRef",[534,2774,739],{"class":539},[534,2776,2777],{"class":609},"value\n",[534,2779,2780],{"class":536,"line":563},[534,2781,679],{"emptyLinePlaceholder":492},[534,2783,2784,2786,2788,2790,2793,2795,2798,2801,2803,2805,2807,2810],{"class":536,"line":564},[534,2785,2718],{"class":602},[534,2787,2696],{"class":543},[534,2789,2699],{"class":609},[534,2791,2792],{"class":539}," ===",[534,2794,619],{"class":539},[534,2796,2797],{"class":591},"play",[534,2799,2800],{"class":539},"'",[534,2802,941],{"class":543},[534,2804,2734],{"class":539},[534,2806,2754],{"class":693},[534,2808,2809],{"class":543},"() ",[534,2811,771],{"class":539},[534,2813,2814,2817,2820,2822,2824,2826,2828,2831,2833,2835,2837,2839,2841],{"class":536,"line":565},[534,2815,2816],{"class":602},"  else",[534,2818,2819],{"class":602}," if",[534,2821,2696],{"class":543},[534,2823,2699],{"class":609},[534,2825,2792],{"class":539},[534,2827,619],{"class":539},[534,2829,2830],{"class":591},"pause",[534,2832,2800],{"class":539},[534,2834,941],{"class":543},[534,2836,2734],{"class":539},[534,2838,2759],{"class":693},[534,2840,2809],{"class":543},[534,2842,771],{"class":539},[534,2844,2845,2847,2849,2851,2853,2855,2857,2860,2862,2864,2866,2868,2870],{"class":536,"line":774},[534,2846,2816],{"class":602},[534,2848,2819],{"class":602},[534,2850,2696],{"class":543},[534,2852,2699],{"class":609},[534,2854,2792],{"class":539},[534,2856,619],{"class":539},[534,2858,2859],{"class":591},"stop",[534,2861,2800],{"class":539},[534,2863,941],{"class":543},[534,2865,2734],{"class":539},[534,2867,2764],{"class":693},[534,2869,2809],{"class":543},[534,2871,771],{"class":539},[534,2873,2874],{"class":536,"line":784},[534,2875,771],{"class":539},[526,2877,2879],{"className":528,"code":2878,"language":530,"meta":484,"style":484},"\u003Ctemplate>\n  \u003Cbutton @click=\"handlerAudio('play')\">play\u003C/button>\n  \u003Cbutton @click=\"handlerAudio('pause')\">pause\u003C/button>\n  \u003Cbutton @click=\"handlerAudio('stop')\">stop\u003C/button>\n\n  \u003CTresCanvas>\n    \u003CSphere>\n      \u003CSuspense>\n        \u003CPositionalAudio />\n      \u003C/Suspense>\n    \u003C/Sphere>\n  \u003C/TresCanvas>\n\u003C/template>\n",[515,2880,2881,2889,2930,2968,3006,3010,3018,3026,3034,3042,3050,3058,3066],{"__ignoreMap":484},[534,2882,2883,2885,2887],{"class":536,"line":485},[534,2884,540],{"class":539},[534,2886,794],{"class":543},[534,2888,597],{"class":539},[534,2890,2891,2893,2896,2898,2900,2902,2904,2907,2909,2911,2913,2915,2917,2919,2922,2924,2926,2928],{"class":536,"line":486},[534,2892,802],{"class":539},[534,2894,2895],{"class":543},"button",[534,2897,925],{"class":539},[534,2899,928],{"class":547},[534,2901,585],{"class":539},[534,2903,588],{"class":539},[534,2905,2906],{"class":693},"handlerAudio",[534,2908,755],{"class":539},[534,2910,2800],{"class":539},[534,2912,2797],{"class":591},[534,2914,2800],{"class":539},[534,2916,2709],{"class":539},[534,2918,588],{"class":539},[534,2920,2921],{"class":539},">",[534,2923,2797],{"class":609},[534,2925,777],{"class":539},[534,2927,2895],{"class":543},[534,2929,597],{"class":539},[534,2931,2932,2934,2936,2938,2940,2942,2944,2946,2948,2950,2952,2954,2956,2958,2960,2962,2964,2966],{"class":536,"line":560},[534,2933,802],{"class":539},[534,2935,2895],{"class":543},[534,2937,925],{"class":539},[534,2939,928],{"class":547},[534,2941,585],{"class":539},[534,2943,588],{"class":539},[534,2945,2906],{"class":693},[534,2947,755],{"class":539},[534,2949,2800],{"class":539},[534,2951,2830],{"class":591},[534,2953,2800],{"class":539},[534,2955,2709],{"class":539},[534,2957,588],{"class":539},[534,2959,2921],{"class":539},[534,2961,2830],{"class":609},[534,2963,777],{"class":539},[534,2965,2895],{"class":543},[534,2967,597],{"class":539},[534,2969,2970,2972,2974,2976,2978,2980,2982,2984,2986,2988,2990,2992,2994,2996,2998,3000,3002,3004],{"class":536,"line":656},[534,2971,802],{"class":539},[534,2973,2895],{"class":543},[534,2975,925],{"class":539},[534,2977,928],{"class":547},[534,2979,585],{"class":539},[534,2981,588],{"class":539},[534,2983,2906],{"class":693},[534,2985,755],{"class":539},[534,2987,2800],{"class":539},[534,2989,2859],{"class":591},[534,2991,2800],{"class":539},[534,2993,2709],{"class":539},[534,2995,588],{"class":539},[534,2997,2921],{"class":539},[534,2999,2859],{"class":609},[534,3001,777],{"class":539},[534,3003,2895],{"class":543},[534,3005,597],{"class":539},[534,3007,3008],{"class":536,"line":676},[534,3009,679],{"emptyLinePlaceholder":492},[534,3011,3012,3014,3016],{"class":536,"line":561},[534,3013,802],{"class":539},[534,3015,805],{"class":543},[534,3017,597],{"class":539},[534,3019,3020,3022,3024],{"class":536,"line":562},[534,3021,813],{"class":539},[534,3023,261],{"class":543},[534,3025,597],{"class":539},[534,3027,3028,3030,3032],{"class":536,"line":713},[534,3029,909],{"class":539},[534,3031,2229],{"class":543},[534,3033,597],{"class":539},[534,3035,3036,3038,3040],{"class":536,"line":563},[534,3037,958],{"class":539},[534,3039,455],{"class":543},[534,3041,551],{"class":539},[534,3043,3044,3046,3048],{"class":536,"line":564},[534,3045,979],{"class":539},[534,3047,2229],{"class":543},[534,3049,597],{"class":539},[534,3051,3052,3054,3056],{"class":536,"line":565},[534,3053,989],{"class":539},[534,3055,261],{"class":543},[534,3057,597],{"class":539},[534,3059,3060,3062,3064],{"class":536,"line":774},[534,3061,999],{"class":539},[534,3063,805],{"class":543},[534,3065,597],{"class":539},[534,3067,3068,3070,3072],{"class":536,"line":784},[534,3069,777],{"class":539},[534,3071,794],{"class":543},[534,3073,597],{"class":539},[553,3075,1500],{"id":1499},[1018,3077,3078,3086],{},[1021,3079,3080],{},[1024,3081,3082,3084],{},[1027,3083,1509],{"align":1029},[1027,3085,1033],{"align":1029},[1038,3087,3088],{},[1024,3089,3090,3095],{},[1043,3091,3092],{"align":1029},[515,3093,3094],{},"is-playing",[1043,3096,3097,3098,1173,3100],{"align":1029},"Triggered when the audio changes its state (play, pause, or stop) ",[2395,3099],{},[515,3101,3102],{},"@is-playing=\"(e) => yourIsPlayingRef = e\"",[1198,3104,3105],{},"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 pre.shiki code .sbssI, html code.shiki .sbssI{--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C}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 .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 .sHdIc, html code.shiki .sHdIc{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#EEFFFF;--shiki-default-font-style:italic;--shiki-dark:#BABED8;--shiki-dark-font-style:italic}html pre.shiki code .sBMFI, html code.shiki .sBMFI{--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B}",{"title":484,"searchDepth":485,"depth":486,"links":3107},[3108,3109,3110,3111,3112],{"id":555,"depth":486,"text":15},{"id":2339,"depth":486,"text":2340},{"id":1015,"depth":486,"text":1016},{"id":2553,"depth":486,"text":2554},{"id":1499,"depth":486,"text":1500},"Spatially positioned audio in 3D space.",{},{"title":455,"description":3113},"LsmuqynUpKNFwOEvnJJepUiBRKPh7SYxe1fcp-_mrT4",{"id":3118,"title":459,"body":3119,"description":3770,"extension":489,"links":490,"meta":3771,"navigation":492,"path":460,"seo":3772,"stem":461,"__hash__":3773},"docs/2.api/miscellaneous/use-animations.md",{"type":473,"value":3120,"toc":3763},[3121,3135,3137,3141,3151,3386,3390,3397,3735,3739,3760],[476,3122,3123,3125,3126,3129,3130,1998],{},[515,3124,459],{}," is a composable that returns a ",[515,3127,3128],{},"shallowReactive"," with all the models actions based on the animations provided. It is a wrapper around the ",[1230,3131,3134],{"href":3132,"rel":3133},"https://threejs.org/docs/#api/en/animation/AnimationMixer",[1234],"AnimationMixer",[553,3136,15],{"id":555},[1185,3138,3140],{"id":3139},"basic-usage-automatic-updates","Basic Usage (Automatic Updates)",[476,3142,3143,3144,3146,3147,3150],{},"By default, ",[515,3145,459],{}," automatically updates the animation mixer on each frame using the ",[515,3148,3149],{},"useLoop"," composable:",[526,3152,3156],{"className":3153,"code":3154,"highlights":3155,"language":592,"meta":484,"style":484},"language-ts shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","import { useAnimations, useGLTF } from '@tresjs/cientos'\n\nconst { state } = useGLTF('/models/ugly-naked-bunny.gltf')\n\nconst animations = computed(() => state.value?.animations || [])\nconst model = computed(() => state?.value?.scene)\nconst { actions } = useAnimations(animations, model)\n\nconst currentAction = ref()\n\nwatch(actions, (newActions) => {\n  currentAction.value = newActions.Greeting\n  currentAction.value.play()\n})\n",[485,562],[515,3157,3158,3183,3187,3213,3217,3253,3281,3305,3309,3322,3326,3347,3366,3380],{"__ignoreMap":484},[534,3159,3161,3163,3165,3168,3170,3173,3175,3177,3179,3181],{"class":3160,"line":485},[536,629],[534,3162,603],{"class":602},[534,3164,606],{"class":539},[534,3166,3167],{"class":609}," useAnimations",[534,3169,639],{"class":539},[534,3171,3172],{"class":609}," useGLTF",[534,3174,613],{"class":539},[534,3176,616],{"class":602},[534,3178,619],{"class":539},[534,3180,651],{"class":591},[534,3182,625],{"class":539},[534,3184,3185],{"class":536,"line":486},[534,3186,679],{"emptyLinePlaceholder":492},[534,3188,3189,3191,3193,3196,3198,3200,3202,3204,3206,3209,3211],{"class":536,"line":560},[534,3190,685],{"class":547},[534,3192,606],{"class":539},[534,3194,3195],{"class":609}," state ",[534,3197,2151],{"class":539},[534,3199,2769],{"class":539},[534,3201,3172],{"class":693},[534,3203,755],{"class":609},[534,3205,2800],{"class":539},[534,3207,3208],{"class":591},"/models/ugly-naked-bunny.gltf",[534,3210,2800],{"class":539},[534,3212,765],{"class":609},[534,3214,3215],{"class":536,"line":656},[534,3216,679],{"emptyLinePlaceholder":492},[534,3218,3219,3221,3224,3226,3229,3231,3233,3235,3238,3240,3242,3244,3247,3250],{"class":536,"line":676},[534,3220,685],{"class":547},[534,3222,3223],{"class":609}," animations ",[534,3225,585],{"class":539},[534,3227,3228],{"class":693}," computed",[534,3230,755],{"class":609},[534,3232,727],{"class":539},[534,3234,2128],{"class":547},[534,3236,3237],{"class":609}," state",[534,3239,739],{"class":539},[534,3241,742],{"class":609},[534,3243,745],{"class":539},[534,3245,3246],{"class":609},"animations ",[534,3248,3249],{"class":539},"||",[534,3251,3252],{"class":609}," [])\n",[534,3254,3255,3257,3260,3262,3264,3266,3268,3270,3272,3274,3276,3278],{"class":536,"line":561},[534,3256,685],{"class":547},[534,3258,3259],{"class":609}," model ",[534,3261,585],{"class":539},[534,3263,3228],{"class":693},[534,3265,755],{"class":609},[534,3267,727],{"class":539},[534,3269,2128],{"class":547},[534,3271,3237],{"class":609},[534,3273,745],{"class":539},[534,3275,742],{"class":609},[534,3277,745],{"class":539},[534,3279,3280],{"class":609},"scene)\n",[534,3282,3284,3286,3288,3291,3293,3295,3297,3300,3302],{"class":3283,"line":562},[536,629],[534,3285,685],{"class":547},[534,3287,606],{"class":539},[534,3289,3290],{"class":609}," actions ",[534,3292,2151],{"class":539},[534,3294,2769],{"class":539},[534,3296,3167],{"class":693},[534,3298,3299],{"class":609},"(animations",[534,3301,639],{"class":539},[534,3303,3304],{"class":609}," model)\n",[534,3306,3307],{"class":536,"line":713},[534,3308,679],{"emptyLinePlaceholder":492},[534,3310,3311,3313,3316,3318,3320],{"class":536,"line":563},[534,3312,685],{"class":547},[534,3314,3315],{"class":609}," currentAction ",[534,3317,585],{"class":539},[534,3319,872],{"class":693},[534,3321,696],{"class":609},[534,3323,3324],{"class":536,"line":564},[534,3325,679],{"emptyLinePlaceholder":492},[534,3327,3328,3331,3334,3336,3338,3341,3343,3345],{"class":536,"line":565},[534,3329,3330],{"class":693},"watch",[534,3332,3333],{"class":609},"(actions",[534,3335,639],{"class":539},[534,3337,2696],{"class":539},[534,3339,3340],{"class":937},"newActions",[534,3342,2709],{"class":539},[534,3344,2128],{"class":547},[534,3346,730],{"class":539},[534,3348,3349,3352,3354,3356,3358,3361,3363],{"class":536,"line":774},[534,3350,3351],{"class":609},"  currentAction",[534,3353,739],{"class":539},[534,3355,742],{"class":609},[534,3357,2769],{"class":539},[534,3359,3360],{"class":609}," newActions",[534,3362,739],{"class":539},[534,3364,3365],{"class":609},"Greeting\n",[534,3367,3368,3370,3372,3374,3376,3378],{"class":536,"line":784},[534,3369,3351],{"class":609},[534,3371,739],{"class":539},[534,3373,742],{"class":609},[534,3375,739],{"class":539},[534,3377,2797],{"class":693},[534,3379,696],{"class":543},[534,3381,3382,3384],{"class":536,"line":789},[534,3383,2151],{"class":539},[534,3385,765],{"class":609},[1185,3387,3389],{"id":3388},"manual-updates","Manual Updates",[476,3391,3392,3393,3396],{},"To gain finer control over animation mixer updates, enable ",[515,3394,3395],{},"manualUpdate: true"," and manage the update cycle manually.",[526,3398,3401],{"className":3153,"code":3399,"highlights":3400,"language":592,"meta":484,"style":484},"import { useAnimations, useGLTF } from '@tresjs/cientos'\nimport { useLoop } from '@tresjs/core'\n\nconst { state } = useGLTF('/models/ugly-naked-bunny.gltf')\n\nconst animations = computed(() => state.value?.animations || [])\nconst model = computed(() => state?.value?.scene)\nconst { actions, mixer } = useAnimations(animations, model, {\n  manualUpdate: true,\n})\n\n// Handle updates manually\nconst { onBeforeRender } = useLoop()\nonBeforeRender(({ delta }) => {\n  mixer.value.update(delta)\n})\n\nconst currentAction = ref()\n\nwatch(actions, (newActions) => {\n  currentAction.value = newActions.Greeting\n  currentAction.value.play()\n})\n",[485,713,563,564,799],[515,3402,3403,3426,3445,3449,3473,3477,3507,3533,3565,3580,3587,3591,3596,3613,3633,3655,3661,3665,3677,3681,3699,3715,3729],{"__ignoreMap":484},[534,3404,3406,3408,3410,3412,3414,3416,3418,3420,3422,3424],{"class":3405,"line":485},[536,629],[534,3407,603],{"class":602},[534,3409,606],{"class":539},[534,3411,3167],{"class":609},[534,3413,639],{"class":539},[534,3415,3172],{"class":609},[534,3417,613],{"class":539},[534,3419,616],{"class":602},[534,3421,619],{"class":539},[534,3423,651],{"class":591},[534,3425,625],{"class":539},[534,3427,3428,3430,3432,3435,3437,3439,3441,3443],{"class":536,"line":486},[534,3429,603],{"class":602},[534,3431,606],{"class":539},[534,3433,3434],{"class":609}," useLoop",[534,3436,613],{"class":539},[534,3438,616],{"class":602},[534,3440,619],{"class":539},[534,3442,622],{"class":591},[534,3444,625],{"class":539},[534,3446,3447],{"class":536,"line":560},[534,3448,679],{"emptyLinePlaceholder":492},[534,3450,3451,3453,3455,3457,3459,3461,3463,3465,3467,3469,3471],{"class":536,"line":656},[534,3452,685],{"class":547},[534,3454,606],{"class":539},[534,3456,3195],{"class":609},[534,3458,2151],{"class":539},[534,3460,2769],{"class":539},[534,3462,3172],{"class":693},[534,3464,755],{"class":609},[534,3466,2800],{"class":539},[534,3468,3208],{"class":591},[534,3470,2800],{"class":539},[534,3472,765],{"class":609},[534,3474,3475],{"class":536,"line":676},[534,3476,679],{"emptyLinePlaceholder":492},[534,3478,3479,3481,3483,3485,3487,3489,3491,3493,3495,3497,3499,3501,3503,3505],{"class":536,"line":561},[534,3480,685],{"class":547},[534,3482,3223],{"class":609},[534,3484,585],{"class":539},[534,3486,3228],{"class":693},[534,3488,755],{"class":609},[534,3490,727],{"class":539},[534,3492,2128],{"class":547},[534,3494,3237],{"class":609},[534,3496,739],{"class":539},[534,3498,742],{"class":609},[534,3500,745],{"class":539},[534,3502,3246],{"class":609},[534,3504,3249],{"class":539},[534,3506,3252],{"class":609},[534,3508,3509,3511,3513,3515,3517,3519,3521,3523,3525,3527,3529,3531],{"class":536,"line":562},[534,3510,685],{"class":547},[534,3512,3259],{"class":609},[534,3514,585],{"class":539},[534,3516,3228],{"class":693},[534,3518,755],{"class":609},[534,3520,727],{"class":539},[534,3522,2128],{"class":547},[534,3524,3237],{"class":609},[534,3526,745],{"class":539},[534,3528,742],{"class":609},[534,3530,745],{"class":539},[534,3532,3280],{"class":609},[534,3534,3536,3538,3540,3543,3545,3548,3550,3552,3554,3556,3558,3561,3563],{"class":3535,"line":713},[536,629],[534,3537,685],{"class":547},[534,3539,606],{"class":539},[534,3541,3542],{"class":609}," actions",[534,3544,639],{"class":539},[534,3546,3547],{"class":609}," mixer ",[534,3549,2151],{"class":539},[534,3551,2769],{"class":539},[534,3553,3167],{"class":693},[534,3555,3299],{"class":609},[534,3557,639],{"class":539},[534,3559,3560],{"class":609}," model",[534,3562,639],{"class":539},[534,3564,730],{"class":539},[534,3566,3568,3571,3573,3577],{"class":3567,"line":563},[536,629],[534,3569,3570],{"class":543},"  manualUpdate",[534,3572,2702],{"class":539},[534,3574,3576],{"class":3575},"sfNiH"," true",[534,3578,3579],{"class":539},",\n",[534,3581,3583,3585],{"class":3582,"line":564},[536,629],[534,3584,2151],{"class":539},[534,3586,765],{"class":609},[534,3588,3589],{"class":536,"line":565},[534,3590,679],{"emptyLinePlaceholder":492},[534,3592,3593],{"class":536,"line":774},[534,3594,3595],{"class":2679},"// Handle updates manually\n",[534,3597,3598,3600,3602,3605,3607,3609,3611],{"class":536,"line":784},[534,3599,685],{"class":547},[534,3601,606],{"class":539},[534,3603,3604],{"class":609}," onBeforeRender ",[534,3606,2151],{"class":539},[534,3608,2769],{"class":539},[534,3610,3434],{"class":693},[534,3612,696],{"class":609},[534,3614,3615,3618,3620,3623,3626,3629,3631],{"class":536,"line":789},[534,3616,3617],{"class":693},"onBeforeRender",[534,3619,755],{"class":609},[534,3621,3622],{"class":539},"({",[534,3624,3625],{"class":937}," delta",[534,3627,3628],{"class":539}," })",[534,3630,2128],{"class":547},[534,3632,730],{"class":539},[534,3634,3636,3639,3641,3643,3645,3648,3650,3653],{"class":3635,"line":799},[536,629],[534,3637,3638],{"class":609},"  mixer",[534,3640,739],{"class":539},[534,3642,742],{"class":609},[534,3644,739],{"class":539},[534,3646,3647],{"class":693},"update",[534,3649,755],{"class":543},[534,3651,3652],{"class":609},"delta",[534,3654,765],{"class":543},[534,3656,3657,3659],{"class":536,"line":810},[534,3658,2151],{"class":539},[534,3660,765],{"class":609},[534,3662,3663],{"class":536,"line":854},[534,3664,679],{"emptyLinePlaceholder":492},[534,3666,3667,3669,3671,3673,3675],{"class":536,"line":566},[534,3668,685],{"class":547},[534,3670,3315],{"class":609},[534,3672,585],{"class":539},[534,3674,872],{"class":693},[534,3676,696],{"class":609},[534,3678,3679],{"class":536,"line":906},[534,3680,679],{"emptyLinePlaceholder":492},[534,3682,3683,3685,3687,3689,3691,3693,3695,3697],{"class":536,"line":955},[534,3684,3330],{"class":693},[534,3686,3333],{"class":609},[534,3688,639],{"class":539},[534,3690,2696],{"class":539},[534,3692,3340],{"class":937},[534,3694,2709],{"class":539},[534,3696,2128],{"class":547},[534,3698,730],{"class":539},[534,3700,3701,3703,3705,3707,3709,3711,3713],{"class":536,"line":966},[534,3702,3351],{"class":609},[534,3704,739],{"class":539},[534,3706,742],{"class":609},[534,3708,2769],{"class":539},[534,3710,3360],{"class":609},[534,3712,739],{"class":539},[534,3714,3365],{"class":609},[534,3716,3717,3719,3721,3723,3725,3727],{"class":536,"line":976},[534,3718,3351],{"class":609},[534,3720,739],{"class":539},[534,3722,742],{"class":609},[534,3724,739],{"class":539},[534,3726,2797],{"class":693},[534,3728,696],{"class":543},[534,3730,3731,3733],{"class":536,"line":567},[534,3732,2151],{"class":539},[534,3734,765],{"class":609},[553,3736,3738],{"id":3737},"options","Options",[3740,3741,3742],"ul",{},[3743,3744,3745,3748,3749,3751,3752,3755,3756,3759],"li",{},[515,3746,3747],{},"manualUpdate"," (optional): Default is ",[515,3750,1100],{},". If set to ",[515,3753,3754],{},"true",", disables automatic animation mixer updates. You'll need to call ",[515,3757,3758],{},"mixer.value.update(delta)"," manually.",[1198,3761,3762],{},"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 .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}html pre.shiki code .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}html pre.shiki code .sHdIc, html code.shiki .sHdIc{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#EEFFFF;--shiki-default-font-style:italic;--shiki-dark:#BABED8;--shiki-dark-font-style:italic}html pre.shiki code .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}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}",{"title":484,"searchDepth":485,"depth":486,"links":3764},[3765,3769],{"id":555,"depth":486,"text":15,"children":3766},[3767,3768],{"id":3139,"depth":560,"text":3140},{"id":3388,"depth":560,"text":3389},{"id":3737,"depth":486,"text":3738},"Composable for managing model animations with AnimationMixer.",{},{"title":459,"description":3770},"TJcEqtFqnepbieID3hzHGMd0QylrwTz-3E1RokTEGoY",{"id":3775,"title":463,"body":3776,"description":4442,"extension":489,"links":490,"meta":4443,"navigation":492,"path":464,"seo":4444,"stem":465,"__hash__":4445},"docs/2.api/miscellaneous/use-gltf-exporter.md",{"type":473,"value":3777,"toc":4436},[3778,3796,3800,4229,4233,4285,4287,4433],[476,3779,3780,3785,3786,3791,3792,3795],{},[1230,3781,3784],{"href":3782,"rel":3783},"https://threejs.org/docs/index.html?q=expo#examples/en/exporters/GLTFExporter",[1234],"GLTFExporter"," is an addon in Three.js that allows you to download any object3D in a ",[1230,3787,3790],{"href":3788,"rel":3789},"https://www.khronos.org/gltf",[1234],"GLTF"," format. ",[1912,3793,3794],{},"TresJS"," provides a composable that simplifies this process with just a few lines of code.",[553,3797,3799],{"id":3798},"basic-usage","Basic usage",[526,3801,3804],{"className":528,"code":3802,"highlights":3803,"language":530,"meta":484,"style":484},"\u003Cscript setup lang=\"ts\">\nimport { TresCanvas } from '@tresjs/core'\nimport { useGLTFExporter } from '@tresjs/cientos'\nimport { shallowRef } from 'vue'\n\nconst boxRef = shallowRef()\n\n// the second argument – options – is not required\nconst downloadBox = () => {\n  useGLTFExporter(boxRef.value, { fileName: 'cube', binary: true })\n}\n\u003C/script>\n\u003Ctemplate>\n  \u003CTresCanvas clear-color=\"#82DBC5\" window-size >\n    \u003CTresPerspectiveCamera :position=\"[0, 2, 5]\" />\n    \u003CTresMesh\n      ref=\"boxRef\"\n      :position-z=\"30\"\n      :scale=\"10\"\n      @click=\"downloadBox\"\n    >\n      \u003CTresBoxGeometry :args=\"[1, 1, 1]\" />\n      \u003CTresMeshStandardMaterial :color=\"0x00ff00\" />\n    \u003C/TresMesh>\n    \u003CTresDirectionalLight :position=\"[0, 10, 10]\" />\n  \u003C/TresCanvas>\n\u003C/template>\n\n",[560,564],[515,3805,3806,3826,3844,3864,3882,3886,3899,3903,3908,3924,3968,3972,3980,3988,4010,4042,4049,4062,4079,4095,4111,4116,4148,4171,4179,4211,4220],{"__ignoreMap":484},[534,3807,3808,3810,3812,3814,3816,3818,3820,3822,3824],{"class":536,"line":485},[534,3809,540],{"class":539},[534,3811,576],{"class":543},[534,3813,579],{"class":547},[534,3815,582],{"class":547},[534,3817,585],{"class":539},[534,3819,588],{"class":539},[534,3821,592],{"class":591},[534,3823,588],{"class":539},[534,3825,597],{"class":539},[534,3827,3828,3830,3832,3834,3836,3838,3840,3842],{"class":536,"line":486},[534,3829,603],{"class":602},[534,3831,606],{"class":539},[534,3833,610],{"class":609},[534,3835,613],{"class":539},[534,3837,616],{"class":602},[534,3839,619],{"class":539},[534,3841,622],{"class":591},[534,3843,625],{"class":539},[534,3845,3847,3849,3851,3854,3856,3858,3860,3862],{"class":3846,"line":560},[536,629],[534,3848,603],{"class":602},[534,3850,606],{"class":539},[534,3852,3853],{"class":609}," useGLTFExporter",[534,3855,613],{"class":539},[534,3857,616],{"class":602},[534,3859,619],{"class":539},[534,3861,651],{"class":591},[534,3863,625],{"class":539},[534,3865,3866,3868,3870,3872,3874,3876,3878,3880],{"class":536,"line":656},[534,3867,603],{"class":602},[534,3869,606],{"class":539},[534,3871,663],{"class":609},[534,3873,613],{"class":539},[534,3875,616],{"class":602},[534,3877,619],{"class":539},[534,3879,530],{"class":591},[534,3881,625],{"class":539},[534,3883,3884],{"class":536,"line":676},[534,3885,679],{"emptyLinePlaceholder":492},[534,3887,3888,3890,3893,3895,3897],{"class":536,"line":561},[534,3889,685],{"class":547},[534,3891,3892],{"class":609}," boxRef ",[534,3894,585],{"class":539},[534,3896,663],{"class":693},[534,3898,696],{"class":609},[534,3900,3901],{"class":536,"line":562},[534,3902,679],{"emptyLinePlaceholder":492},[534,3904,3905],{"class":536,"line":713},[534,3906,3907],{"class":2679},"// the second argument – options – is not required\n",[534,3909,3910,3912,3915,3917,3920,3922],{"class":536,"line":563},[534,3911,685],{"class":547},[534,3913,3914],{"class":609}," downloadBox ",[534,3916,585],{"class":539},[534,3918,3919],{"class":539}," ()",[534,3921,2128],{"class":547},[534,3923,730],{"class":539},[534,3925,3927,3930,3932,3935,3937,3939,3941,3943,3946,3948,3950,3953,3955,3957,3960,3962,3964,3966],{"class":3926,"line":564},[536,629],[534,3928,3929],{"class":693},"  useGLTFExporter",[534,3931,755],{"class":543},[534,3933,3934],{"class":609},"boxRef",[534,3936,739],{"class":539},[534,3938,742],{"class":609},[534,3940,639],{"class":539},[534,3942,606],{"class":539},[534,3944,3945],{"class":543}," fileName",[534,3947,2702],{"class":539},[534,3949,619],{"class":539},[534,3951,3952],{"class":591},"cube",[534,3954,2800],{"class":539},[534,3956,639],{"class":539},[534,3958,3959],{"class":543}," binary",[534,3961,2702],{"class":539},[534,3963,3576],{"class":3575},[534,3965,613],{"class":539},[534,3967,765],{"class":543},[534,3969,3970],{"class":536,"line":565},[534,3971,771],{"class":539},[534,3973,3974,3976,3978],{"class":536,"line":774},[534,3975,777],{"class":539},[534,3977,576],{"class":543},[534,3979,597],{"class":539},[534,3981,3982,3984,3986],{"class":536,"line":784},[534,3983,540],{"class":539},[534,3985,794],{"class":543},[534,3987,597],{"class":539},[534,3989,3990,3992,3994,3996,3998,4000,4002,4004,4007],{"class":536,"line":789},[534,3991,802],{"class":539},[534,3993,805],{"class":543},[534,3995,1693],{"class":547},[534,3997,585],{"class":539},[534,3999,588],{"class":539},[534,4001,1700],{"class":591},[534,4003,588],{"class":539},[534,4005,4006],{"class":547}," window-size",[534,4008,4009],{"class":539}," >\n",[534,4011,4012,4014,4016,4018,4020,4022,4024,4026,4028,4030,4032,4034,4036,4038,4040],{"class":536,"line":799},[534,4013,813],{"class":539},[534,4015,816],{"class":543},[534,4017,819],{"class":539},[534,4019,822],{"class":547},[534,4021,585],{"class":539},[534,4023,588],{"class":539},[534,4025,829],{"class":539},[534,4027,833],{"class":832},[534,4029,836],{"class":539},[534,4031,839],{"class":832},[534,4033,836],{"class":539},[534,4035,844],{"class":832},[534,4037,847],{"class":539},[534,4039,588],{"class":539},[534,4041,551],{"class":539},[534,4043,4044,4046],{"class":536,"line":810},[534,4045,813],{"class":539},[534,4047,4048],{"class":543},"TresMesh\n",[534,4050,4051,4054,4056,4058,4060],{"class":536,"line":854},[534,4052,4053],{"class":547},"      ref",[534,4055,585],{"class":539},[534,4057,588],{"class":539},[534,4059,3934],{"class":591},[534,4061,2255],{"class":539},[534,4063,4064,4067,4070,4072,4074,4077],{"class":536,"line":566},[534,4065,4066],{"class":539},"      :",[534,4068,4069],{"class":547},"position-z",[534,4071,585],{"class":539},[534,4073,588],{"class":539},[534,4075,4076],{"class":832},"30",[534,4078,2255],{"class":539},[534,4080,4081,4083,4086,4088,4090,4093],{"class":536,"line":906},[534,4082,4066],{"class":539},[534,4084,4085],{"class":547},"scale",[534,4087,585],{"class":539},[534,4089,588],{"class":539},[534,4091,4092],{"class":832},"10",[534,4094,2255],{"class":539},[534,4096,4097,4100,4102,4104,4106,4109],{"class":536,"line":955},[534,4098,4099],{"class":539},"      @",[534,4101,928],{"class":547},[534,4103,585],{"class":539},[534,4105,588],{"class":539},[534,4107,4108],{"class":609},"downloadBox",[534,4110,2255],{"class":539},[534,4112,4113],{"class":536,"line":966},[534,4114,4115],{"class":539},"    >\n",[534,4117,4118,4120,4122,4124,4126,4128,4130,4132,4134,4136,4138,4140,4142,4144,4146],{"class":536,"line":976},[534,4119,909],{"class":539},[534,4121,961],{"class":543},[534,4123,819],{"class":539},[534,4125,2192],{"class":547},[534,4127,585],{"class":539},[534,4129,588],{"class":539},[534,4131,829],{"class":539},[534,4133,1496],{"class":832},[534,4135,836],{"class":539},[534,4137,1496],{"class":832},[534,4139,836],{"class":539},[534,4141,1496],{"class":832},[534,4143,847],{"class":539},[534,4145,588],{"class":539},[534,4147,551],{"class":539},[534,4149,4150,4152,4155,4157,4160,4162,4164,4167,4169],{"class":536,"line":567},[534,4151,909],{"class":539},[534,4153,4154],{"class":543},"TresMeshStandardMaterial",[534,4156,819],{"class":539},[534,4158,4159],{"class":547},"color",[534,4161,585],{"class":539},[534,4163,588],{"class":539},[534,4165,4166],{"class":832},"0x00ff00",[534,4168,588],{"class":539},[534,4170,551],{"class":539},[534,4172,4173,4175,4177],{"class":536,"line":996},[534,4174,989],{"class":539},[534,4176,912],{"class":543},[534,4178,597],{"class":539},[534,4180,4181,4183,4185,4187,4189,4191,4193,4195,4197,4199,4201,4203,4205,4207,4209],{"class":536,"line":1006},[534,4182,813],{"class":539},[534,4184,1847],{"class":543},[534,4186,819],{"class":539},[534,4188,822],{"class":547},[534,4190,585],{"class":539},[534,4192,588],{"class":539},[534,4194,829],{"class":539},[534,4196,833],{"class":832},[534,4198,836],{"class":539},[534,4200,4092],{"class":832},[534,4202,836],{"class":539},[534,4204,4092],{"class":832},[534,4206,847],{"class":539},[534,4208,588],{"class":539},[534,4210,551],{"class":539},[534,4212,4214,4216,4218],{"class":536,"line":4213},26,[534,4215,999],{"class":539},[534,4217,805],{"class":543},[534,4219,597],{"class":539},[534,4221,4223,4225,4227],{"class":536,"line":4222},27,[534,4224,777],{"class":539},[534,4226,794],{"class":543},[534,4228,597],{"class":539},[553,4230,4232],{"id":4231},"arguments","Arguments",[1018,4234,4235,4248],{},[1021,4236,4237],{},[1024,4238,4239,4241,4244,4246],{},[1027,4240,1030],{"align":1029},[1027,4242,4243],{},"Type",[1027,4245,1036],{},[1027,4247,1033],{},[1038,4249,4250,4267],{},[1024,4251,4252,4257,4261,4264],{},[1043,4253,4254],{"align":1029},[1912,4255,4256],{},"Selector",[1043,4258,4259],{},[515,4260,1077],{},[1043,4262,4263],{},"Required",[1043,4265,4266],{},"The object to download. Could be an array of objects",[1024,4268,4269,4273,4277,4282],{},[1043,4270,4271],{"align":1029},[1912,4272,3738],{},[1043,4274,4275],{},[515,4276,3738],{},[1043,4278,4279],{},[515,4280,4281],{},"undefined",[1043,4283,4284],{},"Description below",[1185,4286,3738],{"id":3737},[1018,4288,4289,4301],{},[1021,4290,4291],{},[1024,4292,4293,4295,4297,4299],{},[1027,4294,1030],{"align":1029},[1027,4296,4243],{"align":1029},[1027,4298,1036],{"align":1029},[1027,4300,1033],{"align":1029},[1038,4302,4303,4322,4340,4358,4377,4396,4414],{},[1024,4304,4305,4310,4315,4319],{},[1043,4306,4307],{"align":1029},[1912,4308,4309],{},"trs",[1043,4311,4312],{"align":1029},[515,4313,4314],{},"bool",[1043,4316,4317],{"align":1029},[515,4318,1100],{},[1043,4320,4321],{"align":1029},"Export position, rotation and scale instead of matrix per node",[1024,4323,4324,4329,4333,4337],{},[1043,4325,4326],{"align":1029},[1912,4327,4328],{},"onlyVisible",[1043,4330,4331],{"align":1029},[515,4332,4314],{},[1043,4334,4335],{"align":1029},[515,4336,3754],{},[1043,4338,4339],{"align":1029},"Export only visible objects",[1024,4341,4342,4347,4351,4355],{},[1043,4343,4344],{"align":1029},[1912,4345,4346],{},"binary",[1043,4348,4349],{"align":1029},[515,4350,4314],{},[1043,4352,4353],{"align":1029},[515,4354,1100],{},[1043,4356,4357],{"align":1029},"Export in binary (.glb) format, returning an ArrayBuffer",[1024,4359,4360,4365,4369,4374],{},[1043,4361,4362],{"align":1029},[1912,4363,4364],{},"maxTextureSize",[1043,4366,4367],{"align":1029},[515,4368,2416],{},[1043,4370,4371],{"align":1029},[515,4372,4373],{},"Infinity",[1043,4375,4376],{"align":1029},"Restricts the image maximum size (both width and height) to the given value",[1024,4378,4379,4384,4389,4393],{},[1043,4380,4381],{"align":1029},[1912,4382,4383],{},"animations",[1043,4385,4386],{"align":1029},[515,4387,4388],{},"Array\u003CAnimationClip>",[1043,4390,4391],{"align":1029},[515,4392,4281],{},[1043,4394,4395],{"align":1029},"List of animations to be included in the export",[1024,4397,4398,4403,4407,4411],{},[1043,4399,4400],{"align":1029},[1912,4401,4402],{},"includeCustomExtensions",[1043,4404,4405],{"align":1029},[515,4406,4314],{},[1043,4408,4409],{"align":1029},[515,4410,1100],{},[1043,4412,4413],{"align":1029},"Export custom glTF extensions defined on an object's userData.gltfExtensions",[1024,4415,4416,4421,4425,4430],{},[1043,4417,4418],{"align":1029},[1912,4419,4420],{},"fileName",[1043,4422,4423],{"align":1029},[515,4424,2373],{},[1043,4426,4427],{"align":1029},[515,4428,4429],{},"Object name",[1043,4431,4432],{"align":1029},"Name of the generated file",[1198,4434,4435],{},"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 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 .sfNiH, html code.shiki .sfNiH{--shiki-light:#FF5370;--shiki-default:#FF9CAC;--shiki-dark:#FF9CAC}html pre.shiki code .sbssI, html code.shiki .sbssI{--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C}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);}",{"title":484,"searchDepth":485,"depth":486,"links":4437},[4438,4439],{"id":3798,"depth":486,"text":3799},{"id":4231,"depth":486,"text":4232,"children":4440},[4441],{"id":3737,"depth":560,"text":3738},"Export 3D objects to GLTF format.",{},{"title":463,"description":4442},"RMYlhgEenD2JjVSHoqXD_ilu6cdNNok5afbVcapEUPE",{"id":4447,"title":467,"body":4448,"description":4743,"extension":489,"links":490,"meta":4744,"navigation":492,"path":468,"seo":4745,"stem":469,"__hash__":4746},"docs/2.api/miscellaneous/use-intersect.md",{"type":473,"value":4449,"toc":4738},[4450,4469,4471,4487,4632,4634,4663,4667,4735],[476,4451,4452,4454,4455,4458,4459,4462,4463,4468],{},[515,4453,467],{}," is a function that returns ",[515,4456,4457],{},"intersect",", a ",[515,4460,4461],{},"Ref\u003Cboolean>"," that's updated when the observed object enters or leaves the screen. This relies on ",[1230,4464,4467],{"href":4465,"rel":4466},"https://threejs.org/docs/#api/en/core/Object3D.onBeforeRender",[1234],"THREE.Object3D.onBeforeRender"," so it only works on objects that are effectively rendered, like meshes, lines, sprites. It won't work on other types like group, object3d, bone, etc.",[553,4470,15],{"id":555},[2309,4472,4473],{},[476,4474,4475,4477,4478,4480,4481,4483,4484,739],{},[515,4476,467],{}," requires a ",[515,4479,805],{}," context, so it is only available in ",[515,4482,805],{}," descendant components' ",[515,4485,4486],{},"\u003Cscript setup>",[526,4488,4491],{"className":528,"code":4489,"highlights":4490,"language":530,"meta":484,"style":484},"\u003Cscript setup lang=\"ts\">\nimport { Torus, useIntersect } from '@tresjs/cientos'\n\nconst { ref, intersect, off } = useIntersect()\n\u003C/script>\n\n\u003Ctemplate>\n  \u003CTorus ref=\"ref\">\n    \u003CTresMeshNormalMaterial />\n  \u003C/Torus>\n\u003C/template>\n",[486,656],[515,4492,4493,4513,4538,4542,4569,4577,4581,4589,4608,4616,4624],{"__ignoreMap":484},[534,4494,4495,4497,4499,4501,4503,4505,4507,4509,4511],{"class":536,"line":485},[534,4496,540],{"class":539},[534,4498,576],{"class":543},[534,4500,579],{"class":547},[534,4502,582],{"class":547},[534,4504,585],{"class":539},[534,4506,588],{"class":539},[534,4508,592],{"class":591},[534,4510,588],{"class":539},[534,4512,597],{"class":539},[534,4514,4516,4518,4520,4523,4525,4528,4530,4532,4534,4536],{"class":4515,"line":486},[536,629],[534,4517,603],{"class":602},[534,4519,606],{"class":539},[534,4521,4522],{"class":609}," Torus",[534,4524,639],{"class":539},[534,4526,4527],{"class":609}," useIntersect",[534,4529,613],{"class":539},[534,4531,616],{"class":602},[534,4533,619],{"class":539},[534,4535,651],{"class":591},[534,4537,625],{"class":539},[534,4539,4540],{"class":536,"line":560},[534,4541,679],{"emptyLinePlaceholder":492},[534,4543,4545,4547,4549,4551,4553,4556,4558,4561,4563,4565,4567],{"class":4544,"line":656},[536,629],[534,4546,685],{"class":547},[534,4548,606],{"class":539},[534,4550,872],{"class":609},[534,4552,639],{"class":539},[534,4554,4555],{"class":609}," intersect",[534,4557,639],{"class":539},[534,4559,4560],{"class":609}," off ",[534,4562,2151],{"class":539},[534,4564,2769],{"class":539},[534,4566,4527],{"class":693},[534,4568,696],{"class":609},[534,4570,4571,4573,4575],{"class":536,"line":676},[534,4572,777],{"class":539},[534,4574,576],{"class":543},[534,4576,597],{"class":539},[534,4578,4579],{"class":536,"line":561},[534,4580,679],{"emptyLinePlaceholder":492},[534,4582,4583,4585,4587],{"class":536,"line":562},[534,4584,540],{"class":539},[534,4586,794],{"class":543},[534,4588,597],{"class":539},[534,4590,4591,4593,4595,4597,4599,4601,4604,4606],{"class":536,"line":713},[534,4592,802],{"class":539},[534,4594,273],{"class":543},[534,4596,872],{"class":547},[534,4598,585],{"class":539},[534,4600,588],{"class":539},[534,4602,4603],{"class":591},"ref",[534,4605,588],{"class":539},[534,4607,597],{"class":539},[534,4609,4610,4612,4614],{"class":536,"line":563},[534,4611,813],{"class":539},[534,4613,971],{"class":543},[534,4615,551],{"class":539},[534,4617,4618,4620,4622],{"class":536,"line":564},[534,4619,999],{"class":539},[534,4621,273],{"class":543},[534,4623,597],{"class":539},[534,4625,4626,4628,4630],{"class":536,"line":565},[534,4627,777],{"class":539},[534,4629,794],{"class":543},[534,4631,597],{"class":539},[553,4633,4232],{"id":4231},[1018,4635,4636,4646],{},[1021,4637,4638],{},[1024,4639,4640,4642,4644],{},[1027,4641,1030],{"align":1029},[1027,4643,1033],{},[1027,4645,4243],{},[1038,4647,4648],{},[1024,4649,4650,4655,4658],{},[1043,4651,4652],{"align":1029},[1912,4653,4654],{},"onChange",[1043,4656,4657],{},"Optional callback function triggered when the observed object enters or leaves the screen.",[1043,4659,4660],{},[515,4661,4662],{},"(isIntersected: boolean) => void",[553,4664,4666],{"id":4665},"return","Return",[1018,4668,4669,4679],{},[1021,4670,4671],{},[1024,4672,4673,4675,4677],{},[1027,4674,1030],{"align":1029},[1027,4676,1033],{},[1027,4678,4243],{},[1038,4680,4681,4699,4714],{},[1024,4682,4683,4687,4694],{},[1043,4684,4685],{"align":1029},[1912,4686,4603],{},[1043,4688,4689,4690,4693],{},"Vue ",[515,4691,4692],{},"ShallowRef"," to pass to the object to be observed.",[1043,4695,4696],{},[515,4697,4698],{},"ShallowRef\u003CObject3D>",[1024,4700,4701,4706,4709],{},[1043,4702,4703],{"align":1029},[1912,4704,4705],{},"intersects",[1043,4707,4708],{},"Updates when the observed object's intersect status changes.",[1043,4710,4711],{},[515,4712,4713],{},"ShallowRef\u003Cboolean>",[1024,4715,4716,4721,4730],{},[1043,4717,4718],{"align":1029},[1912,4719,4720],{},"off",[1043,4722,4723,4724,4726,4727,4729],{},"Calling this function stops ",[515,4725,467],{}," until ",[515,4728,4603],{}," changes.",[1043,4731,4732],{},[515,4733,4734],{},"() => void",[1198,4736,4737],{},"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);}",{"title":484,"searchDepth":485,"depth":486,"links":4739},[4740,4741,4742],{"id":555,"depth":486,"text":15},{"id":4231,"depth":486,"text":4232},{"id":4665,"depth":486,"text":4666},"Detect when objects enter or leave the screen.",{},{"title":467,"description":4743},"QAcMQnGWf_fxqwXEeZxQJtNfPCiyyVyBtXuwXAh1Cg4",1776202096544]