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