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