[{"data":1,"prerenderedAt":8328},["ShallowReactive",2],{"navigation":3,"/api/staging":466,"/api/staging-surround":487,"staging-list":492},[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":341,"body":468,"description":480,"extension":481,"links":482,"meta":483,"navigation":484,"path":342,"seo":485,"stem":343,"__hash__":486},"docs/2.api/8.staging/index.md",{"type":469,"value":470,"toc":475},"minimark",[471],[472,473],"api-list",{"list-name":474},"staging-list",{"title":476,"searchDepth":477,"depth":478,"links":479},"",1,2,[],"All staging components","md",null,{},true,{"title":341,"description":480},"ZLXQuPZOxy45BviCbDEqypJBlAujqs4p1lHt94YwoFM",[488,490],{"title":337,"path":338,"stem":339,"description":489,"children":-1},"Injects percent closer soft shadows (PCSS) into THREE's shader chunk.",{"title":347,"path":348,"stem":349,"description":491,"children":-1},"Automatically sets up a global cubemap for scene environment and background.",[493,1670,2261,2569,2940,3498,4561,4983,5397,7326,8033],{"id":494,"title":347,"body":495,"description":491,"extension":481,"links":482,"meta":1667,"navigation":484,"path":348,"seo":1668,"stem":349,"__hash__":1669},"docs/2.api/8.staging/1.environment.md",{"type":469,"value":496,"toc":1656},[497,503,516,523,527,810,817,843,849,853,864,1085,1089,1096,1121,1125,1128,1271,1276,1282,1388,1394,1407,1411,1641,1644,1652],[498,499,500],"scene-controls-wrapper",{},[501,502],"staging-environment",{},[504,505,506,507,511,512,515],"p",{},"Is a component abstraction that automatically sets up a global cubemap, which affects the default ",[508,509,510],"code",{},"scene.environment",", and optionally ",[508,513,514],{},"scene.background",".",[504,517,518,519,522],{},"It uses the composable ",[520,521,351],"a",{"href":352}," under the hood to load the cubemap.",[524,525,15],"h2",{"id":526},"usage",[528,529,533],"pre",{"className":530,"code":531,"language":532,"meta":476,"style":476},"language-vue shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003Cscript setup lang=\"ts\">\nimport { TresCanvas } from '@tresjs/core'\nimport { Environment } from '@tresjs/cientos'\n\u003C/script>\n\n\u003Ctemplate>\n  \u003CTresCanvas>\n    \u003CSuspense>\n      \u003CEnvironment\n        :files=\"[\n          '/px.jpg',\n          '/nx.jpg',\n          '/py.jpg',\n          '/ny.jpg',\n          '/pz.jpg',\n          '/nz.jpg',\n        ]\"\n      />\n    \u003C/Suspense>\n  \u003C/TresCanvas>\n\u003C/template>\n","vue",[508,534,535,569,597,618,628,634,644,655,666,675,691,706,718,730,742,754,766,775,781,791,801],{"__ignoreMap":476},[536,537,539,543,547,551,554,557,560,564,566],"span",{"class":538,"line":477},"line",[536,540,542],{"class":541},"sMK4o","\u003C",[536,544,546],{"class":545},"swJcz","script",[536,548,550],{"class":549},"spNyl"," setup",[536,552,553],{"class":549}," lang",[536,555,556],{"class":541},"=",[536,558,559],{"class":541},"\"",[536,561,563],{"class":562},"sfazB","ts",[536,565,559],{"class":541},[536,567,568],{"class":541},">\n",[536,570,571,575,578,582,585,588,591,594],{"class":538,"line":478},[536,572,574],{"class":573},"s7zQu","import",[536,576,577],{"class":541}," {",[536,579,581],{"class":580},"sTEyZ"," TresCanvas",[536,583,584],{"class":541}," }",[536,586,587],{"class":573}," from",[536,589,590],{"class":541}," '",[536,592,593],{"class":562},"@tresjs/core",[536,595,596],{"class":541},"'\n",[536,598,600,602,604,607,609,611,613,616],{"class":538,"line":599},3,[536,601,574],{"class":573},[536,603,577],{"class":541},[536,605,606],{"class":580}," Environment",[536,608,584],{"class":541},[536,610,587],{"class":573},[536,612,590],{"class":541},[536,614,615],{"class":562},"@tresjs/cientos",[536,617,596],{"class":541},[536,619,621,624,626],{"class":538,"line":620},4,[536,622,623],{"class":541},"\u003C/",[536,625,546],{"class":545},[536,627,568],{"class":541},[536,629,631],{"class":538,"line":630},5,[536,632,633],{"emptyLinePlaceholder":484},"\n",[536,635,637,639,642],{"class":538,"line":636},6,[536,638,542],{"class":541},[536,640,641],{"class":545},"template",[536,643,568],{"class":541},[536,645,647,650,653],{"class":538,"line":646},7,[536,648,649],{"class":541},"  \u003C",[536,651,652],{"class":545},"TresCanvas",[536,654,568],{"class":541},[536,656,658,661,664],{"class":538,"line":657},8,[536,659,660],{"class":541},"    \u003C",[536,662,663],{"class":545},"Suspense",[536,665,568],{"class":541},[536,667,669,672],{"class":538,"line":668},9,[536,670,671],{"class":541},"      \u003C",[536,673,674],{"class":545},"Environment\n",[536,676,678,681,684,686,688],{"class":538,"line":677},10,[536,679,680],{"class":541},"        :",[536,682,683],{"class":549},"files",[536,685,556],{"class":541},[536,687,559],{"class":541},[536,689,690],{"class":541},"[\n",[536,692,694,697,700,703],{"class":538,"line":693},11,[536,695,696],{"class":541},"          '",[536,698,699],{"class":562},"/px.jpg",[536,701,702],{"class":541},"'",[536,704,705],{"class":541},",\n",[536,707,709,711,714,716],{"class":538,"line":708},12,[536,710,696],{"class":541},[536,712,713],{"class":562},"/nx.jpg",[536,715,702],{"class":541},[536,717,705],{"class":541},[536,719,721,723,726,728],{"class":538,"line":720},13,[536,722,696],{"class":541},[536,724,725],{"class":562},"/py.jpg",[536,727,702],{"class":541},[536,729,705],{"class":541},[536,731,733,735,738,740],{"class":538,"line":732},14,[536,734,696],{"class":541},[536,736,737],{"class":562},"/ny.jpg",[536,739,702],{"class":541},[536,741,705],{"class":541},[536,743,745,747,750,752],{"class":538,"line":744},15,[536,746,696],{"class":541},[536,748,749],{"class":562},"/pz.jpg",[536,751,702],{"class":541},[536,753,705],{"class":541},[536,755,757,759,762,764],{"class":538,"line":756},16,[536,758,696],{"class":541},[536,760,761],{"class":562},"/nz.jpg",[536,763,702],{"class":541},[536,765,705],{"class":541},[536,767,769,772],{"class":538,"line":768},17,[536,770,771],{"class":541},"        ]",[536,773,774],{"class":541},"\"\n",[536,776,778],{"class":538,"line":777},18,[536,779,780],{"class":541},"      />\n",[536,782,784,787,789],{"class":538,"line":783},19,[536,785,786],{"class":541},"    \u003C/",[536,788,663],{"class":545},[536,790,568],{"class":541},[536,792,794,797,799],{"class":538,"line":793},20,[536,795,796],{"class":541},"  \u003C/",[536,798,652],{"class":545},[536,800,568],{"class":541},[536,802,804,806,808],{"class":538,"line":803},21,[536,805,623],{"class":541},[536,807,641],{"class":545},[536,809,568],{"class":541},[504,811,812,813,816],{},"You can also pass the ",[508,814,815],{},".hdr"," file directly:",[528,818,820],{"className":530,"code":819,"language":532,"meta":476,"style":476},"\u003CSuspense>\n   \u003CEnvironment files=\"/sunset.hdr\" />\n\u003C/Suspense>\n",[508,821,822,830,835],{"__ignoreMap":476},[536,823,824,826,828],{"class":538,"line":477},[536,825,542],{"class":541},[536,827,663],{"class":545},[536,829,568],{"class":541},[536,831,832],{"class":538,"line":478},[536,833,834],{"class":580},"   \u003CEnvironment files=\"/sunset.hdr\" />\n",[536,836,837,839,841],{"class":538,"line":599},[536,838,623],{"class":541},[536,840,663],{"class":545},[536,842,568],{"class":541},[504,844,845],{},[846,847],"img",{"alt":347,"src":848},"/cientos/envmaps.png",[524,850,852],{"id":851},"texture-reference","Texture reference",[504,854,855,856,859,860,863],{},"You can access the model reference by passing a ",[508,857,858],{},"ref"," to the ",[508,861,862],{},"\u003CEnvironment />"," prop",[528,865,868],{"className":530,"code":866,"highlights":867,"language":532,"meta":476,"style":476},"\u003Cscript setup lang=\"ts\">\nimport { Environment } from '@tresjs/cientos'\n\nconst environmentRef = shallowRef()\n\nwatch(environmentRef, texture => {\n  console.log(texture)\n})\n\u003C/script>\n\n\u003Ctemplate>\n  \u003CEnvironment ref=\"environmentRef\" />\n  \u003CTresMesh>\n    \u003CTresSphereGeometry />\n    \u003CTresMeshStandardMaterial :env-map=\"envMap\" />\n  \u003C/TresMesh>\n\u003C/template>\n",[620,636,668,732,768],[508,869,870,890,908,912,931,935,957,976,983,992,996,1004,1025,1034,1044,1068,1076],{"__ignoreMap":476},[536,871,872,874,876,878,880,882,884,886,888],{"class":538,"line":477},[536,873,542],{"class":541},[536,875,546],{"class":545},[536,877,550],{"class":549},[536,879,553],{"class":549},[536,881,556],{"class":541},[536,883,559],{"class":541},[536,885,563],{"class":562},[536,887,559],{"class":541},[536,889,568],{"class":541},[536,891,892,894,896,898,900,902,904,906],{"class":538,"line":478},[536,893,574],{"class":573},[536,895,577],{"class":541},[536,897,606],{"class":580},[536,899,584],{"class":541},[536,901,587],{"class":573},[536,903,590],{"class":541},[536,905,615],{"class":562},[536,907,596],{"class":541},[536,909,910],{"class":538,"line":599},[536,911,633],{"emptyLinePlaceholder":484},[536,913,916,919,922,924,928],{"class":914,"line":620},[538,915],"highlight",[536,917,918],{"class":549},"const",[536,920,921],{"class":580}," environmentRef ",[536,923,556],{"class":541},[536,925,927],{"class":926},"s2Zo4"," shallowRef",[536,929,930],{"class":580},"()\n",[536,932,933],{"class":538,"line":630},[536,934,633],{"emptyLinePlaceholder":484},[536,936,938,941,944,947,951,954],{"class":937,"line":636},[538,915],[536,939,940],{"class":926},"watch",[536,942,943],{"class":580},"(environmentRef",[536,945,946],{"class":541},",",[536,948,950],{"class":949},"sHdIc"," texture",[536,952,953],{"class":549}," =>",[536,955,956],{"class":541}," {\n",[536,958,959,962,964,967,970,973],{"class":538,"line":646},[536,960,961],{"class":580},"  console",[536,963,515],{"class":541},[536,965,966],{"class":926},"log",[536,968,969],{"class":545},"(",[536,971,972],{"class":580},"texture",[536,974,975],{"class":545},")\n",[536,977,978,981],{"class":538,"line":657},[536,979,980],{"class":541},"}",[536,982,975],{"class":580},[536,984,986,988,990],{"class":985,"line":668},[538,915],[536,987,623],{"class":541},[536,989,546],{"class":545},[536,991,568],{"class":541},[536,993,994],{"class":538,"line":677},[536,995,633],{"emptyLinePlaceholder":484},[536,997,998,1000,1002],{"class":538,"line":693},[536,999,542],{"class":541},[536,1001,641],{"class":545},[536,1003,568],{"class":541},[536,1005,1006,1008,1010,1013,1015,1017,1020,1022],{"class":538,"line":708},[536,1007,649],{"class":541},[536,1009,347],{"class":545},[536,1011,1012],{"class":549}," ref",[536,1014,556],{"class":541},[536,1016,559],{"class":541},[536,1018,1019],{"class":562},"environmentRef",[536,1021,559],{"class":541},[536,1023,1024],{"class":541}," />\n",[536,1026,1027,1029,1032],{"class":538,"line":720},[536,1028,649],{"class":541},[536,1030,1031],{"class":545},"TresMesh",[536,1033,568],{"class":541},[536,1035,1037,1039,1042],{"class":1036,"line":732},[538,915],[536,1038,660],{"class":541},[536,1040,1041],{"class":545},"TresSphereGeometry",[536,1043,1024],{"class":541},[536,1045,1046,1048,1051,1054,1057,1059,1061,1064,1066],{"class":538,"line":744},[536,1047,660],{"class":541},[536,1049,1050],{"class":545},"TresMeshStandardMaterial",[536,1052,1053],{"class":541}," :",[536,1055,1056],{"class":549},"env-map",[536,1058,556],{"class":541},[536,1060,559],{"class":541},[536,1062,1063],{"class":580},"envMap",[536,1065,559],{"class":541},[536,1067,1024],{"class":541},[536,1069,1070,1072,1074],{"class":538,"line":756},[536,1071,796],{"class":541},[536,1073,1031],{"class":545},[536,1075,568],{"class":541},[536,1077,1079,1081,1083],{"class":1078,"line":768},[538,915],[536,1080,623],{"class":541},[536,1082,641],{"class":545},[536,1084,568],{"class":541},[524,1086,1088],{"id":1087},"presets","Presets",[504,1090,1091,1092,1095],{},"You can use one of the available presets by passing the ",[508,1093,1094],{},"preset"," prop:",[528,1097,1099],{"className":530,"code":1098,"language":532,"meta":476,"style":476},"\u003CEnvironment preset=\"city\" />\n",[508,1100,1101],{"__ignoreMap":476},[536,1102,1103,1105,1107,1110,1112,1114,1117,1119],{"class":538,"line":477},[536,1104,542],{"class":541},[536,1106,347],{"class":545},[536,1108,1109],{"class":549}," preset",[536,1111,556],{"class":541},[536,1113,559],{"class":541},[536,1115,1116],{"class":562},"city",[536,1118,559],{"class":541},[536,1120,1024],{"class":541},[524,1122,1124],{"id":1123},"environment-rotation","Environment Rotation",[504,1126,1127],{},"The environment component supports both background and environment rotation. You can control them independently or sync them together:",[528,1129,1131],{"className":530,"code":1130,"language":532,"meta":476,"style":476},"\u003Ctemplate>\n  \u003CEnvironment\n    preset=\"sunset\"\n    :background=\"true\"\n    :background-rotation=\"[0, Math.PI / 2, 0]\"\n    :environment-rotation=\"[0, Math.PI / 4, 0]\"\n  />\n\u003C/template>\n",[508,1132,1133,1141,1147,1161,1179,1223,1258,1263],{"__ignoreMap":476},[536,1134,1135,1137,1139],{"class":538,"line":477},[536,1136,542],{"class":541},[536,1138,641],{"class":545},[536,1140,568],{"class":541},[536,1142,1143,1145],{"class":538,"line":478},[536,1144,649],{"class":541},[536,1146,674],{"class":545},[536,1148,1149,1152,1154,1156,1159],{"class":538,"line":599},[536,1150,1151],{"class":549},"    preset",[536,1153,556],{"class":541},[536,1155,559],{"class":541},[536,1157,1158],{"class":562},"sunset",[536,1160,774],{"class":541},[536,1162,1163,1166,1169,1171,1173,1177],{"class":538,"line":620},[536,1164,1165],{"class":541},"    :",[536,1167,1168],{"class":549},"background",[536,1170,556],{"class":541},[536,1172,559],{"class":541},[536,1174,1176],{"class":1175},"sfNiH","true",[536,1178,774],{"class":541},[536,1180,1181,1183,1186,1188,1190,1193,1197,1200,1203,1205,1208,1211,1214,1216,1218,1221],{"class":538,"line":630},[536,1182,1165],{"class":541},[536,1184,1185],{"class":549},"background-rotation",[536,1187,556],{"class":541},[536,1189,559],{"class":541},[536,1191,1192],{"class":541},"[",[536,1194,1196],{"class":1195},"sbssI","0",[536,1198,1199],{"class":541},", ",[536,1201,1202],{"class":580},"Math",[536,1204,515],{"class":541},[536,1206,1207],{"class":580},"PI",[536,1209,1210],{"class":541}," / ",[536,1212,1213],{"class":1195},"2",[536,1215,1199],{"class":541},[536,1217,1196],{"class":1195},[536,1219,1220],{"class":541},"]",[536,1222,774],{"class":541},[536,1224,1225,1227,1229,1231,1233,1235,1237,1239,1241,1243,1245,1247,1250,1252,1254,1256],{"class":538,"line":636},[536,1226,1165],{"class":541},[536,1228,1123],{"class":549},[536,1230,556],{"class":541},[536,1232,559],{"class":541},[536,1234,1192],{"class":541},[536,1236,1196],{"class":1195},[536,1238,1199],{"class":541},[536,1240,1202],{"class":580},[536,1242,515],{"class":541},[536,1244,1207],{"class":580},[536,1246,1210],{"class":541},[536,1248,1249],{"class":1195},"4",[536,1251,1199],{"class":541},[536,1253,1196],{"class":1195},[536,1255,1220],{"class":541},[536,1257,774],{"class":541},[536,1259,1260],{"class":538,"line":646},[536,1261,1262],{"class":541},"  />\n",[536,1264,1265,1267,1269],{"class":538,"line":657},[536,1266,623],{"class":541},[536,1268,641],{"class":545},[536,1270,568],{"class":541},[1272,1273,1275],"h3",{"id":1274},"syncing-rotations","Syncing Rotations",[504,1277,1278,1279,1095],{},"You can sync the environment rotation with the background rotation using the ",[508,1280,1281],{},"syncMaterials",[528,1283,1285],{"className":530,"code":1284,"language":532,"meta":476,"style":476},"\u003Ctemplate>\n  \u003CEnvironment\n    preset=\"sunset\"\n    :background=\"true\"\n    :sync-materials=\"true\"\n    :background-rotation=\"[0, Math.PI / 2, 0]\"\n  />\n\u003C/template>\n",[508,1286,1287,1295,1301,1313,1327,1342,1376,1380],{"__ignoreMap":476},[536,1288,1289,1291,1293],{"class":538,"line":477},[536,1290,542],{"class":541},[536,1292,641],{"class":545},[536,1294,568],{"class":541},[536,1296,1297,1299],{"class":538,"line":478},[536,1298,649],{"class":541},[536,1300,674],{"class":545},[536,1302,1303,1305,1307,1309,1311],{"class":538,"line":599},[536,1304,1151],{"class":549},[536,1306,556],{"class":541},[536,1308,559],{"class":541},[536,1310,1158],{"class":562},[536,1312,774],{"class":541},[536,1314,1315,1317,1319,1321,1323,1325],{"class":538,"line":620},[536,1316,1165],{"class":541},[536,1318,1168],{"class":549},[536,1320,556],{"class":541},[536,1322,559],{"class":541},[536,1324,1176],{"class":1175},[536,1326,774],{"class":541},[536,1328,1329,1331,1334,1336,1338,1340],{"class":538,"line":630},[536,1330,1165],{"class":541},[536,1332,1333],{"class":549},"sync-materials",[536,1335,556],{"class":541},[536,1337,559],{"class":541},[536,1339,1176],{"class":1175},[536,1341,774],{"class":541},[536,1343,1344,1346,1348,1350,1352,1354,1356,1358,1360,1362,1364,1366,1368,1370,1372,1374],{"class":538,"line":636},[536,1345,1165],{"class":541},[536,1347,1185],{"class":549},[536,1349,556],{"class":541},[536,1351,559],{"class":541},[536,1353,1192],{"class":541},[536,1355,1196],{"class":1195},[536,1357,1199],{"class":541},[536,1359,1202],{"class":580},[536,1361,515],{"class":541},[536,1363,1207],{"class":580},[536,1365,1210],{"class":541},[536,1367,1213],{"class":1195},[536,1369,1199],{"class":541},[536,1371,1196],{"class":1195},[536,1373,1220],{"class":541},[536,1375,774],{"class":541},[536,1377,1378],{"class":538,"line":646},[536,1379,1262],{"class":541},[536,1381,1382,1384,1386],{"class":538,"line":657},[536,1383,623],{"class":541},[536,1385,641],{"class":545},[536,1387,568],{"class":541},[504,1389,1390,1391,1393],{},"When ",[508,1392,1281],{}," is enabled:",[1395,1396,1397,1401,1404],"ul",{},[1398,1399,1400],"li",{},"The environment rotation will automatically match the background rotation",[1398,1402,1403],{},"All materials in the scene will update to reflect the new rotation",[1398,1405,1406],{},"This ensures visual consistency between the background and environment reflections",[524,1408,1410],{"id":1409},"props","Props",[1412,1413,1414,1431],"table",{},[1415,1416,1417],"thead",{},[1418,1419,1420,1425,1428],"tr",{},[1421,1422,1424],"th",{"align":1423},"left","Prop",[1421,1426,1427],{"align":1423},"Description",[1421,1429,1430],{},"Default",[1432,1433,1434,1449,1463,1483,1500,1512,1525,1538,1551,1564,1577,1589,1601,1616,1630],"tbody",{},[1418,1435,1436,1441,1444],{},[1437,1438,1439],"td",{"align":1423},[508,1440,683],{},[1437,1442,1443],{"align":1423},"Array of 6 urls to images, one for each side of the CubeTexture, or an HDR file",[1437,1445,1446],{},[508,1447,1448],{},"undefined",[1418,1450,1451,1456,1459],{},[1437,1452,1453],{"align":1423},[508,1454,1455],{},"path",[1437,1457,1458],{"align":1423},"Path to the environment map files",[1437,1460,1461],{},[508,1462,1448],{},[1418,1464,1465,1470,1473],{},[1437,1466,1467],{"align":1423},[508,1468,1469],{},"encoding",[1437,1471,1472],{"align":1423},"Encoding of the environment map",[1437,1474,1475,1478,1479,1482],{},[508,1476,1477],{},"SRGBColorSpace"," for array files, ",[508,1480,1481],{},"LinearEncoding"," for single texture",[1418,1484,1485,1489,1495],{},[1437,1486,1487],{"align":1423},[508,1488,1168],{},[1437,1490,1491,1492,1494],{"align":1423},"If ",[508,1493,1176],{},", the environment map will be used as the scene background",[1437,1496,1497],{},[508,1498,1499],{},"false",[1418,1501,1502,1507,1510],{},[1437,1503,1504],{"align":1423},[508,1505,1506],{},"blur",[1437,1508,1509],{"align":1423},"Blur factor between 0 and 1 (only works with three 0.146 and up)",[1437,1511,1196],{},[1418,1513,1514,1518,1521],{},[1437,1515,1516],{"align":1423},[508,1517,1094],{},[1437,1519,1520],{"align":1423},"Preset environment map",[1437,1522,1523],{},[508,1524,1448],{},[1418,1526,1527,1532,1535],{},[1437,1528,1529],{"align":1423},[508,1530,1531],{},"resolution",[1437,1533,1534],{"align":1423},"The resolution of the WebGLCubeRenderTarget",[1437,1536,1537],{},"256",[1418,1539,1540,1545,1548],{},[1437,1541,1542],{"align":1423},[508,1543,1544],{},"near",[1437,1546,1547],{"align":1423},"The near of the CubeCamera",[1437,1549,1550],{},"1",[1418,1552,1553,1558,1561],{},[1437,1554,1555],{"align":1423},[508,1556,1557],{},"far",[1437,1559,1560],{"align":1423},"The far of the CubeCamera",[1437,1562,1563],{},"1000",[1418,1565,1566,1571,1574],{},[1437,1567,1568],{"align":1423},[508,1569,1570],{},"frames",[1437,1572,1573],{"align":1423},"The frames of the cubeCamera.update",[1437,1575,1576],{},"Infinity",[1418,1578,1579,1584,1587],{},[1437,1580,1581],{"align":1423},[508,1582,1583],{},"backgroundIntensity",[1437,1585,1586],{"align":1423},"Intensity of the background",[1437,1588,1550],{},[1418,1590,1591,1596,1599],{},[1437,1592,1593],{"align":1423},[508,1594,1595],{},"environmentIntensity",[1437,1597,1598],{"align":1423},"Intensity of the environment",[1437,1600,1550],{},[1418,1602,1603,1608,1611],{},[1437,1604,1605],{"align":1423},[508,1606,1607],{},"backgroundRotation",[1437,1609,1610],{"align":1423},"Rotation of the background (in radians)",[1437,1612,1613],{},[536,1614,1615],{},"0, 0, 0",[1418,1617,1618,1623,1626],{},[1437,1619,1620],{"align":1423},[508,1621,1622],{},"environmentRotation",[1437,1624,1625],{"align":1423},"Rotation of the environment (in radians)",[1437,1627,1628],{},[536,1629,1615],{},[1418,1631,1632,1636,1639],{},[1437,1633,1634],{"align":1423},[508,1635,1281],{},[1437,1637,1638],{"align":1423},"If true, environment rotation will sync with background rotation",[1437,1640,1499],{},[1272,1642,1088],{"id":1643},"presets-1",[528,1645,1650],{"className":1646,"code":1648,"language":1649},[1647],"language-text","sunset\nstudio\ncity\numbrellas\nnight\nforest\nsnow\ndawn\nhangar\nurban\nmodern\nshangai\n","text",[508,1651,1648],{"__ignoreMap":476},[1653,1654,1655],"style",{},"html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html pre.shiki code .s7zQu, html code.shiki .s7zQu{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html .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 .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 .sfNiH, html code.shiki .sfNiH{--shiki-light:#FF5370;--shiki-default:#FF9CAC;--shiki-dark:#FF9CAC}html pre.shiki code .sbssI, html code.shiki .sbssI{--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C}",{"title":476,"searchDepth":477,"depth":478,"links":1657},[1658,1659,1660,1661,1664],{"id":526,"depth":478,"text":15},{"id":851,"depth":478,"text":852},{"id":1087,"depth":478,"text":1088},{"id":1123,"depth":478,"text":1124,"children":1662},[1663],{"id":1274,"depth":599,"text":1275},{"id":1409,"depth":478,"text":1410,"children":1665},[1666],{"id":1643,"depth":599,"text":1088},{},{"title":347,"description":491},"dqLZk4n0fsNI6BVPDBhIxhgyNLq36JyLYtIkuxeINv0",{"id":1671,"title":351,"body":1672,"description":2257,"extension":481,"links":482,"meta":2258,"navigation":484,"path":352,"seo":2259,"stem":353,"__hash__":2260},"docs/2.api/8.staging/2.use-environment.md",{"type":469,"value":1673,"toc":2253},[1674,1679,1688,1698,1700,1706,1915,1921,1954,1959,2044,2048,2250],[1675,1676,1677],"scene-wrapper",{},[501,1678],{},[504,1680,1681,1683,1684,511,1686,515],{},[508,1682,351],{}," composable that automatically sets up a global cubemap, which affects the default ",[508,1685,510],{},[508,1687,514],{},[504,1689,1690,1691,1697],{},"It uses the ",[520,1692,1696],{"href":1693,"rel":1694},"https://threejs.org/docs/#api/en/loaders/CubeTextureLoader",[1695],"nofollow","CubeTextureLoader"," to load the cubemap",[524,1699,15],{"id":526},[1701,1702,1703],"prose-warning",{},[504,1704,1705],{},"UseEnvironment needs to be wrapped by a Suspense component",[528,1707,1709],{"className":530,"code":1708,"language":532,"meta":476,"style":476},"\u003Cscript setup lang=\"ts\">\nimport { useEnvironment } from '@tresjs/cientos'\nimport { SRGBColorSpace } from 'three'\n\nconst texture = await useEnvironment({\n  files: [\n    '/textures/environmentMaps/0/px.jpg',\n    '/textures/environmentMaps/0/nx.jpg',\n    '/textures/environmentMaps/0/py.jpg',\n    '/textures/environmentMaps/0/ny.jpg',\n    '/textures/environmentMaps/0/pz.jpg',\n    '/textures/environmentMaps/0/nz.jpg',\n  ],\n  path: '',\n  encoding: SRGBColorSpace,\n})\n\u003C/script>\n",[508,1710,1711,1731,1750,1770,1774,1793,1804,1816,1827,1838,1849,1860,1871,1878,1890,1901,1907],{"__ignoreMap":476},[536,1712,1713,1715,1717,1719,1721,1723,1725,1727,1729],{"class":538,"line":477},[536,1714,542],{"class":541},[536,1716,546],{"class":545},[536,1718,550],{"class":549},[536,1720,553],{"class":549},[536,1722,556],{"class":541},[536,1724,559],{"class":541},[536,1726,563],{"class":562},[536,1728,559],{"class":541},[536,1730,568],{"class":541},[536,1732,1733,1735,1737,1740,1742,1744,1746,1748],{"class":538,"line":478},[536,1734,574],{"class":573},[536,1736,577],{"class":541},[536,1738,1739],{"class":580}," useEnvironment",[536,1741,584],{"class":541},[536,1743,587],{"class":573},[536,1745,590],{"class":541},[536,1747,615],{"class":562},[536,1749,596],{"class":541},[536,1751,1752,1754,1756,1759,1761,1763,1765,1768],{"class":538,"line":599},[536,1753,574],{"class":573},[536,1755,577],{"class":541},[536,1757,1758],{"class":580}," SRGBColorSpace",[536,1760,584],{"class":541},[536,1762,587],{"class":573},[536,1764,590],{"class":541},[536,1766,1767],{"class":562},"three",[536,1769,596],{"class":541},[536,1771,1772],{"class":538,"line":620},[536,1773,633],{"emptyLinePlaceholder":484},[536,1775,1776,1778,1781,1783,1786,1788,1790],{"class":538,"line":630},[536,1777,918],{"class":549},[536,1779,1780],{"class":580}," texture ",[536,1782,556],{"class":541},[536,1784,1785],{"class":573}," await",[536,1787,1739],{"class":926},[536,1789,969],{"class":580},[536,1791,1792],{"class":541},"{\n",[536,1794,1795,1798,1801],{"class":538,"line":636},[536,1796,1797],{"class":545},"  files",[536,1799,1800],{"class":541},":",[536,1802,1803],{"class":580}," [\n",[536,1805,1806,1809,1812,1814],{"class":538,"line":646},[536,1807,1808],{"class":541},"    '",[536,1810,1811],{"class":562},"/textures/environmentMaps/0/px.jpg",[536,1813,702],{"class":541},[536,1815,705],{"class":541},[536,1817,1818,1820,1823,1825],{"class":538,"line":657},[536,1819,1808],{"class":541},[536,1821,1822],{"class":562},"/textures/environmentMaps/0/nx.jpg",[536,1824,702],{"class":541},[536,1826,705],{"class":541},[536,1828,1829,1831,1834,1836],{"class":538,"line":668},[536,1830,1808],{"class":541},[536,1832,1833],{"class":562},"/textures/environmentMaps/0/py.jpg",[536,1835,702],{"class":541},[536,1837,705],{"class":541},[536,1839,1840,1842,1845,1847],{"class":538,"line":677},[536,1841,1808],{"class":541},[536,1843,1844],{"class":562},"/textures/environmentMaps/0/ny.jpg",[536,1846,702],{"class":541},[536,1848,705],{"class":541},[536,1850,1851,1853,1856,1858],{"class":538,"line":693},[536,1852,1808],{"class":541},[536,1854,1855],{"class":562},"/textures/environmentMaps/0/pz.jpg",[536,1857,702],{"class":541},[536,1859,705],{"class":541},[536,1861,1862,1864,1867,1869],{"class":538,"line":708},[536,1863,1808],{"class":541},[536,1865,1866],{"class":562},"/textures/environmentMaps/0/nz.jpg",[536,1868,702],{"class":541},[536,1870,705],{"class":541},[536,1872,1873,1876],{"class":538,"line":720},[536,1874,1875],{"class":580},"  ]",[536,1877,705],{"class":541},[536,1879,1880,1883,1885,1888],{"class":538,"line":732},[536,1881,1882],{"class":545},"  path",[536,1884,1800],{"class":541},[536,1886,1887],{"class":541}," ''",[536,1889,705],{"class":541},[536,1891,1892,1895,1897,1899],{"class":538,"line":744},[536,1893,1894],{"class":545},"  encoding",[536,1896,1800],{"class":541},[536,1898,1758],{"class":580},[536,1900,705],{"class":541},[536,1902,1903,1905],{"class":538,"line":756},[536,1904,980],{"class":541},[536,1906,975],{"class":580},[536,1908,1909,1911,1913],{"class":538,"line":768},[536,1910,623],{"class":541},[536,1912,546],{"class":545},[536,1914,568],{"class":541},[504,1916,1917,1918,1920],{},"Then you can use the ",[508,1919,972],{}," in your scene:",[528,1922,1925],{"className":530,"code":1923,"highlights":1924,"language":532,"meta":476,"style":476},"\u003CTresMesh>\n  \u003CTresSphereGeometry />\n  \u003CTresMeshStandardMaterial :map=\"texture\" />\n\u003C/TresMesh>\n",[599],[508,1926,1927,1935,1940,1946],{"__ignoreMap":476},[536,1928,1929,1931,1933],{"class":538,"line":477},[536,1930,542],{"class":541},[536,1932,1031],{"class":545},[536,1934,568],{"class":541},[536,1936,1937],{"class":538,"line":478},[536,1938,1939],{"class":580},"  \u003CTresSphereGeometry />\n",[536,1941,1943],{"class":1942,"line":599},[538,915],[536,1944,1945],{"class":580},"  \u003CTresMeshStandardMaterial :map=\"texture\" />\n",[536,1947,1948,1950,1952],{"class":538,"line":620},[536,1949,623],{"class":541},[536,1951,1031],{"class":545},[536,1953,568],{"class":541},[504,1955,812,1956,1958],{},[508,1957,815],{}," file directly",[528,1960,1963],{"className":1961,"code":1962,"language":563,"meta":476,"style":476},"language-ts shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","import { useEnvironment } from '@tresjs/cientos'\n\nconst texture = await useEnvironment({\n  files: '/sunset.hdr',\n  path: '',\n  encoding: SRGBColorSpace,\n})\n",[508,1964,1965,1983,1987,2003,2018,2028,2038],{"__ignoreMap":476},[536,1966,1967,1969,1971,1973,1975,1977,1979,1981],{"class":538,"line":477},[536,1968,574],{"class":573},[536,1970,577],{"class":541},[536,1972,1739],{"class":580},[536,1974,584],{"class":541},[536,1976,587],{"class":573},[536,1978,590],{"class":541},[536,1980,615],{"class":562},[536,1982,596],{"class":541},[536,1984,1985],{"class":538,"line":478},[536,1986,633],{"emptyLinePlaceholder":484},[536,1988,1989,1991,1993,1995,1997,1999,2001],{"class":538,"line":599},[536,1990,918],{"class":549},[536,1992,1780],{"class":580},[536,1994,556],{"class":541},[536,1996,1785],{"class":573},[536,1998,1739],{"class":926},[536,2000,969],{"class":580},[536,2002,1792],{"class":541},[536,2004,2005,2007,2009,2011,2014,2016],{"class":538,"line":620},[536,2006,1797],{"class":545},[536,2008,1800],{"class":541},[536,2010,590],{"class":541},[536,2012,2013],{"class":562},"/sunset.hdr",[536,2015,702],{"class":541},[536,2017,705],{"class":541},[536,2019,2020,2022,2024,2026],{"class":538,"line":630},[536,2021,1882],{"class":545},[536,2023,1800],{"class":541},[536,2025,1887],{"class":541},[536,2027,705],{"class":541},[536,2029,2030,2032,2034,2036],{"class":538,"line":636},[536,2031,1894],{"class":545},[536,2033,1800],{"class":541},[536,2035,1758],{"class":580},[536,2037,705],{"class":541},[536,2039,2040,2042],{"class":538,"line":646},[536,2041,980],{"class":541},[536,2043,975],{"class":580},[524,2045,2047],{"id":2046},"options","Options",[1412,2049,2050,2064],{},[1415,2051,2052],{},[1418,2053,2054,2057,2060,2062],{},[1421,2055,2056],{"align":1423},"Name",[1421,2058,2059],{},"Type",[1421,2061,1430],{},[1421,2063,1427],{},[1432,2065,2066,2085,2103,2125,2144,2162,2180,2197,2214,2233],{},[1418,2067,2068,2073,2078,2082],{},[1437,2069,2070],{"align":1423},[2071,2072,683],"strong",{},[1437,2074,2075],{},[508,2076,2077],{},"Array",[1437,2079,2080],{},[508,2081,1448],{},[1437,2083,2084],{},"Array of 6 urls to images, one for each side of the CubeTexture. or and HDR",[1418,2086,2087,2091,2096,2100],{},[1437,2088,2089],{"align":1423},[2071,2090,1455],{},[1437,2092,2093],{},[508,2094,2095],{},"boolean",[1437,2097,2098],{},[508,2099,1499],{},[1437,2101,2102],{},"Path to the environment map files.",[1418,2104,2105,2109,2114,2122],{},[1437,2106,2107],{"align":1423},[2071,2108,1469],{},[1437,2110,2111],{},[508,2112,2113],{},"Encoding",[1437,2115,2116,2118,2119,2121],{},[508,2117,1477],{}," for an array of files and ",[508,2120,1481],{}," for a single texture",[1437,2123,2124],{},"Encoding of the environment map.",[1418,2126,2127,2131,2135,2139],{},[1437,2128,2129],{"align":1423},[2071,2130,1168],{},[1437,2132,2133],{},[508,2134,2095],{},[1437,2136,2137],{},[508,2138,1499],{},[1437,2140,1491,2141,2143],{},[508,2142,1176],{}," the texture will be used as the scene background.",[1418,2145,2146,2150,2155,2159],{},[1437,2147,2148],{"align":1423},[2071,2149,1506],{},[1437,2151,2152],{},[508,2153,2154],{},"number",[1437,2156,2157],{},[508,2158,1196],{},[1437,2160,2161],{},"Blur factor between 0 and 1. (only works with three 0.146 and up)",[1418,2163,2164,2168,2173,2177],{},[1437,2165,2166],{"align":1423},[2071,2167,1094],{},[1437,2169,2170],{},[508,2171,2172],{},"string",[1437,2174,2175],{},[508,2176,1448],{},[1437,2178,2179],{},"Preset environment map.",[1418,2181,2182,2186,2190,2194],{},[1437,2183,2184],{"align":1423},[2071,2185,1583],{},[1437,2187,2188],{},[508,2189,2154],{},[1437,2191,2192],{},[508,2193,1550],{},[1437,2195,2196],{},"Intensity of the background.",[1418,2198,2199,2203,2207,2211],{},[1437,2200,2201],{"align":1423},[2071,2202,1595],{},[1437,2204,2205],{},[508,2206,2154],{},[1437,2208,2209],{},[508,2210,1550],{},[1437,2212,2213],{},"Intensity of the environment.",[1418,2215,2216,2220,2225,2230],{},[1437,2217,2218],{"align":1423},[2071,2219,1607],{},[1437,2221,2222],{},[508,2223,2224],{},"VectorFlexibleParams",[1437,2226,2227],{},[508,2228,2229],{},"[0, 0, 0]",[1437,2231,2232],{},"Rotation of the background.",[1418,2234,2235,2239,2243,2247],{},[1437,2236,2237],{"align":1423},[2071,2238,1622],{},[1437,2240,2241],{},[508,2242,2224],{},[1437,2244,2245],{},[508,2246,2229],{},[1437,2248,2249],{},"Rotation of the environment.",[1653,2251,2252],{},"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":476,"searchDepth":477,"depth":478,"links":2254},[2255,2256],{"id":526,"depth":478,"text":15},{"id":2046,"depth":478,"text":2047},"Composable that sets up a global cubemap for scene environment and background.",{},{"title":351,"description":2257},"6daKH-E6ICNjAkrFUlcQXUgujIBuYCGJ6Xewfx615-c",{"id":2262,"title":355,"body":2263,"description":2565,"extension":481,"links":482,"meta":2566,"navigation":484,"path":356,"seo":2567,"stem":357,"__hash__":2568},"docs/2.api/8.staging/3.lightformer.md",{"type":469,"value":2264,"toc":2562},[2265,2270,2276,2479,2481,2484,2559],[498,2266,2267],{},[2268,2269],"staging-lightformer",{},[504,2271,2272,2273,2275],{},"You can incorporate ",[508,2274,355],{}," into the environment just like a slot.",[528,2277,2279],{"className":530,"code":2278,"language":532,"meta":476,"style":476},"\u003Cscript setup>\nimport { Enviroment, LightFormer } from '@tres/cientos'\n\u003C/script>\n\n\u003Ctemplate>\n  \u003CEnvironment>\n    \u003CLightformer :intensity=\"0.75\" :position=\"[0, 5, -9]\" />\n    \u003CLightformer from=\"ring\" :rotation-y=\"-Math.PI / 2\" :scale=\"[10, 10, 1]\" />\n  \u003C/Environment>\n\u003C/template>\n",[508,2280,2281,2291,2316,2324,2328,2336,2344,2394,2463,2471],{"__ignoreMap":476},[536,2282,2283,2285,2287,2289],{"class":538,"line":477},[536,2284,542],{"class":541},[536,2286,546],{"class":545},[536,2288,550],{"class":549},[536,2290,568],{"class":541},[536,2292,2293,2295,2297,2300,2302,2305,2307,2309,2311,2314],{"class":538,"line":478},[536,2294,574],{"class":573},[536,2296,577],{"class":541},[536,2298,2299],{"class":580}," Enviroment",[536,2301,946],{"class":541},[536,2303,2304],{"class":580}," LightFormer",[536,2306,584],{"class":541},[536,2308,587],{"class":573},[536,2310,590],{"class":541},[536,2312,2313],{"class":562},"@tres/cientos",[536,2315,596],{"class":541},[536,2317,2318,2320,2322],{"class":538,"line":599},[536,2319,623],{"class":541},[536,2321,546],{"class":545},[536,2323,568],{"class":541},[536,2325,2326],{"class":538,"line":620},[536,2327,633],{"emptyLinePlaceholder":484},[536,2329,2330,2332,2334],{"class":538,"line":630},[536,2331,542],{"class":541},[536,2333,641],{"class":545},[536,2335,568],{"class":541},[536,2337,2338,2340,2342],{"class":538,"line":636},[536,2339,649],{"class":541},[536,2341,347],{"class":545},[536,2343,568],{"class":541},[536,2345,2346,2348,2350,2352,2355,2357,2359,2362,2364,2366,2369,2371,2373,2375,2377,2379,2382,2385,2388,2390,2392],{"class":538,"line":646},[536,2347,660],{"class":541},[536,2349,355],{"class":545},[536,2351,1053],{"class":541},[536,2353,2354],{"class":549},"intensity",[536,2356,556],{"class":541},[536,2358,559],{"class":541},[536,2360,2361],{"class":1195},"0.75",[536,2363,559],{"class":541},[536,2365,1053],{"class":541},[536,2367,2368],{"class":549},"position",[536,2370,556],{"class":541},[536,2372,559],{"class":541},[536,2374,1192],{"class":541},[536,2376,1196],{"class":1195},[536,2378,1199],{"class":541},[536,2380,2381],{"class":1195},"5",[536,2383,2384],{"class":541},", -",[536,2386,2387],{"class":1195},"9",[536,2389,1220],{"class":541},[536,2391,559],{"class":541},[536,2393,1024],{"class":541},[536,2395,2396,2398,2400,2402,2404,2406,2409,2411,2413,2416,2418,2420,2423,2425,2427,2429,2431,2433,2435,2437,2440,2442,2444,2446,2449,2451,2453,2455,2457,2459,2461],{"class":538,"line":657},[536,2397,660],{"class":541},[536,2399,355],{"class":545},[536,2401,587],{"class":549},[536,2403,556],{"class":541},[536,2405,559],{"class":541},[536,2407,2408],{"class":562},"ring",[536,2410,559],{"class":541},[536,2412,1053],{"class":541},[536,2414,2415],{"class":549},"rotation-y",[536,2417,556],{"class":541},[536,2419,559],{"class":541},[536,2421,2422],{"class":541},"-",[536,2424,1202],{"class":580},[536,2426,515],{"class":541},[536,2428,1207],{"class":580},[536,2430,1210],{"class":541},[536,2432,1213],{"class":1195},[536,2434,559],{"class":541},[536,2436,1053],{"class":541},[536,2438,2439],{"class":549},"scale",[536,2441,556],{"class":541},[536,2443,559],{"class":541},[536,2445,1192],{"class":541},[536,2447,2448],{"class":1195},"10",[536,2450,1199],{"class":541},[536,2452,2448],{"class":1195},[536,2454,1199],{"class":541},[536,2456,1550],{"class":1195},[536,2458,1220],{"class":541},[536,2460,559],{"class":541},[536,2462,1024],{"class":541},[536,2464,2465,2467,2469],{"class":538,"line":668},[536,2466,796],{"class":541},[536,2468,347],{"class":545},[536,2470,568],{"class":541},[536,2472,2473,2475,2477],{"class":538,"line":677},[536,2474,623],{"class":541},[536,2476,641],{"class":545},[536,2478,568],{"class":541},[1272,2480,1410],{"id":1409},[504,2482,2483],{},"Lightformer inherits from mesh, and its extension parameters include:",[1412,2485,2486,2496],{},[1415,2487,2488],{},[1418,2489,2490,2492,2494],{},[1421,2491,1424],{"align":1423},[1421,2493,1427],{"align":1423},[1421,2495,1430],{},[1432,2497,2498,2520,2531,2546],{},[1418,2499,2500,2505,2516],{},[1437,2501,2502],{"align":1423},[508,2503,2504],{},"from",[1437,2506,2507,1199,2510,1199,2512,2515],{"align":1423},[508,2508,2509],{},"circle",[508,2511,2408],{},[508,2513,2514],{},"rect",", or any other Mesh type",[1437,2517,2518],{},[508,2519,2514],{},[1418,2521,2522,2526,2529],{},[1437,2523,2524],{"align":1423},[508,2525,2354],{},[1437,2527,2528],{"align":1423},"The intensity of the light",[1437,2530,1550],{},[1418,2532,2533,2538,2541],{},[1437,2534,2535],{"align":1423},[508,2536,2537],{},"color",[1437,2539,2540],{"align":1423},"The color of the light",[1437,2542,2543],{},[508,2544,2545],{},"0xffffff",[1418,2547,2548,2553,2556],{},[1437,2549,2550],{"align":1423},[508,2551,2552],{},"args",[1437,2554,2555],{"align":1423},"The arguments of the Geometry",[1437,2557,2558],{},"When using other geometries, set the corresponding arguments",[1653,2560,2561],{},"html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}html pre.shiki code .s7zQu, html code.shiki .s7zQu{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html pre.shiki code .sbssI, html code.shiki .sbssI{--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}",{"title":476,"searchDepth":477,"depth":478,"links":2563},[2564],{"id":1409,"depth":599,"text":1410},"Addon for environment component that provided you custom lights.",{},{"title":355,"description":2565},"R8P0Oy_2dpWPhe7Wm4S1_IYaBdzzvZXUtE1_rjpxx6o",{"id":2570,"title":359,"body":2571,"description":2936,"extension":481,"links":482,"meta":2937,"navigation":484,"path":360,"seo":2938,"stem":361,"__hash__":2939},"docs/2.api/8.staging/backdrop.md",{"type":469,"value":2572,"toc":2932},[2573,2578,2589,2591,2784,2787,2869,2871,2929],[498,2574,2575],{},[2576,2577],"staging-backdrop",{},[504,2579,2580,2581,2584,2585,2588],{},"The ",[508,2582,2583],{},"cientos"," package provides a ",[508,2586,2587],{},"\u003CBackdrop />"," component. It's just a curved plane, like a studio backdrop. Meant is for presentational purposes, to break up light and shadows more interestingly.",[524,2590,15],{"id":526},[528,2592,2595],{"className":530,"code":2593,"highlights":2594,"language":532,"meta":476,"style":476},"\u003Cscript setup lang=\"ts\">\nimport { TresCanvas } from '@tresjs/core'\nimport { Backdrop } from '@tresjs/cientos'\n\u003C/script>\n\n\u003Ctemplate>\n  \u003CTresCanvas>\n    \u003CTresPerspectiveCamera :position=\"[0, 3, 5]\" />\n    \u003CBackdrop />\n    \u003CTresAmbientLight />\n    \u003CTresDirectionalLight :position=\"[0, 2, 4]\" />\n  \u003C/TresCanvas>\n\u003C/template>\n",[599,668],[508,2596,2597,2617,2635,2655,2663,2667,2675,2683,2717,2726,2735,2768,2776],{"__ignoreMap":476},[536,2598,2599,2601,2603,2605,2607,2609,2611,2613,2615],{"class":538,"line":477},[536,2600,542],{"class":541},[536,2602,546],{"class":545},[536,2604,550],{"class":549},[536,2606,553],{"class":549},[536,2608,556],{"class":541},[536,2610,559],{"class":541},[536,2612,563],{"class":562},[536,2614,559],{"class":541},[536,2616,568],{"class":541},[536,2618,2619,2621,2623,2625,2627,2629,2631,2633],{"class":538,"line":478},[536,2620,574],{"class":573},[536,2622,577],{"class":541},[536,2624,581],{"class":580},[536,2626,584],{"class":541},[536,2628,587],{"class":573},[536,2630,590],{"class":541},[536,2632,593],{"class":562},[536,2634,596],{"class":541},[536,2636,2638,2640,2642,2645,2647,2649,2651,2653],{"class":2637,"line":599},[538,915],[536,2639,574],{"class":573},[536,2641,577],{"class":541},[536,2643,2644],{"class":580}," Backdrop",[536,2646,584],{"class":541},[536,2648,587],{"class":573},[536,2650,590],{"class":541},[536,2652,615],{"class":562},[536,2654,596],{"class":541},[536,2656,2657,2659,2661],{"class":538,"line":620},[536,2658,623],{"class":541},[536,2660,546],{"class":545},[536,2662,568],{"class":541},[536,2664,2665],{"class":538,"line":630},[536,2666,633],{"emptyLinePlaceholder":484},[536,2668,2669,2671,2673],{"class":538,"line":636},[536,2670,542],{"class":541},[536,2672,641],{"class":545},[536,2674,568],{"class":541},[536,2676,2677,2679,2681],{"class":538,"line":646},[536,2678,649],{"class":541},[536,2680,652],{"class":545},[536,2682,568],{"class":541},[536,2684,2685,2687,2690,2692,2694,2696,2698,2700,2702,2704,2707,2709,2711,2713,2715],{"class":538,"line":657},[536,2686,660],{"class":541},[536,2688,2689],{"class":545},"TresPerspectiveCamera",[536,2691,1053],{"class":541},[536,2693,2368],{"class":549},[536,2695,556],{"class":541},[536,2697,559],{"class":541},[536,2699,1192],{"class":541},[536,2701,1196],{"class":1195},[536,2703,1199],{"class":541},[536,2705,2706],{"class":1195},"3",[536,2708,1199],{"class":541},[536,2710,2381],{"class":1195},[536,2712,1220],{"class":541},[536,2714,559],{"class":541},[536,2716,1024],{"class":541},[536,2718,2720,2722,2724],{"class":2719,"line":668},[538,915],[536,2721,660],{"class":541},[536,2723,359],{"class":545},[536,2725,1024],{"class":541},[536,2727,2728,2730,2733],{"class":538,"line":677},[536,2729,660],{"class":541},[536,2731,2732],{"class":545},"TresAmbientLight",[536,2734,1024],{"class":541},[536,2736,2737,2739,2742,2744,2746,2748,2750,2752,2754,2756,2758,2760,2762,2764,2766],{"class":538,"line":693},[536,2738,660],{"class":541},[536,2740,2741],{"class":545},"TresDirectionalLight",[536,2743,1053],{"class":541},[536,2745,2368],{"class":549},[536,2747,556],{"class":541},[536,2749,559],{"class":541},[536,2751,1192],{"class":541},[536,2753,1196],{"class":1195},[536,2755,1199],{"class":541},[536,2757,1213],{"class":1195},[536,2759,1199],{"class":541},[536,2761,1249],{"class":1195},[536,2763,1220],{"class":541},[536,2765,559],{"class":541},[536,2767,1024],{"class":541},[536,2769,2770,2772,2774],{"class":538,"line":708},[536,2771,796],{"class":541},[536,2773,652],{"class":545},[536,2775,568],{"class":541},[536,2777,2778,2780,2782],{"class":538,"line":720},[536,2779,623],{"class":541},[536,2781,641],{"class":545},[536,2783,568],{"class":541},[504,2785,2786],{},"Or with a custom material",[528,2788,2792],{"className":2789,"code":2790,"language":2791,"meta":476,"style":476},"language-html shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003CBackdrop :floor=\"1.5\" :segments=\"20\" receive-shadow>\n  \u003CTresMeshPhysicalMaterial color=\"orange\" :roughness=\"1\" />\n\u003C/Backdrop>\n","html",[508,2793,2794,2829,2861],{"__ignoreMap":476},[536,2795,2796,2798,2800,2803,2805,2807,2810,2812,2815,2817,2819,2822,2824,2827],{"class":538,"line":477},[536,2797,542],{"class":541},[536,2799,359],{"class":545},[536,2801,2802],{"class":549}," :floor",[536,2804,556],{"class":541},[536,2806,559],{"class":541},[536,2808,2809],{"class":562},"1.5",[536,2811,559],{"class":541},[536,2813,2814],{"class":549}," :segments",[536,2816,556],{"class":541},[536,2818,559],{"class":541},[536,2820,2821],{"class":562},"20",[536,2823,559],{"class":541},[536,2825,2826],{"class":549}," receive-shadow",[536,2828,568],{"class":541},[536,2830,2831,2833,2836,2839,2841,2843,2846,2848,2851,2853,2855,2857,2859],{"class":538,"line":478},[536,2832,649],{"class":541},[536,2834,2835],{"class":545},"TresMeshPhysicalMaterial",[536,2837,2838],{"class":549}," color",[536,2840,556],{"class":541},[536,2842,559],{"class":541},[536,2844,2845],{"class":562},"orange",[536,2847,559],{"class":541},[536,2849,2850],{"class":549}," :roughness",[536,2852,556],{"class":541},[536,2854,559],{"class":541},[536,2856,1550],{"class":562},[536,2858,559],{"class":541},[536,2860,1024],{"class":541},[536,2862,2863,2865,2867],{"class":538,"line":599},[536,2864,623],{"class":541},[536,2866,359],{"class":545},[536,2868,568],{"class":541},[524,2870,1410],{"id":1409},[1412,2872,2873,2886],{},[1415,2874,2875],{},[1418,2876,2877,2879,2881,2883],{},[1421,2878,2056],{"align":1423},[1421,2880,2059],{"align":1423},[1421,2882,1430],{},[1421,2884,2885],{},"Required",[1432,2887,2888,2903,2916],{},[1418,2889,2890,2893,2895,2900],{},[1437,2891,2892],{"align":1423},"floor",[1437,2894,2154],{"align":1423},[1437,2896,2897],{},[508,2898,2899],{},"0.25",[1437,2901,2902],{},"No",[1418,2904,2905,2908,2910,2914],{},[1437,2906,2907],{"align":1423},"segments",[1437,2909,2154],{"align":1423},[1437,2911,2912],{},[508,2913,2821],{},[1437,2915,2902],{},[1418,2917,2918,2921,2923,2927],{},[1437,2919,2920],{"align":1423},"receiveShadow",[1437,2922,2095],{"align":1423},[1437,2924,2925],{},[508,2926,1499],{},[1437,2928,2902],{},[1653,2930,2931],{},"html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html pre.shiki code .s7zQu, html code.shiki .s7zQu{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html pre.shiki code .sbssI, html code.shiki .sbssI{--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}",{"title":476,"searchDepth":477,"depth":478,"links":2933},[2934,2935],{"id":526,"depth":478,"text":15},{"id":1409,"depth":478,"text":1410},"A curved plane studio backdrop for presentational purposes.",{},{"title":359,"description":2936},"NGh9OweK5ISAF-G6NdgBZKgy35j2Bl_DEl17ABguTXw",{"id":2941,"title":363,"body":2942,"description":3494,"extension":481,"links":482,"meta":3495,"navigation":484,"path":364,"seo":3496,"stem":365,"__hash__":3497},"docs/2.api/8.staging/ocean.md",{"type":469,"value":2943,"toc":3486},[2944,2949,2964,2969,2971,3104,3108,3117,3121,3137,3141,3144,3319,3321,3326,3483],[1675,2945,2946],{},[2947,2948],"staging-ocean",{},[504,2950,2951,2954,2955,515],{},[508,2952,2953],{},"\u003COcean />"," is a wrapper for the ",[520,2956,2959,2960,2963],{"href":2957,"rel":2958},"https://threejs.org/examples/?q=ocean#webgl_shaders_ocean",[1695],"Three.js ",[508,2961,2962],{},"Water"," add-on",[1701,2965,2966],{},[504,2967,2968],{},"Ocean comes with a default texture, so it needs to be wrapped in a Suspense component.",[524,2970,15],{"id":526},[528,2972,2975],{"className":530,"code":2973,"highlights":2974,"language":532,"meta":476,"style":476},"\u003Cscript setup lang=\"ts\">\nimport { TresCanvas } from '@tresjs/core'\nimport { Ocean } from '@tresjs/cientos'\n\u003C/script>\n\n\u003Ctemplate>\n  \u003CTresCanvas>\n    \u003CSuspense>\n      \u003COcean />\n    \u003C/Suspense>\n  \u003C/TresCanvas>\n\u003C/template>\n",[599,668],[508,2976,2977,2997,3015,3035,3043,3047,3055,3063,3071,3080,3088,3096],{"__ignoreMap":476},[536,2978,2979,2981,2983,2985,2987,2989,2991,2993,2995],{"class":538,"line":477},[536,2980,542],{"class":541},[536,2982,546],{"class":545},[536,2984,550],{"class":549},[536,2986,553],{"class":549},[536,2988,556],{"class":541},[536,2990,559],{"class":541},[536,2992,563],{"class":562},[536,2994,559],{"class":541},[536,2996,568],{"class":541},[536,2998,2999,3001,3003,3005,3007,3009,3011,3013],{"class":538,"line":478},[536,3000,574],{"class":573},[536,3002,577],{"class":541},[536,3004,581],{"class":580},[536,3006,584],{"class":541},[536,3008,587],{"class":573},[536,3010,590],{"class":541},[536,3012,593],{"class":562},[536,3014,596],{"class":541},[536,3016,3018,3020,3022,3025,3027,3029,3031,3033],{"class":3017,"line":599},[538,915],[536,3019,574],{"class":573},[536,3021,577],{"class":541},[536,3023,3024],{"class":580}," Ocean",[536,3026,584],{"class":541},[536,3028,587],{"class":573},[536,3030,590],{"class":541},[536,3032,615],{"class":562},[536,3034,596],{"class":541},[536,3036,3037,3039,3041],{"class":538,"line":620},[536,3038,623],{"class":541},[536,3040,546],{"class":545},[536,3042,568],{"class":541},[536,3044,3045],{"class":538,"line":630},[536,3046,633],{"emptyLinePlaceholder":484},[536,3048,3049,3051,3053],{"class":538,"line":636},[536,3050,542],{"class":541},[536,3052,641],{"class":545},[536,3054,568],{"class":541},[536,3056,3057,3059,3061],{"class":538,"line":646},[536,3058,649],{"class":541},[536,3060,652],{"class":545},[536,3062,568],{"class":541},[536,3064,3065,3067,3069],{"class":538,"line":657},[536,3066,660],{"class":541},[536,3068,663],{"class":545},[536,3070,568],{"class":541},[536,3072,3074,3076,3078],{"class":3073,"line":668},[538,915],[536,3075,671],{"class":541},[536,3077,363],{"class":545},[536,3079,1024],{"class":541},[536,3081,3082,3084,3086],{"class":538,"line":677},[536,3083,786],{"class":541},[536,3085,663],{"class":545},[536,3087,568],{"class":541},[536,3089,3090,3092,3094],{"class":538,"line":693},[536,3091,796],{"class":541},[536,3093,652],{"class":545},[536,3095,568],{"class":541},[536,3097,3098,3100,3102],{"class":538,"line":708},[536,3099,623],{"class":541},[536,3101,641],{"class":545},[536,3103,568],{"class":541},[1272,3105,3107],{"id":3106},"sky","SKY",[504,3109,3110,3112,3113,3116],{},[508,3111,2953],{}," works hand in hand with the Sky component, detecting the position of the sun and reflecting on the water.\n(",[508,3114,3115],{},"\u003CSky />"," is not required for making this component work.)",[1272,3118,3120],{"id":3119},"fog","Fog",[504,3122,2580,3123,3125,3126,3130,3131,3136],{},[508,3124,2953],{}," component also reacts when there's ",[520,3127,3120],{"href":3128,"rel":3129},"https://threejs.org/docs/index.html?q=fog#api/en/scenes/Fog",[1695]," or ",[520,3132,3135],{"href":3133,"rel":3134},"https://threejs.org/docs/index.html?q=fog#api/en/scenes/FogExp2",[1695],"FogExp2"," in your scene.",[524,3138,3140],{"id":3139},"custom-geometry","Custom Geometry",[504,3142,3143],{},"You can use custom geometry by adding it as a child.",[528,3145,3148],{"className":530,"code":3146,"highlights":3147,"language":532,"meta":476,"style":476},"\u003Cscript setup lang=\"ts\">\nimport { TresCanvas } from '@tresjs/core'\nimport { Ocean } from '@tresjs/cientos'\n\u003C/script>\n\n\u003Ctemplate>\n  \u003CTresCanvas>\n    \u003CSuspense>\n      \u003COcean>\n        \u003CTresCircleGeometry :args=\"[50, 16]\" />\n      \u003C/Ocean>\n    \u003C/Suspense>\n  \u003C/TresCanvas>\n\u003C/template>\n",[599,668,677,693],[508,3149,3150,3170,3188,3207,3215,3219,3227,3235,3243,3252,3285,3295,3303,3311],{"__ignoreMap":476},[536,3151,3152,3154,3156,3158,3160,3162,3164,3166,3168],{"class":538,"line":477},[536,3153,542],{"class":541},[536,3155,546],{"class":545},[536,3157,550],{"class":549},[536,3159,553],{"class":549},[536,3161,556],{"class":541},[536,3163,559],{"class":541},[536,3165,563],{"class":562},[536,3167,559],{"class":541},[536,3169,568],{"class":541},[536,3171,3172,3174,3176,3178,3180,3182,3184,3186],{"class":538,"line":478},[536,3173,574],{"class":573},[536,3175,577],{"class":541},[536,3177,581],{"class":580},[536,3179,584],{"class":541},[536,3181,587],{"class":573},[536,3183,590],{"class":541},[536,3185,593],{"class":562},[536,3187,596],{"class":541},[536,3189,3191,3193,3195,3197,3199,3201,3203,3205],{"class":3190,"line":599},[538,915],[536,3192,574],{"class":573},[536,3194,577],{"class":541},[536,3196,3024],{"class":580},[536,3198,584],{"class":541},[536,3200,587],{"class":573},[536,3202,590],{"class":541},[536,3204,615],{"class":562},[536,3206,596],{"class":541},[536,3208,3209,3211,3213],{"class":538,"line":620},[536,3210,623],{"class":541},[536,3212,546],{"class":545},[536,3214,568],{"class":541},[536,3216,3217],{"class":538,"line":630},[536,3218,633],{"emptyLinePlaceholder":484},[536,3220,3221,3223,3225],{"class":538,"line":636},[536,3222,542],{"class":541},[536,3224,641],{"class":545},[536,3226,568],{"class":541},[536,3228,3229,3231,3233],{"class":538,"line":646},[536,3230,649],{"class":541},[536,3232,652],{"class":545},[536,3234,568],{"class":541},[536,3236,3237,3239,3241],{"class":538,"line":657},[536,3238,660],{"class":541},[536,3240,663],{"class":545},[536,3242,568],{"class":541},[536,3244,3246,3248,3250],{"class":3245,"line":668},[538,915],[536,3247,671],{"class":541},[536,3249,363],{"class":545},[536,3251,568],{"class":541},[536,3253,3255,3258,3261,3263,3265,3267,3269,3271,3274,3276,3279,3281,3283],{"class":3254,"line":677},[538,915],[536,3256,3257],{"class":541},"        \u003C",[536,3259,3260],{"class":545},"TresCircleGeometry",[536,3262,1053],{"class":541},[536,3264,2552],{"class":549},[536,3266,556],{"class":541},[536,3268,559],{"class":541},[536,3270,1192],{"class":541},[536,3272,3273],{"class":1195},"50",[536,3275,1199],{"class":541},[536,3277,3278],{"class":1195},"16",[536,3280,1220],{"class":541},[536,3282,559],{"class":541},[536,3284,1024],{"class":541},[536,3286,3288,3291,3293],{"class":3287,"line":693},[538,915],[536,3289,3290],{"class":541},"      \u003C/",[536,3292,363],{"class":545},[536,3294,568],{"class":541},[536,3296,3297,3299,3301],{"class":538,"line":708},[536,3298,786],{"class":541},[536,3300,663],{"class":545},[536,3302,568],{"class":541},[536,3304,3305,3307,3309],{"class":538,"line":720},[536,3306,796],{"class":541},[536,3308,652],{"class":545},[536,3310,568],{"class":541},[536,3312,3313,3315,3317],{"class":538,"line":732},[536,3314,623],{"class":541},[536,3316,641],{"class":545},[536,3318,568],{"class":541},[524,3320,1410],{"id":1409},[1701,3322,3323],{},[504,3324,3325],{},"All of the props of this component are not reactive.",[1412,3327,3328,3338],{},[1415,3329,3330],{},[1418,3331,3332,3334,3336],{},[1421,3333,1424],{"align":1423},[1421,3335,1427],{"align":1423},[1421,3337,1430],{},[1432,3339,3340,3353,3365,3381,3394,3406,3419,3432,3444,3457,3470],{},[1418,3341,3342,3347,3350],{},[1437,3343,3344],{"align":1423},[2071,3345,3346],{},"textureWidth",[1437,3348,3349],{"align":1423},"Width of the mirror texture",[1437,3351,3352],{},"512",[1418,3354,3355,3360,3363],{},[1437,3356,3357],{"align":1423},[2071,3358,3359],{},"textureHeight",[1437,3361,3362],{"align":1423},"Height of the mirror texture",[1437,3364,3352],{},[1418,3366,3367,3372,3375],{},[1437,3368,3369],{"align":1423},[2071,3370,3371],{},"waterNormals",[1437,3373,3374],{"align":1423},"Normals of the water",[1437,3376,3377],{},[520,3378,3379],{"href":3379,"rel":3380},"https://raw.githubusercontent.com/Tresjs/assets/main/textures/water-normals/Water_1_M_Normal.jpg",[1695],[1418,3382,3383,3388,3391],{},[1437,3384,3385],{"align":1423},[2071,3386,3387],{},"sunDirection",[1437,3389,3390],{"align":1423},"Sun direction to be reflected on the water",[1437,3392,3393],{},"Vector3(0,0,0)",[1418,3395,3396,3401,3404],{},[1437,3397,3398],{"align":1423},[2071,3399,3400],{},"sunColor",[1437,3402,3403],{"align":1423},"Sun color to be reflected on the water",[1437,3405,2545],{},[1418,3407,3408,3413,3416],{},[1437,3409,3410],{"align":1423},[2071,3411,3412],{},"waterColor",[1437,3414,3415],{"align":1423},"Water Color",[1437,3417,3418],{},"0x001e0f",[1418,3420,3421,3426,3429],{},[1437,3422,3423],{"align":1423},[2071,3424,3425],{},"distortionScale",[1437,3427,3428],{"align":1423},"Distortion scale on reflected objects",[1437,3430,3431],{},"3.7",[1418,3433,3434,3439,3442],{},[1437,3435,3436],{"align":1423},[2071,3437,3438],{},"size",[1437,3440,3441],{"align":1423},"Size of the water normals",[1437,3443,1550],{},[1418,3445,3446,3451,3454],{},[1437,3447,3448],{"align":1423},[2071,3449,3450],{},"clipBias",[1437,3452,3453],{"align":1423},"To use the clipBias property",[1437,3455,3456],{},"0.0",[1418,3458,3459,3464,3467],{},[1437,3460,3461],{"align":1423},[2071,3462,3463],{},"alpha",[1437,3465,3466],{"align":1423},"To use the clipBias Alpha",[1437,3468,3469],{},"1.0",[1418,3471,3472,3477,3480],{},[1437,3473,3474],{"align":1423},[2071,3475,3476],{},"side",[1437,3478,3479],{"align":1423},"Which size of the mesh will render the water",[1437,3481,3482],{},"FrontSide",[1653,3484,3485],{},"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);}html pre.shiki code .sbssI, html code.shiki .sbssI{--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C}",{"title":476,"searchDepth":477,"depth":478,"links":3487},[3488,3492,3493],{"id":526,"depth":478,"text":15,"children":3489},[3490,3491],{"id":3106,"depth":599,"text":3107},{"id":3119,"depth":599,"text":3120},{"id":3139,"depth":478,"text":3140},{"id":1409,"depth":478,"text":1410},"Wrapper for the Three.js Water add-on with sky reflection support.",{},{"title":363,"description":3494},"PlsqVmWWdW6g0Gw3o8T0ocKMTLkrZyHWHr7HgkjrnMk",{"id":3499,"title":367,"body":3500,"description":4557,"extension":481,"links":482,"meta":4558,"navigation":484,"path":368,"seo":4559,"stem":369,"__hash__":4560},"docs/2.api/8.staging/precipitation.md",{"type":469,"value":3501,"toc":4549},[3502,3507,3513,3515,3521,3678,3682,3685,3897,3901,3904,4110,4114,4117,4365,4368,4373,4375,4547],[498,3503,3504],{},[3505,3506],"staging-precipitation",{},[504,3508,3509,3512],{},[508,3510,3511],{},"\u003CPrecipitation />"," is a fully flexible component that renders an infinite particle flow, It comes with several props that allow you customize it to create different effects like precipitation, snow, waterfall, beams, etc.",[524,3514,15],{"id":526},[504,3516,3517,3518,3520],{},"You can use ",[508,3519,3511],{}," component without passing any props, this will achieve a snowy effect, like the before example.",[528,3522,3525],{"className":530,"code":3523,"highlights":3524,"language":532,"meta":476,"style":476},"\u003Cscript setup lang=\"ts\">\nimport { TresCanvas } from '@tresjs/core'\nimport { Precipitation } from '@tresjs/cientos'\n\u003C/script>\n\n\u003Ctemplate>\n  \u003CTresCanvas>\n    \u003CTresPerspectiveCamera :position=\"[0, 3, 5]\" />\n    \u003CPrecipitation />\n    \u003CTresAmbientLight />\n  \u003C/TresCanvas>\n\u003C/template>\n",[599,668],[508,3526,3527,3547,3565,3585,3593,3597,3605,3613,3645,3654,3662,3670],{"__ignoreMap":476},[536,3528,3529,3531,3533,3535,3537,3539,3541,3543,3545],{"class":538,"line":477},[536,3530,542],{"class":541},[536,3532,546],{"class":545},[536,3534,550],{"class":549},[536,3536,553],{"class":549},[536,3538,556],{"class":541},[536,3540,559],{"class":541},[536,3542,563],{"class":562},[536,3544,559],{"class":541},[536,3546,568],{"class":541},[536,3548,3549,3551,3553,3555,3557,3559,3561,3563],{"class":538,"line":478},[536,3550,574],{"class":573},[536,3552,577],{"class":541},[536,3554,581],{"class":580},[536,3556,584],{"class":541},[536,3558,587],{"class":573},[536,3560,590],{"class":541},[536,3562,593],{"class":562},[536,3564,596],{"class":541},[536,3566,3568,3570,3572,3575,3577,3579,3581,3583],{"class":3567,"line":599},[538,915],[536,3569,574],{"class":573},[536,3571,577],{"class":541},[536,3573,3574],{"class":580}," Precipitation",[536,3576,584],{"class":541},[536,3578,587],{"class":573},[536,3580,590],{"class":541},[536,3582,615],{"class":562},[536,3584,596],{"class":541},[536,3586,3587,3589,3591],{"class":538,"line":620},[536,3588,623],{"class":541},[536,3590,546],{"class":545},[536,3592,568],{"class":541},[536,3594,3595],{"class":538,"line":630},[536,3596,633],{"emptyLinePlaceholder":484},[536,3598,3599,3601,3603],{"class":538,"line":636},[536,3600,542],{"class":541},[536,3602,641],{"class":545},[536,3604,568],{"class":541},[536,3606,3607,3609,3611],{"class":538,"line":646},[536,3608,649],{"class":541},[536,3610,652],{"class":545},[536,3612,568],{"class":541},[536,3614,3615,3617,3619,3621,3623,3625,3627,3629,3631,3633,3635,3637,3639,3641,3643],{"class":538,"line":657},[536,3616,660],{"class":541},[536,3618,2689],{"class":545},[536,3620,1053],{"class":541},[536,3622,2368],{"class":549},[536,3624,556],{"class":541},[536,3626,559],{"class":541},[536,3628,1192],{"class":541},[536,3630,1196],{"class":1195},[536,3632,1199],{"class":541},[536,3634,2706],{"class":1195},[536,3636,1199],{"class":541},[536,3638,2381],{"class":1195},[536,3640,1220],{"class":541},[536,3642,559],{"class":541},[536,3644,1024],{"class":541},[536,3646,3648,3650,3652],{"class":3647,"line":668},[538,915],[536,3649,660],{"class":541},[536,3651,367],{"class":545},[536,3653,1024],{"class":541},[536,3655,3656,3658,3660],{"class":538,"line":677},[536,3657,660],{"class":541},[536,3659,2732],{"class":545},[536,3661,1024],{"class":541},[536,3663,3664,3666,3668],{"class":538,"line":693},[536,3665,796],{"class":541},[536,3667,652],{"class":545},[536,3669,568],{"class":541},[536,3671,3672,3674,3676],{"class":538,"line":708},[536,3673,623],{"class":541},[536,3675,641],{"class":545},[536,3677,568],{"class":541},[1272,3679,3681],{"id":3680},"rain","Rain",[504,3683,3684],{},"By setting the randomness to 0, increase the speed  and reduce the count. You can easily achieve a more rainy effect.",[528,3686,3689],{"className":530,"code":3687,"highlights":3688,"language":532,"meta":476,"style":476},"\u003Cscript setup lang=\"ts\">\nimport { TresCanvas } from '@tresjs/core'\nimport { Precipitation } from '@tresjs/cientos'\n\u003C/script>\n\n\u003Ctemplate>\n  \u003CTresCanvas>\n    \u003CTresPerspectiveCamera :position=\"[0, 3, 5]\" />\n    \u003CPrecipitation\n      :count=\"2000\"\n      :speed=\"0.3\"\n      :randomness=\"0\"\n    />\n    \u003CTresAmbientLight />\n  \u003C/TresCanvas>\n\u003C/template>\n",[599,668,677,693,708,720],[508,3690,3691,3711,3729,3748,3756,3760,3768,3776,3808,3816,3834,3851,3867,3873,3881,3889],{"__ignoreMap":476},[536,3692,3693,3695,3697,3699,3701,3703,3705,3707,3709],{"class":538,"line":477},[536,3694,542],{"class":541},[536,3696,546],{"class":545},[536,3698,550],{"class":549},[536,3700,553],{"class":549},[536,3702,556],{"class":541},[536,3704,559],{"class":541},[536,3706,563],{"class":562},[536,3708,559],{"class":541},[536,3710,568],{"class":541},[536,3712,3713,3715,3717,3719,3721,3723,3725,3727],{"class":538,"line":478},[536,3714,574],{"class":573},[536,3716,577],{"class":541},[536,3718,581],{"class":580},[536,3720,584],{"class":541},[536,3722,587],{"class":573},[536,3724,590],{"class":541},[536,3726,593],{"class":562},[536,3728,596],{"class":541},[536,3730,3732,3734,3736,3738,3740,3742,3744,3746],{"class":3731,"line":599},[538,915],[536,3733,574],{"class":573},[536,3735,577],{"class":541},[536,3737,3574],{"class":580},[536,3739,584],{"class":541},[536,3741,587],{"class":573},[536,3743,590],{"class":541},[536,3745,615],{"class":562},[536,3747,596],{"class":541},[536,3749,3750,3752,3754],{"class":538,"line":620},[536,3751,623],{"class":541},[536,3753,546],{"class":545},[536,3755,568],{"class":541},[536,3757,3758],{"class":538,"line":630},[536,3759,633],{"emptyLinePlaceholder":484},[536,3761,3762,3764,3766],{"class":538,"line":636},[536,3763,542],{"class":541},[536,3765,641],{"class":545},[536,3767,568],{"class":541},[536,3769,3770,3772,3774],{"class":538,"line":646},[536,3771,649],{"class":541},[536,3773,652],{"class":545},[536,3775,568],{"class":541},[536,3777,3778,3780,3782,3784,3786,3788,3790,3792,3794,3796,3798,3800,3802,3804,3806],{"class":538,"line":657},[536,3779,660],{"class":541},[536,3781,2689],{"class":545},[536,3783,1053],{"class":541},[536,3785,2368],{"class":549},[536,3787,556],{"class":541},[536,3789,559],{"class":541},[536,3791,1192],{"class":541},[536,3793,1196],{"class":1195},[536,3795,1199],{"class":541},[536,3797,2706],{"class":1195},[536,3799,1199],{"class":541},[536,3801,2381],{"class":1195},[536,3803,1220],{"class":541},[536,3805,559],{"class":541},[536,3807,1024],{"class":541},[536,3809,3811,3813],{"class":3810,"line":668},[538,915],[536,3812,660],{"class":541},[536,3814,3815],{"class":545},"Precipitation\n",[536,3817,3819,3822,3825,3827,3829,3832],{"class":3818,"line":677},[538,915],[536,3820,3821],{"class":541},"      :",[536,3823,3824],{"class":549},"count",[536,3826,556],{"class":541},[536,3828,559],{"class":541},[536,3830,3831],{"class":1195},"2000",[536,3833,774],{"class":541},[536,3835,3837,3839,3842,3844,3846,3849],{"class":3836,"line":693},[538,915],[536,3838,3821],{"class":541},[536,3840,3841],{"class":549},"speed",[536,3843,556],{"class":541},[536,3845,559],{"class":541},[536,3847,3848],{"class":1195},"0.3",[536,3850,774],{"class":541},[536,3852,3854,3856,3859,3861,3863,3865],{"class":3853,"line":708},[538,915],[536,3855,3821],{"class":541},[536,3857,3858],{"class":549},"randomness",[536,3860,556],{"class":541},[536,3862,559],{"class":541},[536,3864,1196],{"class":1195},[536,3866,774],{"class":541},[536,3868,3870],{"class":3869,"line":720},[538,915],[536,3871,3872],{"class":541},"    />\n",[536,3874,3875,3877,3879],{"class":538,"line":732},[536,3876,660],{"class":541},[536,3878,2732],{"class":545},[536,3880,1024],{"class":541},[536,3882,3883,3885,3887],{"class":538,"line":744},[536,3884,796],{"class":541},[536,3886,652],{"class":545},[536,3888,568],{"class":541},[536,3890,3891,3893,3895],{"class":538,"line":756},[536,3892,623],{"class":541},[536,3894,641],{"class":545},[536,3896,568],{"class":541},[1272,3898,3900],{"id":3899},"storm","Storm",[504,3902,3903],{},"A storm effect? Easy just increase the randomness.",[528,3905,3908],{"className":530,"code":3906,"highlights":3907,"language":532,"meta":476,"style":476},"\u003Cscript setup lang=\"ts\">\nimport { TresCanvas } from '@tresjs/core'\nimport { Precipitation } from '@tresjs/cientos'\n\u003C/script>\n\n\u003Ctemplate>\n  \u003CTresCanvas>\n    \u003CTresPerspectiveCamera :position=\"[0, 3, 5]\" />\n    \u003CPrecipitation\n      :count=\"3000\"\n      :speed=\"0.5\"\n      :randomness=\"1.5\"\n    />\n    \u003CTresAmbientLight />\n  \u003C/TresCanvas>\n\u003C/template>\n",[599,668,677,693,708,720],[508,3909,3910,3930,3948,3967,3975,3979,3987,3995,4027,4034,4050,4066,4081,4086,4094,4102],{"__ignoreMap":476},[536,3911,3912,3914,3916,3918,3920,3922,3924,3926,3928],{"class":538,"line":477},[536,3913,542],{"class":541},[536,3915,546],{"class":545},[536,3917,550],{"class":549},[536,3919,553],{"class":549},[536,3921,556],{"class":541},[536,3923,559],{"class":541},[536,3925,563],{"class":562},[536,3927,559],{"class":541},[536,3929,568],{"class":541},[536,3931,3932,3934,3936,3938,3940,3942,3944,3946],{"class":538,"line":478},[536,3933,574],{"class":573},[536,3935,577],{"class":541},[536,3937,581],{"class":580},[536,3939,584],{"class":541},[536,3941,587],{"class":573},[536,3943,590],{"class":541},[536,3945,593],{"class":562},[536,3947,596],{"class":541},[536,3949,3951,3953,3955,3957,3959,3961,3963,3965],{"class":3950,"line":599},[538,915],[536,3952,574],{"class":573},[536,3954,577],{"class":541},[536,3956,3574],{"class":580},[536,3958,584],{"class":541},[536,3960,587],{"class":573},[536,3962,590],{"class":541},[536,3964,615],{"class":562},[536,3966,596],{"class":541},[536,3968,3969,3971,3973],{"class":538,"line":620},[536,3970,623],{"class":541},[536,3972,546],{"class":545},[536,3974,568],{"class":541},[536,3976,3977],{"class":538,"line":630},[536,3978,633],{"emptyLinePlaceholder":484},[536,3980,3981,3983,3985],{"class":538,"line":636},[536,3982,542],{"class":541},[536,3984,641],{"class":545},[536,3986,568],{"class":541},[536,3988,3989,3991,3993],{"class":538,"line":646},[536,3990,649],{"class":541},[536,3992,652],{"class":545},[536,3994,568],{"class":541},[536,3996,3997,3999,4001,4003,4005,4007,4009,4011,4013,4015,4017,4019,4021,4023,4025],{"class":538,"line":657},[536,3998,660],{"class":541},[536,4000,2689],{"class":545},[536,4002,1053],{"class":541},[536,4004,2368],{"class":549},[536,4006,556],{"class":541},[536,4008,559],{"class":541},[536,4010,1192],{"class":541},[536,4012,1196],{"class":1195},[536,4014,1199],{"class":541},[536,4016,2706],{"class":1195},[536,4018,1199],{"class":541},[536,4020,2381],{"class":1195},[536,4022,1220],{"class":541},[536,4024,559],{"class":541},[536,4026,1024],{"class":541},[536,4028,4030,4032],{"class":4029,"line":668},[538,915],[536,4031,660],{"class":541},[536,4033,3815],{"class":545},[536,4035,4037,4039,4041,4043,4045,4048],{"class":4036,"line":677},[538,915],[536,4038,3821],{"class":541},[536,4040,3824],{"class":549},[536,4042,556],{"class":541},[536,4044,559],{"class":541},[536,4046,4047],{"class":1195},"3000",[536,4049,774],{"class":541},[536,4051,4053,4055,4057,4059,4061,4064],{"class":4052,"line":693},[538,915],[536,4054,3821],{"class":541},[536,4056,3841],{"class":549},[536,4058,556],{"class":541},[536,4060,559],{"class":541},[536,4062,4063],{"class":1195},"0.5",[536,4065,774],{"class":541},[536,4067,4069,4071,4073,4075,4077,4079],{"class":4068,"line":708},[538,915],[536,4070,3821],{"class":541},[536,4072,3858],{"class":549},[536,4074,556],{"class":541},[536,4076,559],{"class":541},[536,4078,2809],{"class":1195},[536,4080,774],{"class":541},[536,4082,4084],{"class":4083,"line":720},[538,915],[536,4085,3872],{"class":541},[536,4087,4088,4090,4092],{"class":538,"line":732},[536,4089,660],{"class":541},[536,4091,2732],{"class":545},[536,4093,1024],{"class":541},[536,4095,4096,4098,4100],{"class":538,"line":744},[536,4097,796],{"class":541},[536,4099,652],{"class":545},[536,4101,568],{"class":541},[536,4103,4104,4106,4108],{"class":538,"line":756},[536,4105,623],{"class":541},[536,4107,641],{"class":545},[536,4109,568],{"class":541},[1272,4111,4113],{"id":4112},"beam","Beam",[504,4115,4116],{},"What about an infinite beam? Just set the area, to the axis that you need constrain.",[528,4118,4121],{"className":530,"code":4119,"highlights":4120,"language":532,"meta":476,"style":476},"\u003Cscript setup lang=\"ts\">\nimport { TresCanvas } from '@tresjs/core'\nimport { Precipitation } from '@tresjs/cientos'\n\u003C/script>\n\n\u003Ctemplate>\n  \u003CTresCanvas>\n    \u003CTresPerspectiveCamera :position=\"[0, 3, 5]\" />\n    \u003CPrecipitation\n      :area=\"[0.5, 0.5, 20]\"\n      :count=\"1000\"\n      :speed=\"0.2\"\n      :size=\"0.3\"\n      color=\"#00ff00\"\n    />\n    \u003CTresAmbientLight />\n  \u003C/TresCanvas>\n\u003C/template>\n",[599,668,677,693,708,720,732,744],[508,4122,4123,4143,4161,4180,4188,4192,4200,4208,4240,4247,4275,4290,4306,4321,4336,4341,4349,4357],{"__ignoreMap":476},[536,4124,4125,4127,4129,4131,4133,4135,4137,4139,4141],{"class":538,"line":477},[536,4126,542],{"class":541},[536,4128,546],{"class":545},[536,4130,550],{"class":549},[536,4132,553],{"class":549},[536,4134,556],{"class":541},[536,4136,559],{"class":541},[536,4138,563],{"class":562},[536,4140,559],{"class":541},[536,4142,568],{"class":541},[536,4144,4145,4147,4149,4151,4153,4155,4157,4159],{"class":538,"line":478},[536,4146,574],{"class":573},[536,4148,577],{"class":541},[536,4150,581],{"class":580},[536,4152,584],{"class":541},[536,4154,587],{"class":573},[536,4156,590],{"class":541},[536,4158,593],{"class":562},[536,4160,596],{"class":541},[536,4162,4164,4166,4168,4170,4172,4174,4176,4178],{"class":4163,"line":599},[538,915],[536,4165,574],{"class":573},[536,4167,577],{"class":541},[536,4169,3574],{"class":580},[536,4171,584],{"class":541},[536,4173,587],{"class":573},[536,4175,590],{"class":541},[536,4177,615],{"class":562},[536,4179,596],{"class":541},[536,4181,4182,4184,4186],{"class":538,"line":620},[536,4183,623],{"class":541},[536,4185,546],{"class":545},[536,4187,568],{"class":541},[536,4189,4190],{"class":538,"line":630},[536,4191,633],{"emptyLinePlaceholder":484},[536,4193,4194,4196,4198],{"class":538,"line":636},[536,4195,542],{"class":541},[536,4197,641],{"class":545},[536,4199,568],{"class":541},[536,4201,4202,4204,4206],{"class":538,"line":646},[536,4203,649],{"class":541},[536,4205,652],{"class":545},[536,4207,568],{"class":541},[536,4209,4210,4212,4214,4216,4218,4220,4222,4224,4226,4228,4230,4232,4234,4236,4238],{"class":538,"line":657},[536,4211,660],{"class":541},[536,4213,2689],{"class":545},[536,4215,1053],{"class":541},[536,4217,2368],{"class":549},[536,4219,556],{"class":541},[536,4221,559],{"class":541},[536,4223,1192],{"class":541},[536,4225,1196],{"class":1195},[536,4227,1199],{"class":541},[536,4229,2706],{"class":1195},[536,4231,1199],{"class":541},[536,4233,2381],{"class":1195},[536,4235,1220],{"class":541},[536,4237,559],{"class":541},[536,4239,1024],{"class":541},[536,4241,4243,4245],{"class":4242,"line":668},[538,915],[536,4244,660],{"class":541},[536,4246,3815],{"class":545},[536,4248,4250,4252,4255,4257,4259,4261,4263,4265,4267,4269,4271,4273],{"class":4249,"line":677},[538,915],[536,4251,3821],{"class":541},[536,4253,4254],{"class":549},"area",[536,4256,556],{"class":541},[536,4258,559],{"class":541},[536,4260,1192],{"class":541},[536,4262,4063],{"class":1195},[536,4264,1199],{"class":541},[536,4266,4063],{"class":1195},[536,4268,1199],{"class":541},[536,4270,2821],{"class":1195},[536,4272,1220],{"class":541},[536,4274,774],{"class":541},[536,4276,4278,4280,4282,4284,4286,4288],{"class":4277,"line":693},[538,915],[536,4279,3821],{"class":541},[536,4281,3824],{"class":549},[536,4283,556],{"class":541},[536,4285,559],{"class":541},[536,4287,1563],{"class":1195},[536,4289,774],{"class":541},[536,4291,4293,4295,4297,4299,4301,4304],{"class":4292,"line":708},[538,915],[536,4294,3821],{"class":541},[536,4296,3841],{"class":549},[536,4298,556],{"class":541},[536,4300,559],{"class":541},[536,4302,4303],{"class":1195},"0.2",[536,4305,774],{"class":541},[536,4307,4309,4311,4313,4315,4317,4319],{"class":4308,"line":720},[538,915],[536,4310,3821],{"class":541},[536,4312,3438],{"class":549},[536,4314,556],{"class":541},[536,4316,559],{"class":541},[536,4318,3848],{"class":1195},[536,4320,774],{"class":541},[536,4322,4324,4327,4329,4331,4334],{"class":4323,"line":732},[538,915],[536,4325,4326],{"class":549},"      color",[536,4328,556],{"class":541},[536,4330,559],{"class":541},[536,4332,4333],{"class":562},"#00ff00",[536,4335,774],{"class":541},[536,4337,4339],{"class":4338,"line":744},[538,915],[536,4340,3872],{"class":541},[536,4342,4343,4345,4347],{"class":538,"line":756},[536,4344,660],{"class":541},[536,4346,2732],{"class":545},[536,4348,1024],{"class":541},[536,4350,4351,4353,4355],{"class":538,"line":768},[536,4352,796],{"class":541},[536,4354,652],{"class":545},[536,4356,568],{"class":541},[536,4358,4359,4361,4363],{"class":538,"line":777},[536,4360,623],{"class":541},[536,4362,641],{"class":545},[536,4364,568],{"class":541},[504,4366,4367],{},"You can create much more! ☔",[1701,4369,4370],{},[504,4371,4372],{},"Be careful with the performance this components render infinite particles in movement",[524,4374,1410],{"id":1409},[1412,4376,4377,4387],{},[1415,4378,4379],{},[1418,4380,4381,4383,4385],{},[1421,4382,1424],{"align":1423},[1421,4384,1427],{"align":1423},[1421,4386,1430],{},[1432,4388,4389,4401,4415,4426,4439,4451,4464,4477,4489,4500,4511,4523,4535],{},[1418,4390,4391,4395,4398],{},[1437,4392,4393],{"align":1423},[2071,4394,3438],{},[1437,4396,4397],{"align":1423},"The size of the drops.",[1437,4399,4400],{},"0.1",[1418,4402,4403,4407,4410],{},[1437,4404,4405],{"align":1423},[2071,4406,4254],{},[1437,4408,4409],{"align":1423},"The size of the precipitation area.",[1437,4411,4412],{},[536,4413,4414],{},"10, 10, 20",[1418,4416,4417,4421,4424],{},[1437,4418,4419],{"align":1423},[2071,4420,2537],{},[1437,4422,4423],{"align":1423},"The color of the drops.",[1437,4425,2545],{},[1418,4427,4428,4433,4436],{},[1437,4429,4430],{"align":1423},[2071,4431,4432],{},"map",[1437,4434,4435],{"align":1423},"Color texture of the drops.",[1437,4437,4438],{},"null",[1418,4440,4441,4446,4449],{},[1437,4442,4443],{"align":1423},[2071,4444,4445],{},"alphaMap",[1437,4447,4448],{"align":1423},"Alpha texture of the Drops.",[1437,4450,4438],{},[1418,4452,4453,4458,4461],{},[1437,4454,4455],{"align":1423},[2071,4456,4457],{},"alphaTest",[1437,4459,4460],{"align":1423},"Enables the WebGL to know when not to render the pixel.",[1437,4462,4463],{},"0.01",[1418,4465,4466,4471,4474],{},[1437,4467,4468],{"align":1423},[2071,4469,4470],{},"opacity",[1437,4472,4473],{"align":1423},"Set the opacity of the drops.",[1437,4475,4476],{},"0.8",[1418,4478,4479,4483,4486],{},[1437,4480,4481],{"align":1423},[2071,4482,3824],{},[1437,4484,4485],{"align":1423},"Number of drops.",[1437,4487,4488],{},"5000",[1418,4490,4491,4495,4498],{},[1437,4492,4493],{"align":1423},[2071,4494,3841],{},[1437,4496,4497],{"align":1423},"Drops speed.",[1437,4499,4400],{},[1418,4501,4502,4506,4509],{},[1437,4503,4504],{"align":1423},[2071,4505,3858],{},[1437,4507,4508],{"align":1423},"Add randomness to the drops.",[1437,4510,4063],{},[1418,4512,4513,4518,4521],{},[1437,4514,4515],{"align":1423},[2071,4516,4517],{},"depthWrite",[1437,4519,4520],{"align":1423},"Whether should write to the depth buffer or not. drops.",[1437,4522,1176],{},[1418,4524,4525,4530,4533],{},[1437,4526,4527],{"align":1423},[2071,4528,4529],{},"transparent",[1437,4531,4532],{"align":1423},"Transparency on the drops texture",[1437,4534,1499],{},[1418,4536,4537,4542,4545],{},[1437,4538,4539],{"align":1423},[2071,4540,4541],{},"sizeAttenuation",[1437,4543,4544],{"align":1423},"Keep the same size regardless distance. drops.",[1437,4546,1176],{},[1653,4548,2931],{},{"title":476,"searchDepth":477,"depth":478,"links":4550},[4551,4556],{"id":526,"depth":478,"text":15,"children":4552},[4553,4554,4555],{"id":3680,"depth":599,"text":3681},{"id":3899,"depth":599,"text":3900},{"id":4112,"depth":599,"text":4113},{"id":1409,"depth":478,"text":1410},"Flexible infinite particle flow for rain, snow, waterfall, and beam effects.",{},{"title":367,"description":4557},"oN0a-7Db4CfLOwRF8vcglYxi0o3twbiI7bqgn-6GqoY",{"id":4562,"title":371,"body":4563,"description":4979,"extension":481,"links":482,"meta":4980,"navigation":484,"path":372,"seo":4981,"stem":373,"__hash__":4982},"docs/2.api/8.staging/sky.md",{"type":469,"value":4564,"toc":4975},[4565,4570,4580,4582,4789,4791,4973],[498,4566,4567],{},[4568,4569],"staging-sky",{},[504,4571,4572,2954,4574,515],{},[508,4573,3115],{},[520,4575,2959,4578,2963],{"href":4576,"rel":4577},"https://threejs.org/examples/?q=sky#webgl_shaders_sky",[1695],[508,4579,371],{},[524,4581,15],{"id":526},[528,4583,4586],{"className":530,"code":4584,"highlights":4585,"language":532,"meta":476,"style":476},"\u003Cscript setup lang=\"ts\">\nimport { OrbitControls, Sky } from '@tresjs/cientos'\nimport { TresCanvas } from '@tresjs/core'\n\u003C/script>\n\n\u003Ctemplate>\n  \u003CTresCanvas :tone-mapping-exposure=\"0.25\">\n    \u003CTresPerspectiveCamera :position=\"[0, 15, 200]\" />\n    \u003CSky />\n    \u003COrbitControls />\n    \u003CTresGridHelper :args=\"[1000, 20]\" />\n  \u003C/TresCanvas>\n\u003C/template>\n\n",[478,668],[508,4587,4588,4608,4633,4651,4659,4663,4671,4692,4726,4735,4744,4773,4781],{"__ignoreMap":476},[536,4589,4590,4592,4594,4596,4598,4600,4602,4604,4606],{"class":538,"line":477},[536,4591,542],{"class":541},[536,4593,546],{"class":545},[536,4595,550],{"class":549},[536,4597,553],{"class":549},[536,4599,556],{"class":541},[536,4601,559],{"class":541},[536,4603,563],{"class":562},[536,4605,559],{"class":541},[536,4607,568],{"class":541},[536,4609,4611,4613,4615,4618,4620,4623,4625,4627,4629,4631],{"class":4610,"line":478},[538,915],[536,4612,574],{"class":573},[536,4614,577],{"class":541},[536,4616,4617],{"class":580}," OrbitControls",[536,4619,946],{"class":541},[536,4621,4622],{"class":580}," Sky",[536,4624,584],{"class":541},[536,4626,587],{"class":573},[536,4628,590],{"class":541},[536,4630,615],{"class":562},[536,4632,596],{"class":541},[536,4634,4635,4637,4639,4641,4643,4645,4647,4649],{"class":538,"line":599},[536,4636,574],{"class":573},[536,4638,577],{"class":541},[536,4640,581],{"class":580},[536,4642,584],{"class":541},[536,4644,587],{"class":573},[536,4646,590],{"class":541},[536,4648,593],{"class":562},[536,4650,596],{"class":541},[536,4652,4653,4655,4657],{"class":538,"line":620},[536,4654,623],{"class":541},[536,4656,546],{"class":545},[536,4658,568],{"class":541},[536,4660,4661],{"class":538,"line":630},[536,4662,633],{"emptyLinePlaceholder":484},[536,4664,4665,4667,4669],{"class":538,"line":636},[536,4666,542],{"class":541},[536,4668,641],{"class":545},[536,4670,568],{"class":541},[536,4672,4673,4675,4677,4679,4682,4684,4686,4688,4690],{"class":538,"line":646},[536,4674,649],{"class":541},[536,4676,652],{"class":545},[536,4678,1053],{"class":541},[536,4680,4681],{"class":549},"tone-mapping-exposure",[536,4683,556],{"class":541},[536,4685,559],{"class":541},[536,4687,2899],{"class":1195},[536,4689,559],{"class":541},[536,4691,568],{"class":541},[536,4693,4694,4696,4698,4700,4702,4704,4706,4708,4710,4712,4715,4717,4720,4722,4724],{"class":538,"line":657},[536,4695,660],{"class":541},[536,4697,2689],{"class":545},[536,4699,1053],{"class":541},[536,4701,2368],{"class":549},[536,4703,556],{"class":541},[536,4705,559],{"class":541},[536,4707,1192],{"class":541},[536,4709,1196],{"class":1195},[536,4711,1199],{"class":541},[536,4713,4714],{"class":1195},"15",[536,4716,1199],{"class":541},[536,4718,4719],{"class":1195},"200",[536,4721,1220],{"class":541},[536,4723,559],{"class":541},[536,4725,1024],{"class":541},[536,4727,4729,4731,4733],{"class":4728,"line":668},[538,915],[536,4730,660],{"class":541},[536,4732,371],{"class":545},[536,4734,1024],{"class":541},[536,4736,4737,4739,4742],{"class":538,"line":677},[536,4738,660],{"class":541},[536,4740,4741],{"class":545},"OrbitControls",[536,4743,1024],{"class":541},[536,4745,4746,4748,4751,4753,4755,4757,4759,4761,4763,4765,4767,4769,4771],{"class":538,"line":693},[536,4747,660],{"class":541},[536,4749,4750],{"class":545},"TresGridHelper",[536,4752,1053],{"class":541},[536,4754,2552],{"class":549},[536,4756,556],{"class":541},[536,4758,559],{"class":541},[536,4760,1192],{"class":541},[536,4762,1563],{"class":1195},[536,4764,1199],{"class":541},[536,4766,2821],{"class":1195},[536,4768,1220],{"class":541},[536,4770,559],{"class":541},[536,4772,1024],{"class":541},[536,4774,4775,4777,4779],{"class":538,"line":708},[536,4776,796],{"class":541},[536,4778,652],{"class":545},[536,4780,568],{"class":541},[536,4782,4783,4785,4787],{"class":538,"line":720},[536,4784,623],{"class":541},[536,4786,641],{"class":545},[536,4788,568],{"class":541},[524,4790,1410],{"id":1409},[1412,4792,4793,4807],{},[1415,4794,4795],{},[1418,4796,4797,4799,4801,4803,4805],{},[1421,4798,2056],{"align":1423},[1421,4800,2059],{"align":1423},[1421,4802,1427],{"align":1423},[1421,4804,1430],{"align":1423},[1421,4806,2885],{"align":1423},[1432,4808,4809,4830,4854,4880,4904,4925,4952],{},[1418,4810,4811,4816,4820,4823,4828],{},[1437,4812,4813],{"align":1423},[2071,4814,4815],{},"turbidity",[1437,4817,4818],{"align":1423},[508,4819,2154],{},[1437,4821,4822],{"align":1423},"Haziness",[1437,4824,4825],{"align":1423},[508,4826,4827],{},"3.4",[1437,4829,2902],{"align":1423},[1418,4831,4832,4837,4841,4848,4852],{},[1437,4833,4834],{"align":1423},[2071,4835,4836],{},"rayleigh",[1437,4838,4839],{"align":1423},[508,4840,2154],{},[1437,4842,4843],{"align":1423},[520,4844,4847],{"href":4845,"rel":4846},"https://en.wikipedia.org/wiki/Rayleigh_scattering",[1695],"Rayleigh scattering",[1437,4849,4850],{"align":1423},[508,4851,2706],{},[1437,4853,2902],{"align":1423},[1418,4855,4856,4861,4865,4873,4878],{},[1437,4857,4858],{"align":1423},[2071,4859,4860],{},"mieCoefficient",[1437,4862,4863],{"align":1423},[508,4864,2154],{},[1437,4866,4867,4872],{"align":1423},[520,4868,4871],{"href":4869,"rel":4870},"https://en.wikipedia.org/wiki/Mie_scattering",[1695],"Mie scattering"," amount",[1437,4874,4875],{"align":1423},[508,4876,4877],{},"0.005",[1437,4879,2902],{"align":1423},[1418,4881,4882,4887,4891,4897,4902],{},[1437,4883,4884],{"align":1423},[2071,4885,4886],{},"mieDirectionalG",[1437,4888,4889],{"align":1423},[508,4890,2154],{},[1437,4892,4893,4896],{"align":1423},[520,4894,4871],{"href":4869,"rel":4895},[1695]," direction",[1437,4898,4899],{"align":1423},[508,4900,4901],{},"0.7",[1437,4903,2902],{"align":1423},[1418,4905,4906,4911,4915,4918,4923],{},[1437,4907,4908],{"align":1423},[2071,4909,4910],{},"elevation",[1437,4912,4913],{"align":1423},[508,4914,2154],{},[1437,4916,4917],{"align":1423},"Sun's elevation from the horizon, in degrees",[1437,4919,4920],{"align":1423},[508,4921,4922],{},"0.6",[1437,4924,2902],{"align":1423},[1418,4926,4927,4932,4936,4945,4950],{},[1437,4928,4929],{"align":1423},[2071,4930,4931],{},"azimuth",[1437,4933,4934],{"align":1423},[508,4935,2154],{},[1437,4937,4938,4939,4944],{"align":1423},"Sun's ",[520,4940,4943],{"href":4941,"rel":4942},"https://en.wikipedia.org/wiki/Solar_azimuth_angle",[1695],"azimuth angle",", in degrees – its horizontal coordinate on the horizon",[1437,4946,4947],{"align":1423},[508,4948,4949],{},"180",[1437,4951,2902],{"align":1423},[1418,4953,4954,4959,4963,4966,4971],{},[1437,4955,4956],{"align":1423},[2071,4957,4958],{},"distance",[1437,4960,4961],{"align":1423},[508,4962,2154],{},[1437,4964,4965],{"align":1423},"Sky box scale",[1437,4967,4968],{"align":1423},[508,4969,4970],{},"450000",[1437,4972,2902],{"align":1423},[1653,4974,2931],{},{"title":476,"searchDepth":477,"depth":478,"links":4976},[4977,4978],{"id":526,"depth":478,"text":15},{"id":1409,"depth":478,"text":1410},"Wrapper for the Three.js Sky add-on with sun position controls.",{},{"title":371,"description":4979},"z9xEmwuzWS7Jr3s3_7eT9BeV1McRoKp3ZlWGZa_0yWI",{"id":4984,"title":375,"body":4985,"description":5393,"extension":481,"links":482,"meta":5394,"navigation":484,"path":376,"seo":5395,"stem":377,"__hash__":5396},"docs/2.api/8.staging/smoke.md",{"type":469,"value":4986,"toc":5387},[4987,4992,4998,5000,5005,5010,5180,5182,5377,5381,5385],[1675,4988,4989],{},[4990,4991],"staging-smoke",{},[504,4993,4994,4997],{},[508,4995,4996],{},"\u003CSmoke />"," is a component that renders a smoke in your scene. It is an abstraction that use a combination of textures, transparency and some calculation, to create a beautiful  smoke - cloud - fog effect",[524,4999,15],{"id":526},[1701,5001,5002],{},[504,5003,5004],{},"Smoke component comes with a default texture abstraction it needs to be wrapped by a Suspense component",[504,5006,3517,5007,5009],{},[508,5008,4996],{}," component without passing any props, but still if you want you can tweak the props to find the best setup for you",[528,5011,5013],{"className":530,"code":5012,"language":532,"meta":476,"style":476},"\u003Cscript setup lang=\"ts\">\nimport { TresCanvas } from '@tresjs/core'\nimport { Smoke } from '@tresjs/cientos'\n\u003C/script>\n\n\u003Ctemplate>\n  \u003CTresCanvas>\n    \u003CTresPerspectiveCamera :position=\"[0, 3, 5]\" />\n    \u003CSuspense>\n      \u003CSmoke />\n    \u003C/Suspense>\n    \u003CTresAmbientLight />\n  \u003C/TresCanvas>\n\u003C/template>\n",[508,5014,5015,5035,5053,5072,5080,5084,5092,5100,5132,5140,5148,5156,5164,5172],{"__ignoreMap":476},[536,5016,5017,5019,5021,5023,5025,5027,5029,5031,5033],{"class":538,"line":477},[536,5018,542],{"class":541},[536,5020,546],{"class":545},[536,5022,550],{"class":549},[536,5024,553],{"class":549},[536,5026,556],{"class":541},[536,5028,559],{"class":541},[536,5030,563],{"class":562},[536,5032,559],{"class":541},[536,5034,568],{"class":541},[536,5036,5037,5039,5041,5043,5045,5047,5049,5051],{"class":538,"line":478},[536,5038,574],{"class":573},[536,5040,577],{"class":541},[536,5042,581],{"class":580},[536,5044,584],{"class":541},[536,5046,587],{"class":573},[536,5048,590],{"class":541},[536,5050,593],{"class":562},[536,5052,596],{"class":541},[536,5054,5055,5057,5059,5062,5064,5066,5068,5070],{"class":538,"line":599},[536,5056,574],{"class":573},[536,5058,577],{"class":541},[536,5060,5061],{"class":580}," Smoke",[536,5063,584],{"class":541},[536,5065,587],{"class":573},[536,5067,590],{"class":541},[536,5069,615],{"class":562},[536,5071,596],{"class":541},[536,5073,5074,5076,5078],{"class":538,"line":620},[536,5075,623],{"class":541},[536,5077,546],{"class":545},[536,5079,568],{"class":541},[536,5081,5082],{"class":538,"line":630},[536,5083,633],{"emptyLinePlaceholder":484},[536,5085,5086,5088,5090],{"class":538,"line":636},[536,5087,542],{"class":541},[536,5089,641],{"class":545},[536,5091,568],{"class":541},[536,5093,5094,5096,5098],{"class":538,"line":646},[536,5095,649],{"class":541},[536,5097,652],{"class":545},[536,5099,568],{"class":541},[536,5101,5102,5104,5106,5108,5110,5112,5114,5116,5118,5120,5122,5124,5126,5128,5130],{"class":538,"line":657},[536,5103,660],{"class":541},[536,5105,2689],{"class":545},[536,5107,1053],{"class":541},[536,5109,2368],{"class":549},[536,5111,556],{"class":541},[536,5113,559],{"class":541},[536,5115,1192],{"class":541},[536,5117,1196],{"class":1195},[536,5119,1199],{"class":541},[536,5121,2706],{"class":1195},[536,5123,1199],{"class":541},[536,5125,2381],{"class":1195},[536,5127,1220],{"class":541},[536,5129,559],{"class":541},[536,5131,1024],{"class":541},[536,5133,5134,5136,5138],{"class":538,"line":668},[536,5135,660],{"class":541},[536,5137,663],{"class":545},[536,5139,568],{"class":541},[536,5141,5142,5144,5146],{"class":538,"line":677},[536,5143,671],{"class":541},[536,5145,375],{"class":545},[536,5147,1024],{"class":541},[536,5149,5150,5152,5154],{"class":538,"line":693},[536,5151,786],{"class":541},[536,5153,663],{"class":545},[536,5155,568],{"class":541},[536,5157,5158,5160,5162],{"class":538,"line":708},[536,5159,660],{"class":541},[536,5161,2732],{"class":545},[536,5163,1024],{"class":541},[536,5165,5166,5168,5170],{"class":538,"line":720},[536,5167,796],{"class":541},[536,5169,652],{"class":545},[536,5171,568],{"class":541},[536,5173,5174,5176,5178],{"class":538,"line":732},[536,5175,623],{"class":541},[536,5177,641],{"class":545},[536,5179,568],{"class":541},[524,5181,1410],{"id":1409},[1412,5183,5184,5196],{},[1415,5185,5186],{},[1418,5187,5188,5190,5192,5194],{},[1421,5189,2056],{"align":1423},[1421,5191,2059],{"align":1423},[1421,5193,1427],{"align":1423},[1421,5195,1430],{"align":1423},[1432,5197,5198,5217,5234,5252,5270,5287,5307,5325,5343,5361],{},[1418,5199,5200,5204,5209,5212],{},[1437,5201,5202],{"align":1423},[2071,5203,2537],{},[1437,5205,5206],{"align":1423},[508,5207,5208],{},"TresColor",[1437,5210,5211],{"align":1423},"The color of the smoke.",[1437,5213,5214],{"align":1423},[508,5215,5216],{},"'#ffffff'",[1418,5218,5219,5223,5227,5230],{},[1437,5220,5221],{"align":1423},[2071,5222,4470],{},[1437,5224,5225],{"align":1423},[508,5226,2154],{},[1437,5228,5229],{"align":1423},"The strength of the opacity.",[1437,5231,5232],{"align":1423},[508,5233,4063],{},[1418,5235,5236,5240,5244,5247],{},[1437,5237,5238],{"align":1423},[2071,5239,3841],{},[1437,5241,5242],{"align":1423},[508,5243,2154],{},[1437,5245,5246],{"align":1423},"The rotation speed of the smoke.",[1437,5248,5249],{"align":1423},[508,5250,5251],{},"0.4",[1418,5253,5254,5259,5263,5266],{},[1437,5255,5256],{"align":1423},[2071,5257,5258],{},"depth",[1437,5260,5261],{"align":1423},[508,5262,2154],{},[1437,5264,5265],{"align":1423},"The base depth.",[1437,5267,5268],{"align":1423},[508,5269,3848],{},[1418,5271,5272,5276,5280,5283],{},[1437,5273,5274],{"align":1423},[2071,5275,2907],{},[1437,5277,5278],{"align":1423},[508,5279,2154],{},[1437,5281,5282],{"align":1423},"The number of smoke to render.",[1437,5284,5285],{"align":1423},[508,5286,2448],{},[1418,5288,5289,5293,5297,5300],{},[1437,5290,5291],{"align":1423},[2071,5292,972],{},[1437,5294,5295],{"align":1423},[508,5296,2172],{},[1437,5298,5299],{"align":1423},"The texture of the smoke.",[1437,5301,5302],{"align":1423},[520,5303,5306],{"href":5304,"rel":5305},"https://raw.githubusercontent.com/Tresjs/assets/main/textures/clouds/defaultCloud.png",[1695],"link",[1418,5308,5309,5314,5318,5321],{},[1437,5310,5311],{"align":1423},[2071,5312,5313],{},"depthTest",[1437,5315,5316],{"align":1423},[508,5317,2095],{},[1437,5319,5320],{"align":1423},"The depthTest.",[1437,5322,5323],{"align":1423},[508,5324,1499],{},[1418,5326,5327,5332,5336,5339],{},[1437,5328,5329],{"align":1423},[2071,5330,5331],{},"spreadY",[1437,5333,5334],{"align":1423},[508,5335,2154],{},[1437,5337,5338],{"align":1423},"Spread on the Y axis.",[1437,5340,5341],{"align":1423},[508,5342,4400],{},[1418,5344,5345,5350,5354,5357],{},[1437,5346,5347],{"align":1423},[2071,5348,5349],{},"spreadX",[1437,5351,5352],{"align":1423},[508,5353,2154],{},[1437,5355,5356],{"align":1423},"Spread on the X axis.",[1437,5358,5359],{"align":1423},[508,5360,4063],{},[1418,5362,5363,5367,5371,5373],{},[1437,5364,5365],{"align":1423},[2071,5366,2439],{},[1437,5368,5369],{"align":1423},[508,5370,2154],{},[1437,5372,2439],{"align":1423},[1437,5374,5375],{"align":1423},[508,5376,1550],{},[1272,5378,5380],{"id":5379},"default-texture","Default texture",[504,5382,5383],{},[846,5384],{"alt":5380,"src":5304},[1653,5386,2931],{},{"title":476,"searchDepth":477,"depth":478,"links":5388},[5389,5390],{"id":526,"depth":478,"text":15},{"id":1409,"depth":478,"text":1410,"children":5391},[5392],{"id":5379,"depth":599,"text":5380},"Beautiful smoke, cloud, and fog effect using textures and transparency.",{},{"title":375,"description":5393},"vwnSNX06jUUY3lZUYaNYvnoK84rsl-FxeFCuDKNEtR0",{"id":5398,"title":379,"body":5399,"description":7322,"extension":481,"links":482,"meta":7323,"navigation":484,"path":380,"seo":7324,"stem":381,"__hash__":7325},"docs/2.api/8.staging/sparkles.md",{"type":469,"value":5400,"toc":7313},[5401,5407,5409,5413,5594,5598,5601,5897,5901,5920,5948,5954,5971,6277,6281,6297,6326,6333,6664,6666,7310],[504,5402,5403,5406],{},[508,5404,5405],{},"\u003CSparkles />"," makes sparkles on your geometry's vertices – optionally guided by a directional light.",[524,5408,15],{"id":526},[1272,5410,5412],{"id":5411},"basic","Basic",[528,5414,5417],{"className":530,"code":5415,"highlights":5416,"language":532,"meta":476,"style":476},"\u003Cscript setup lang=\"ts\">\nimport { TresCanvas } from '@tresjs/core'\nimport { Sparkles } from '@tresjs/cientos'\n\u003C/script>\n\n\u003Ctemplate>\n  \u003CTresCanvas>\n    \u003CTresPerspectiveCamera :position=\"[0, 3, 5]\" />\n    \u003CTresMesh>\n      \u003CTresSphereGeometry />\n      \u003CSparkles />\n    \u003C/TresMesh>\n    \u003CTresAmbientLight />\n  \u003C/TresCanvas>\n\u003C/template>\n",[599,693],[508,5418,5419,5439,5457,5477,5485,5489,5497,5505,5537,5545,5553,5562,5570,5578,5586],{"__ignoreMap":476},[536,5420,5421,5423,5425,5427,5429,5431,5433,5435,5437],{"class":538,"line":477},[536,5422,542],{"class":541},[536,5424,546],{"class":545},[536,5426,550],{"class":549},[536,5428,553],{"class":549},[536,5430,556],{"class":541},[536,5432,559],{"class":541},[536,5434,563],{"class":562},[536,5436,559],{"class":541},[536,5438,568],{"class":541},[536,5440,5441,5443,5445,5447,5449,5451,5453,5455],{"class":538,"line":478},[536,5442,574],{"class":573},[536,5444,577],{"class":541},[536,5446,581],{"class":580},[536,5448,584],{"class":541},[536,5450,587],{"class":573},[536,5452,590],{"class":541},[536,5454,593],{"class":562},[536,5456,596],{"class":541},[536,5458,5460,5462,5464,5467,5469,5471,5473,5475],{"class":5459,"line":599},[538,915],[536,5461,574],{"class":573},[536,5463,577],{"class":541},[536,5465,5466],{"class":580}," Sparkles",[536,5468,584],{"class":541},[536,5470,587],{"class":573},[536,5472,590],{"class":541},[536,5474,615],{"class":562},[536,5476,596],{"class":541},[536,5478,5479,5481,5483],{"class":538,"line":620},[536,5480,623],{"class":541},[536,5482,546],{"class":545},[536,5484,568],{"class":541},[536,5486,5487],{"class":538,"line":630},[536,5488,633],{"emptyLinePlaceholder":484},[536,5490,5491,5493,5495],{"class":538,"line":636},[536,5492,542],{"class":541},[536,5494,641],{"class":545},[536,5496,568],{"class":541},[536,5498,5499,5501,5503],{"class":538,"line":646},[536,5500,649],{"class":541},[536,5502,652],{"class":545},[536,5504,568],{"class":541},[536,5506,5507,5509,5511,5513,5515,5517,5519,5521,5523,5525,5527,5529,5531,5533,5535],{"class":538,"line":657},[536,5508,660],{"class":541},[536,5510,2689],{"class":545},[536,5512,1053],{"class":541},[536,5514,2368],{"class":549},[536,5516,556],{"class":541},[536,5518,559],{"class":541},[536,5520,1192],{"class":541},[536,5522,1196],{"class":1195},[536,5524,1199],{"class":541},[536,5526,2706],{"class":1195},[536,5528,1199],{"class":541},[536,5530,2381],{"class":1195},[536,5532,1220],{"class":541},[536,5534,559],{"class":541},[536,5536,1024],{"class":541},[536,5538,5539,5541,5543],{"class":538,"line":668},[536,5540,660],{"class":541},[536,5542,1031],{"class":545},[536,5544,568],{"class":541},[536,5546,5547,5549,5551],{"class":538,"line":677},[536,5548,671],{"class":541},[536,5550,1041],{"class":545},[536,5552,1024],{"class":541},[536,5554,5556,5558,5560],{"class":5555,"line":693},[538,915],[536,5557,671],{"class":541},[536,5559,379],{"class":545},[536,5561,1024],{"class":541},[536,5563,5564,5566,5568],{"class":538,"line":708},[536,5565,786],{"class":541},[536,5567,1031],{"class":545},[536,5569,568],{"class":541},[536,5571,5572,5574,5576],{"class":538,"line":720},[536,5573,660],{"class":541},[536,5575,2732],{"class":545},[536,5577,1024],{"class":541},[536,5579,5580,5582,5584],{"class":538,"line":732},[536,5581,796],{"class":541},[536,5583,652],{"class":545},[536,5585,568],{"class":541},[536,5587,5588,5590,5592],{"class":538,"line":744},[536,5589,623],{"class":541},[536,5591,641],{"class":545},[536,5593,568],{"class":541},[1272,5595,5597],{"id":5596},"with-tresdirectionallight","With TresDirectionalLight",[504,5599,5600],{},"By default, sparkles appear on the up-facing vertices. However, you can pass a directional light to the component. Moving the directional light will cause \"lit\" vertices to emit sparkles.",[528,5602,5605],{"className":530,"code":5603,"highlights":5604,"language":532,"meta":476,"style":476},"\u003Cscript setup lang=\"ts\">\nimport { TresCanvas } from '@tresjs/core'\nimport { Sparkles } from '@tresjs/cientos'\nimport { shallowRef } from 'vue'\n\nconst directionalLightRef = shallowRef()\n\u003C/script>\n\n\u003Ctemplate>\n  \u003CTresCanvas>\n    \u003CTresPerspectiveCamera :position=\"[0, 3, 5]\" />\n    \u003CTresMesh>\n      \u003CTresSphereGeometry />\n      \u003CSparkles :directional-light=\"directionalLightRef\" />\n    \u003C/TresMesh>\n    \u003CTresDirectionalLight\n      ref=\"directionalLightRef\"\n      :position=\"[3, 3, 3]\"\n      :intensity=\"2\"\n    />\n    \u003CTresAmbientLight />\n  \u003C/TresCanvas>\n\u003C/template>\n",[636,732,768],[508,5606,5607,5627,5645,5663,5681,5685,5699,5707,5711,5719,5727,5759,5767,5775,5798,5806,5813,5827,5853,5867,5871,5879,5888],{"__ignoreMap":476},[536,5608,5609,5611,5613,5615,5617,5619,5621,5623,5625],{"class":538,"line":477},[536,5610,542],{"class":541},[536,5612,546],{"class":545},[536,5614,550],{"class":549},[536,5616,553],{"class":549},[536,5618,556],{"class":541},[536,5620,559],{"class":541},[536,5622,563],{"class":562},[536,5624,559],{"class":541},[536,5626,568],{"class":541},[536,5628,5629,5631,5633,5635,5637,5639,5641,5643],{"class":538,"line":478},[536,5630,574],{"class":573},[536,5632,577],{"class":541},[536,5634,581],{"class":580},[536,5636,584],{"class":541},[536,5638,587],{"class":573},[536,5640,590],{"class":541},[536,5642,593],{"class":562},[536,5644,596],{"class":541},[536,5646,5647,5649,5651,5653,5655,5657,5659,5661],{"class":538,"line":599},[536,5648,574],{"class":573},[536,5650,577],{"class":541},[536,5652,5466],{"class":580},[536,5654,584],{"class":541},[536,5656,587],{"class":573},[536,5658,590],{"class":541},[536,5660,615],{"class":562},[536,5662,596],{"class":541},[536,5664,5665,5667,5669,5671,5673,5675,5677,5679],{"class":538,"line":620},[536,5666,574],{"class":573},[536,5668,577],{"class":541},[536,5670,927],{"class":580},[536,5672,584],{"class":541},[536,5674,587],{"class":573},[536,5676,590],{"class":541},[536,5678,532],{"class":562},[536,5680,596],{"class":541},[536,5682,5683],{"class":538,"line":630},[536,5684,633],{"emptyLinePlaceholder":484},[536,5686,5688,5690,5693,5695,5697],{"class":5687,"line":636},[538,915],[536,5689,918],{"class":549},[536,5691,5692],{"class":580}," directionalLightRef ",[536,5694,556],{"class":541},[536,5696,927],{"class":926},[536,5698,930],{"class":580},[536,5700,5701,5703,5705],{"class":538,"line":646},[536,5702,623],{"class":541},[536,5704,546],{"class":545},[536,5706,568],{"class":541},[536,5708,5709],{"class":538,"line":657},[536,5710,633],{"emptyLinePlaceholder":484},[536,5712,5713,5715,5717],{"class":538,"line":668},[536,5714,542],{"class":541},[536,5716,641],{"class":545},[536,5718,568],{"class":541},[536,5720,5721,5723,5725],{"class":538,"line":677},[536,5722,649],{"class":541},[536,5724,652],{"class":545},[536,5726,568],{"class":541},[536,5728,5729,5731,5733,5735,5737,5739,5741,5743,5745,5747,5749,5751,5753,5755,5757],{"class":538,"line":693},[536,5730,660],{"class":541},[536,5732,2689],{"class":545},[536,5734,1053],{"class":541},[536,5736,2368],{"class":549},[536,5738,556],{"class":541},[536,5740,559],{"class":541},[536,5742,1192],{"class":541},[536,5744,1196],{"class":1195},[536,5746,1199],{"class":541},[536,5748,2706],{"class":1195},[536,5750,1199],{"class":541},[536,5752,2381],{"class":1195},[536,5754,1220],{"class":541},[536,5756,559],{"class":541},[536,5758,1024],{"class":541},[536,5760,5761,5763,5765],{"class":538,"line":708},[536,5762,660],{"class":541},[536,5764,1031],{"class":545},[536,5766,568],{"class":541},[536,5768,5769,5771,5773],{"class":538,"line":720},[536,5770,671],{"class":541},[536,5772,1041],{"class":545},[536,5774,1024],{"class":541},[536,5776,5778,5780,5782,5784,5787,5789,5791,5794,5796],{"class":5777,"line":732},[538,915],[536,5779,671],{"class":541},[536,5781,379],{"class":545},[536,5783,1053],{"class":541},[536,5785,5786],{"class":549},"directional-light",[536,5788,556],{"class":541},[536,5790,559],{"class":541},[536,5792,5793],{"class":580},"directionalLightRef",[536,5795,559],{"class":541},[536,5797,1024],{"class":541},[536,5799,5800,5802,5804],{"class":538,"line":744},[536,5801,786],{"class":541},[536,5803,1031],{"class":545},[536,5805,568],{"class":541},[536,5807,5808,5810],{"class":538,"line":756},[536,5809,660],{"class":541},[536,5811,5812],{"class":545},"TresDirectionalLight\n",[536,5814,5816,5819,5821,5823,5825],{"class":5815,"line":768},[538,915],[536,5817,5818],{"class":549},"      ref",[536,5820,556],{"class":541},[536,5822,559],{"class":541},[536,5824,5793],{"class":562},[536,5826,774],{"class":541},[536,5828,5829,5831,5833,5835,5837,5839,5841,5843,5845,5847,5849,5851],{"class":538,"line":777},[536,5830,3821],{"class":541},[536,5832,2368],{"class":549},[536,5834,556],{"class":541},[536,5836,559],{"class":541},[536,5838,1192],{"class":541},[536,5840,2706],{"class":1195},[536,5842,1199],{"class":541},[536,5844,2706],{"class":1195},[536,5846,1199],{"class":541},[536,5848,2706],{"class":1195},[536,5850,1220],{"class":541},[536,5852,774],{"class":541},[536,5854,5855,5857,5859,5861,5863,5865],{"class":538,"line":783},[536,5856,3821],{"class":541},[536,5858,2354],{"class":549},[536,5860,556],{"class":541},[536,5862,559],{"class":541},[536,5864,1213],{"class":1195},[536,5866,774],{"class":541},[536,5868,5869],{"class":538,"line":793},[536,5870,3872],{"class":541},[536,5872,5873,5875,5877],{"class":538,"line":803},[536,5874,660],{"class":541},[536,5876,2732],{"class":545},[536,5878,1024],{"class":541},[536,5880,5882,5884,5886],{"class":538,"line":5881},22,[536,5883,796],{"class":541},[536,5885,652],{"class":545},[536,5887,568],{"class":541},[536,5889,5891,5893,5895],{"class":538,"line":5890},23,[536,5892,623],{"class":541},[536,5894,641],{"class":545},[536,5896,568],{"class":541},[1272,5898,5900],{"id":5899},"sequences","Sequences",[504,5902,5903,5904,5907,5908,5912,5913,5915,5916,5919],{},"All props beginning with ",[508,5905,5906],{},":sequence-"," are used to define how a particle changes as it progresses ",[520,5909,5911],{"href":5910},"#mixes","(See also: Mixes)",". ",[508,5914,5906],{}," props are of the type ",[508,5917,5918],{},"Gradient\u003CT>",", which can be any one of:",[1395,5921,5922,5928,5934],{},[1398,5923,5924,5927],{},[508,5925,5926],{},"T",": a single value",[1398,5929,5930,5933],{},[508,5931,5932],{},"[T, T, T, ...]",": an evenly distributed series of values",[1398,5935,5936,5939,5940,5942,5943,5945,5946,515],{},[508,5937,5938],{},"[[number, T], [number, T], ...]",": an unevently distributed series of values, where ",[508,5941,2154],{}," is a gradient \"stop\" from ",[508,5944,1196],{}," to ",[508,5947,1550],{},[504,5949,5950,5951,1800],{},"For example, all of these are acceptable values for ",[508,5952,5953],{},"Gradient\u003CTresColor>",[1395,5955,5956,5961,5966],{},[1398,5957,5958],{},[508,5959,5960],{},"'red'",[1398,5962,5963],{},[508,5964,5965],{},"['red', 'blue', 'green']",[1398,5967,5968],{},[508,5969,5970],{},"[[0.1, 'red'], [0.25, 'blue'], [0.5, 'green']]",[528,5972,5975],{"className":530,"code":5973,"highlights":5974,"language":532,"meta":476,"style":476},"\u003Cscript setup lang=\"ts\">\nimport { TresCanvas } from '@tresjs/core'\nimport { Sparkles } from '@tresjs/cientos'\n\u003C/script>\n\n\u003Ctemplate>\n  \u003CTresCanvas>\n    \u003CTresPerspectiveCamera :position=\"[0, 3, 5]\" />\n    \u003CTresMesh>\n      \u003CTresSphereGeometry />\n      \u003CSparkles\n        :sequence-color=\"['red', 'blue', 'green']\"\n        :sequence-alpha=\"[[0.0, 0.0], [0.10, 1.0], [0.5, 1.0], [0.9, 0.0]]\"\n        :sequence-size=\"[0.0, 1.0, 0.5]\"\n      />\n    \u003C/TresMesh>\n    \u003CTresAmbientLight />\n  \u003C/TresCanvas>\n\u003C/template>\n",[693,708,720,732],[508,5976,5977,5997,6015,6033,6041,6045,6053,6061,6093,6101,6109,6117,6160,6213,6241,6245,6253,6261,6269],{"__ignoreMap":476},[536,5978,5979,5981,5983,5985,5987,5989,5991,5993,5995],{"class":538,"line":477},[536,5980,542],{"class":541},[536,5982,546],{"class":545},[536,5984,550],{"class":549},[536,5986,553],{"class":549},[536,5988,556],{"class":541},[536,5990,559],{"class":541},[536,5992,563],{"class":562},[536,5994,559],{"class":541},[536,5996,568],{"class":541},[536,5998,5999,6001,6003,6005,6007,6009,6011,6013],{"class":538,"line":478},[536,6000,574],{"class":573},[536,6002,577],{"class":541},[536,6004,581],{"class":580},[536,6006,584],{"class":541},[536,6008,587],{"class":573},[536,6010,590],{"class":541},[536,6012,593],{"class":562},[536,6014,596],{"class":541},[536,6016,6017,6019,6021,6023,6025,6027,6029,6031],{"class":538,"line":599},[536,6018,574],{"class":573},[536,6020,577],{"class":541},[536,6022,5466],{"class":580},[536,6024,584],{"class":541},[536,6026,587],{"class":573},[536,6028,590],{"class":541},[536,6030,615],{"class":562},[536,6032,596],{"class":541},[536,6034,6035,6037,6039],{"class":538,"line":620},[536,6036,623],{"class":541},[536,6038,546],{"class":545},[536,6040,568],{"class":541},[536,6042,6043],{"class":538,"line":630},[536,6044,633],{"emptyLinePlaceholder":484},[536,6046,6047,6049,6051],{"class":538,"line":636},[536,6048,542],{"class":541},[536,6050,641],{"class":545},[536,6052,568],{"class":541},[536,6054,6055,6057,6059],{"class":538,"line":646},[536,6056,649],{"class":541},[536,6058,652],{"class":545},[536,6060,568],{"class":541},[536,6062,6063,6065,6067,6069,6071,6073,6075,6077,6079,6081,6083,6085,6087,6089,6091],{"class":538,"line":657},[536,6064,660],{"class":541},[536,6066,2689],{"class":545},[536,6068,1053],{"class":541},[536,6070,2368],{"class":549},[536,6072,556],{"class":541},[536,6074,559],{"class":541},[536,6076,1192],{"class":541},[536,6078,1196],{"class":1195},[536,6080,1199],{"class":541},[536,6082,2706],{"class":1195},[536,6084,1199],{"class":541},[536,6086,2381],{"class":1195},[536,6088,1220],{"class":541},[536,6090,559],{"class":541},[536,6092,1024],{"class":541},[536,6094,6095,6097,6099],{"class":538,"line":668},[536,6096,660],{"class":541},[536,6098,1031],{"class":545},[536,6100,568],{"class":541},[536,6102,6103,6105,6107],{"class":538,"line":677},[536,6104,671],{"class":541},[536,6106,1041],{"class":545},[536,6108,1024],{"class":541},[536,6110,6112,6114],{"class":6111,"line":693},[538,915],[536,6113,671],{"class":541},[536,6115,6116],{"class":545},"Sparkles\n",[536,6118,6120,6122,6125,6127,6129,6131,6133,6136,6138,6140,6142,6145,6147,6149,6151,6154,6156,6158],{"class":6119,"line":708},[538,915],[536,6121,680],{"class":541},[536,6123,6124],{"class":549},"sequence-color",[536,6126,556],{"class":541},[536,6128,559],{"class":541},[536,6130,1192],{"class":541},[536,6132,702],{"class":541},[536,6134,6135],{"class":562},"red",[536,6137,702],{"class":541},[536,6139,1199],{"class":541},[536,6141,702],{"class":541},[536,6143,6144],{"class":562},"blue",[536,6146,702],{"class":541},[536,6148,1199],{"class":541},[536,6150,702],{"class":541},[536,6152,6153],{"class":562},"green",[536,6155,702],{"class":541},[536,6157,1220],{"class":541},[536,6159,774],{"class":541},[536,6161,6163,6165,6168,6170,6172,6175,6177,6179,6181,6184,6187,6189,6191,6193,6195,6197,6199,6201,6204,6206,6208,6211],{"class":6162,"line":720},[538,915],[536,6164,680],{"class":541},[536,6166,6167],{"class":549},"sequence-alpha",[536,6169,556],{"class":541},[536,6171,559],{"class":541},[536,6173,6174],{"class":541},"[[",[536,6176,3456],{"class":1195},[536,6178,1199],{"class":541},[536,6180,3456],{"class":1195},[536,6182,6183],{"class":541},"], [",[536,6185,6186],{"class":1195},"0.10",[536,6188,1199],{"class":541},[536,6190,3469],{"class":1195},[536,6192,6183],{"class":541},[536,6194,4063],{"class":1195},[536,6196,1199],{"class":541},[536,6198,3469],{"class":1195},[536,6200,6183],{"class":541},[536,6202,6203],{"class":1195},"0.9",[536,6205,1199],{"class":541},[536,6207,3456],{"class":1195},[536,6209,6210],{"class":541},"]]",[536,6212,774],{"class":541},[536,6214,6216,6218,6221,6223,6225,6227,6229,6231,6233,6235,6237,6239],{"class":6215,"line":732},[538,915],[536,6217,680],{"class":541},[536,6219,6220],{"class":549},"sequence-size",[536,6222,556],{"class":541},[536,6224,559],{"class":541},[536,6226,1192],{"class":541},[536,6228,3456],{"class":1195},[536,6230,1199],{"class":541},[536,6232,3469],{"class":1195},[536,6234,1199],{"class":541},[536,6236,4063],{"class":1195},[536,6238,1220],{"class":541},[536,6240,774],{"class":541},[536,6242,6243],{"class":538,"line":744},[536,6244,780],{"class":541},[536,6246,6247,6249,6251],{"class":538,"line":756},[536,6248,786],{"class":541},[536,6250,1031],{"class":545},[536,6252,568],{"class":541},[536,6254,6255,6257,6259],{"class":538,"line":768},[536,6256,660],{"class":541},[536,6258,2732],{"class":545},[536,6260,1024],{"class":541},[536,6262,6263,6265,6267],{"class":538,"line":777},[536,6264,796],{"class":541},[536,6266,652],{"class":545},[536,6268,568],{"class":541},[536,6270,6271,6273,6275],{"class":538,"line":783},[536,6272,623],{"class":541},[536,6274,641],{"class":545},[536,6276,568],{"class":541},[1272,6278,6280],{"id":6279},"mixes","Mixes",[504,6282,5903,6283,6286,6287,6289,6290,6293,6294,515],{},[508,6284,6285],{},":mix-"," allow you to specify how a particle \"progresses\" through a corresponding ",[508,6288,5906],{}," prop. E.g., ",[508,6291,6292],{},":mix-alpha"," affects ",[508,6295,6296],{},":sequence-alpha",[1395,6298,6299,6317],{},[1398,6300,6301,6302,6304,6305,6307,6308,6310,6311],{},"If the ",[508,6303,6285],{}," prop is ",[508,6306,3456],{},", 'progress' through the ",[508,6309,5906],{}," is determined entirely by the light shining on the surface of the sparkling mesh.",[520,6312,6314],{"href":6313},"#precisely",[6315,6316,1550],"sup",{},[1398,6318,6301,6319,6304,6321,6307,6323,6325],{},[508,6320,6285],{},[508,6322,3469],{},[508,6324,5906],{}," is determined entirely by the particle's lifetime.",[504,6327,6328,6329,6332],{},"More precisely, the value is determined by the dot product of the ",[508,6330,6331],{},"directionalLight","'s inverted normalized position and each of the sparkling mesh's vertex normals.",[528,6334,6337],{"className":530,"code":6335,"highlights":6336,"language":532,"meta":476,"style":476},"\u003Cscript setup lang=\"ts\">\nimport { TresCanvas } from '@tresjs/core'\nimport { Sparkles } from '@tresjs/cientos'\nimport { shallowRef } from 'vue'\n\nconst directionalLightRef = shallowRef()\n\u003C/script>\n\n\u003Ctemplate>\n  \u003CTresCanvas>\n    \u003CTresPerspectiveCamera :position=\"[0, 3, 5]\" />\n    \u003CTresMesh>\n      \u003CTresSphereGeometry />\n      \u003CSparkles\n        :directional-light=\"directionalLightRef\"\n        :mix-color=\"0.8\"\n        :mix-alpha=\"0.5\"\n        :mix-size=\"0.2\"\n      />\n    \u003C/TresMesh>\n    \u003CTresDirectionalLight\n      ref=\"directionalLightRef\"\n      :position=\"[3, 3, 3]\"\n    />\n    \u003CTresAmbientLight />\n  \u003C/TresCanvas>\n\u003C/template>\n",[599,732,744,756,768,777],[508,6338,6339,6359,6377,6396,6414,6418,6430,6438,6442,6450,6458,6490,6498,6506,6513,6528,6544,6560,6576,6580,6588,6594,6606,6632,6637,6646,6655],{"__ignoreMap":476},[536,6340,6341,6343,6345,6347,6349,6351,6353,6355,6357],{"class":538,"line":477},[536,6342,542],{"class":541},[536,6344,546],{"class":545},[536,6346,550],{"class":549},[536,6348,553],{"class":549},[536,6350,556],{"class":541},[536,6352,559],{"class":541},[536,6354,563],{"class":562},[536,6356,559],{"class":541},[536,6358,568],{"class":541},[536,6360,6361,6363,6365,6367,6369,6371,6373,6375],{"class":538,"line":478},[536,6362,574],{"class":573},[536,6364,577],{"class":541},[536,6366,581],{"class":580},[536,6368,584],{"class":541},[536,6370,587],{"class":573},[536,6372,590],{"class":541},[536,6374,593],{"class":562},[536,6376,596],{"class":541},[536,6378,6380,6382,6384,6386,6388,6390,6392,6394],{"class":6379,"line":599},[538,915],[536,6381,574],{"class":573},[536,6383,577],{"class":541},[536,6385,5466],{"class":580},[536,6387,584],{"class":541},[536,6389,587],{"class":573},[536,6391,590],{"class":541},[536,6393,615],{"class":562},[536,6395,596],{"class":541},[536,6397,6398,6400,6402,6404,6406,6408,6410,6412],{"class":538,"line":620},[536,6399,574],{"class":573},[536,6401,577],{"class":541},[536,6403,927],{"class":580},[536,6405,584],{"class":541},[536,6407,587],{"class":573},[536,6409,590],{"class":541},[536,6411,532],{"class":562},[536,6413,596],{"class":541},[536,6415,6416],{"class":538,"line":630},[536,6417,633],{"emptyLinePlaceholder":484},[536,6419,6420,6422,6424,6426,6428],{"class":538,"line":636},[536,6421,918],{"class":549},[536,6423,5692],{"class":580},[536,6425,556],{"class":541},[536,6427,927],{"class":926},[536,6429,930],{"class":580},[536,6431,6432,6434,6436],{"class":538,"line":646},[536,6433,623],{"class":541},[536,6435,546],{"class":545},[536,6437,568],{"class":541},[536,6439,6440],{"class":538,"line":657},[536,6441,633],{"emptyLinePlaceholder":484},[536,6443,6444,6446,6448],{"class":538,"line":668},[536,6445,542],{"class":541},[536,6447,641],{"class":545},[536,6449,568],{"class":541},[536,6451,6452,6454,6456],{"class":538,"line":677},[536,6453,649],{"class":541},[536,6455,652],{"class":545},[536,6457,568],{"class":541},[536,6459,6460,6462,6464,6466,6468,6470,6472,6474,6476,6478,6480,6482,6484,6486,6488],{"class":538,"line":693},[536,6461,660],{"class":541},[536,6463,2689],{"class":545},[536,6465,1053],{"class":541},[536,6467,2368],{"class":549},[536,6469,556],{"class":541},[536,6471,559],{"class":541},[536,6473,1192],{"class":541},[536,6475,1196],{"class":1195},[536,6477,1199],{"class":541},[536,6479,2706],{"class":1195},[536,6481,1199],{"class":541},[536,6483,2381],{"class":1195},[536,6485,1220],{"class":541},[536,6487,559],{"class":541},[536,6489,1024],{"class":541},[536,6491,6492,6494,6496],{"class":538,"line":708},[536,6493,660],{"class":541},[536,6495,1031],{"class":545},[536,6497,568],{"class":541},[536,6499,6500,6502,6504],{"class":538,"line":720},[536,6501,671],{"class":541},[536,6503,1041],{"class":545},[536,6505,1024],{"class":541},[536,6507,6509,6511],{"class":6508,"line":732},[538,915],[536,6510,671],{"class":541},[536,6512,6116],{"class":545},[536,6514,6516,6518,6520,6522,6524,6526],{"class":6515,"line":744},[538,915],[536,6517,680],{"class":541},[536,6519,5786],{"class":549},[536,6521,556],{"class":541},[536,6523,559],{"class":541},[536,6525,5793],{"class":580},[536,6527,774],{"class":541},[536,6529,6531,6533,6536,6538,6540,6542],{"class":6530,"line":756},[538,915],[536,6532,680],{"class":541},[536,6534,6535],{"class":549},"mix-color",[536,6537,556],{"class":541},[536,6539,559],{"class":541},[536,6541,4476],{"class":1195},[536,6543,774],{"class":541},[536,6545,6547,6549,6552,6554,6556,6558],{"class":6546,"line":768},[538,915],[536,6548,680],{"class":541},[536,6550,6551],{"class":549},"mix-alpha",[536,6553,556],{"class":541},[536,6555,559],{"class":541},[536,6557,4063],{"class":1195},[536,6559,774],{"class":541},[536,6561,6563,6565,6568,6570,6572,6574],{"class":6562,"line":777},[538,915],[536,6564,680],{"class":541},[536,6566,6567],{"class":549},"mix-size",[536,6569,556],{"class":541},[536,6571,559],{"class":541},[536,6573,4303],{"class":1195},[536,6575,774],{"class":541},[536,6577,6578],{"class":538,"line":783},[536,6579,780],{"class":541},[536,6581,6582,6584,6586],{"class":538,"line":793},[536,6583,786],{"class":541},[536,6585,1031],{"class":545},[536,6587,568],{"class":541},[536,6589,6590,6592],{"class":538,"line":803},[536,6591,660],{"class":541},[536,6593,5812],{"class":545},[536,6595,6596,6598,6600,6602,6604],{"class":538,"line":5881},[536,6597,5818],{"class":549},[536,6599,556],{"class":541},[536,6601,559],{"class":541},[536,6603,5793],{"class":562},[536,6605,774],{"class":541},[536,6607,6608,6610,6612,6614,6616,6618,6620,6622,6624,6626,6628,6630],{"class":538,"line":5890},[536,6609,3821],{"class":541},[536,6611,2368],{"class":549},[536,6613,556],{"class":541},[536,6615,559],{"class":541},[536,6617,1192],{"class":541},[536,6619,2706],{"class":1195},[536,6621,1199],{"class":541},[536,6623,2706],{"class":1195},[536,6625,1199],{"class":541},[536,6627,2706],{"class":1195},[536,6629,1220],{"class":541},[536,6631,774],{"class":541},[536,6633,6635],{"class":538,"line":6634},24,[536,6636,3872],{"class":541},[536,6638,6640,6642,6644],{"class":538,"line":6639},25,[536,6641,660],{"class":541},[536,6643,2732],{"class":545},[536,6645,1024],{"class":541},[536,6647,6649,6651,6653],{"class":538,"line":6648},26,[536,6650,796],{"class":541},[536,6652,652],{"class":545},[536,6654,568],{"class":541},[536,6656,6658,6660,6662],{"class":538,"line":6657},27,[536,6659,623],{"class":541},[536,6661,641],{"class":545},[536,6663,568],{"class":541},[524,6665,1410],{"id":1409},[1412,6667,6668,6676],{},[1415,6669,6670],{},[1418,6671,6672,6674],{},[1421,6673,2056],{"align":1423},[1421,6675,1427],{"align":1423},[1432,6677,6678,6702,6736,6759,6779,6800,6820,6841,6861,6881,6901,6920,6939,6959,6979,7007,7029,7051,7072,7093,7114,7148,7169,7189,7210,7230,7250,7272,7291],{},[1418,6679,6680,6684],{},[1437,6681,6682],{"align":1423},[2071,6683,4432],{},[1437,6685,6686,6687,6690,6693,6694,6697,6699,6701],{"align":1423},"Type: ",[508,6688,6689],{},"Texture | string",[6691,6692],"br",{},"Default: ",[508,6695,6696],{},"'https://raw.githubusercontent.com/Tresjs/asset...'",[6691,6698],{},[6691,6700],{},"Texture or image path for individual sparkles",[1418,6703,6704,6709],{},[1437,6705,6706],{"align":1423},[2071,6707,6708],{},"geometry",[1437,6710,6686,6711,6714,6693,6716,6718,6720,6722,6723,6725],{"align":1423},[508,6712,6713],{},"Object3D | BufferGeometry",[6691,6715],{},[508,6717,1448],{},[6691,6719],{},[6691,6721],{},"Vertices of the geometry will be used to emit sparkles. Geometry normals are used for sparkles' traveling direction and for responding to the directional light prop.",[6691,6724],{},[1395,6726,6727,6730,6733],{},[1398,6728,6729],{},"If provided, the component will use the passed geometry.",[1398,6731,6732],{},"If no geometry is provided, the component will try to make a copy of the parent object's geometry.",[1398,6734,6735],{},"If no parent geometry exists, the component will create and use an IcosphereGeometry.",[1418,6737,6738,6742],{},[1437,6739,6740],{"align":1423},[2071,6741,6331],{},[1437,6743,6686,6744,6747,6693,6749,6751,6753,6755,6756,6758],{"align":1423},[508,6745,6746],{},"Object3D",[6691,6748],{},[508,6750,1448],{},[6691,6752],{},[6691,6754],{},"Particles \"light up\" when their normal \"faces\" the light. If no ",[508,6757,6331],{}," is provided, the default \"up\" vector will be used.",[1418,6760,6761,6766],{},[1437,6762,6763],{"align":1423},[2071,6764,6765],{},"lifetimeSec",[1437,6767,6686,6768,6770,6693,6772,6774,6776,6778],{"align":1423},[508,6769,2154],{},[6691,6771],{},[508,6773,5251],{},[6691,6775],{},[6691,6777],{},"Particle lifetime in seconds",[1418,6780,6781,6786],{},[1437,6782,6783],{"align":1423},[2071,6784,6785],{},"cooldownSec",[1437,6787,6686,6788,6790,6693,6792,6795,6797,6799],{"align":1423},[508,6789,2154],{},[6691,6791],{},[508,6793,6794],{},"2.0",[6691,6796],{},[6691,6798],{},"Particle cooldown in seconds – time between lifetime end and respawn",[1418,6801,6802,6807],{},[1437,6803,6804],{"align":1423},[2071,6805,6806],{},"normalThreshold",[1437,6808,6686,6809,6811,6693,6813,6815,6817,6819],{"align":1423},[508,6810,2154],{},[6691,6812],{},[508,6814,4901],{},[6691,6816],{},[6691,6818],{},"Number from 0-1 indicating how closely the particle needs to be faced towards the light to \"light up\". (Lower == more flexible)",[1418,6821,6822,6827],{},[1437,6823,6824],{"align":1423},[2071,6825,6826],{},"noiseScale",[1437,6828,6686,6829,6831,6693,6833,6836,6838,6840],{"align":1423},[508,6830,2154],{},[6691,6832],{},[508,6834,6835],{},"3.0",[6691,6837],{},[6691,6839],{},"Scale of the noise period (lower == more slowly cycling noise)",[1418,6842,6843,6848],{},[1437,6844,6845],{"align":1423},[2071,6846,6847],{},"scaleNoise",[1437,6849,6686,6850,6852,6693,6854,6856,6858,6860],{"align":1423},[508,6851,2154],{},[6691,6853],{},[508,6855,3469],{},[6691,6857],{},[6691,6859],{},"Noise coefficient applied to particle scale",[1418,6862,6863,6868],{},[1437,6864,6865],{"align":1423},[2071,6866,6867],{},"offsetNoise",[1437,6869,6686,6870,6872,6693,6874,6876,6878,6880],{"align":1423},[508,6871,2154],{},[6691,6873],{},[508,6875,4400],{},[6691,6877],{},[6691,6879],{},"Noise coefficient applied to particle offset",[1418,6882,6883,6888],{},[1437,6884,6885],{"align":1423},[2071,6886,6887],{},"lifetimeNoise",[1437,6889,6686,6890,6892,6693,6894,6896,6898,6900],{"align":1423},[508,6891,2154],{},[6691,6893],{},[508,6895,3456],{},[6691,6897],{},[6691,6899],{},"Noise coefficient applied to particle lifetime",[1418,6902,6903,6907],{},[1437,6904,6905],{"align":1423},[2071,6906,3438],{},[1437,6908,6686,6909,6911,6693,6913,6915,6917,6919],{"align":1423},[508,6910,2154],{},[6691,6912],{},[508,6914,3469],{},[6691,6916],{},[6691,6918],{},"Particle scale multiplier",[1418,6921,6922,6926],{},[1437,6923,6924],{"align":1423},[2071,6925,3463],{},[1437,6927,6686,6928,6930,6693,6932,6934,6936,6938],{"align":1423},[508,6929,2154],{},[6691,6931],{},[508,6933,3469],{},[6691,6935],{},[6691,6937],{},"Opacity multiplier",[1418,6940,6941,6946],{},[1437,6942,6943],{"align":1423},[2071,6944,6945],{},"offset",[1437,6947,6686,6948,6950,6693,6952,6954,6956,6958],{"align":1423},[508,6949,2154],{},[6691,6951],{},[508,6953,3469],{},[6691,6955],{},[6691,6957],{},"Offset multiplier",[1418,6960,6961,6966],{},[1437,6962,6963],{"align":1423},[2071,6964,6965],{},"surfaceDistance",[1437,6967,6686,6968,6970,6693,6972,6974,6976,6978],{"align":1423},[508,6969,2154],{},[6691,6971],{},[508,6973,3469],{},[6691,6975],{},[6691,6977],{},"Surface distance multiplier",[1418,6980,6981,6986],{},[1437,6982,6983],{"align":1423},[2071,6984,6985],{},"sequenceColor",[1437,6987,6686,6988,6990,6693,6992,6995,6997,702,6999,7003,7004,7006],{"align":1423},[508,6989,5953],{},[6691,6991],{},[508,6993,6994],{},"[[0.7, '#82dbc5'], [0.8, '#fbb03b']]",[6691,6996],{},[6691,6998],{},[7000,7001,7002],"em",{},"Sequence' props: specify how a particle changes as it \"progresses\". See also \"mix","\" props.",[6691,7005],{},"Color sequence as particles progress",[1418,7008,7009,7014],{},[1437,7010,7011],{"align":1423},[2071,7012,7013],{},"sequenceAlpha",[1437,7015,6686,7016,7019,6693,7021,7024,7026,7028],{"align":1423},[508,7017,7018],{},"Gradient\u003Cnumber>",[6691,7020],{},[508,7022,7023],{},"[[0.0, 0.0], [0.10, 1.0], [0.5, 1.0], [0.9, 0.0]]",[6691,7025],{},[6691,7027],{},"Opacity sequence as particles progress",[1418,7030,7031,7036],{},[1437,7032,7033],{"align":1423},[2071,7034,7035],{},"sequenceOffset",[1437,7037,6686,7038,7041,6693,7043,7046,7048,7050],{"align":1423},[508,7039,7040],{},"Gradient\u003C[number, number, number]>",[6691,7042],{},[508,7044,7045],{},"[0.0, 0.0, 0.0]",[6691,7047],{},[6691,7049],{},"Distance sequence as particles progress",[1418,7052,7053,7058],{},[1437,7054,7055],{"align":1423},[2071,7056,7057],{},"sequenceNoise",[1437,7059,6686,7060,7062,6693,7064,7067,7069,7071],{"align":1423},[508,7061,7040],{},[6691,7063],{},[508,7065,7066],{},"[0.1, 0.1, 0.1]",[6691,7068],{},[6691,7070],{},"Noise sequence as particles progress",[1418,7073,7074,7079],{},[1437,7075,7076],{"align":1423},[2071,7077,7078],{},"sequenceSize",[1437,7080,6686,7081,7083,6693,7085,7088,7090,7092],{"align":1423},[508,7082,7018],{},[6691,7084],{},[508,7086,7087],{},"[0.0, 1.0]",[6691,7089],{},[6691,7091],{},"Size sequence as particles progress",[1418,7094,7095,7100],{},[1437,7096,7097],{"align":1423},[2071,7098,7099],{},"sequenceSurfaceDistance",[1437,7101,6686,7102,7104,6693,7106,7109,7111,7113],{"align":1423},[508,7103,7018],{},[6691,7105],{},[508,7107,7108],{},"[0.05, 0.08, 0.1]",[6691,7110],{},[6691,7112],{},"Distance from surface (along normal) as particles progress",[1418,7115,7116,7121],{},[1437,7117,7118],{"align":1423},[2071,7119,7120],{},"mixColor",[1437,7122,6686,7123,7125,6693,7127,7129,7131,7133,7134,7136,7144,7145,7147],{"align":1423},[508,7124,2154],{},[6691,7126],{},[508,7128,4063],{},[6691,7130],{},[6691,7132],{},"'mix*' props: A particle \"progresses\" with a mix of two factors:",[6691,7135],{},[1395,7137,7138,7141],{},[1398,7139,7140],{},"its normal \"facing\" the directionalLight",[1398,7142,7143],{},"its lifetime","'mix*' props specify the relationship between the two factors.",[6691,7146],{},"How is a particle's progress for color calculated? (0: normal, 1: particle lifetime)",[1418,7149,7150,7155],{},[1437,7151,7152],{"align":1423},[2071,7153,7154],{},"mixAlpha",[1437,7156,6686,7157,7159,6693,7161,7164,7166,7168],{"align":1423},[508,7158,2154],{},[6691,7160],{},[508,7162,7163],{},"1.",[6691,7165],{},[6691,7167],{},"How is a particle's progress for alpha calculated? (0: normal, 1: particle lifetime)",[1418,7170,7171,7176],{},[1437,7172,7173],{"align":1423},[2071,7174,7175],{},"mixOffset",[1437,7177,6686,7178,7180,6693,7182,7184,7186,7188],{"align":1423},[508,7179,2154],{},[6691,7181],{},[508,7183,7163],{},[6691,7185],{},[6691,7187],{},"How is a particle's progress for offset calculated? (0: normal, 1: particle lifetime)",[1418,7190,7191,7196],{},[1437,7192,7193],{"align":1423},[2071,7194,7195],{},"mixSize",[1437,7197,6686,7198,7200,6693,7202,7205,7207,7209],{"align":1423},[508,7199,2154],{},[6691,7201],{},[508,7203,7204],{},"0.",[6691,7206],{},[6691,7208],{},"How is a particle's progress for size calculated? (0: normal, 1: particle lifetime)",[1418,7211,7212,7217],{},[1437,7213,7214],{"align":1423},[2071,7215,7216],{},"mixSurfaceDistance",[1437,7218,6686,7219,7221,6693,7223,7225,7227,7229],{"align":1423},[508,7220,2154],{},[6691,7222],{},[508,7224,7163],{},[6691,7226],{},[6691,7228],{},"How is a particle's progress for surface distance calculated? (0: normal, 1: particle lifetime)",[1418,7231,7232,7237],{},[1437,7233,7234],{"align":1423},[2071,7235,7236],{},"mixNoise",[1437,7238,6686,7239,7241,6693,7243,7245,7247,7249],{"align":1423},[508,7240,2154],{},[6691,7242],{},[508,7244,7163],{},[6691,7246],{},[6691,7248],{},"How is a particle's progress for lifetime calculated? (0: normal, 1: particle lifetime)",[1418,7251,7252,7257],{},[1437,7253,7254],{"align":1423},[2071,7255,7256],{},"blending",[1437,7258,6686,7259,7262,6693,7264,7267,7269,7271],{"align":1423},[508,7260,7261],{},"Blending",[6691,7263],{},[508,7265,7266],{},"AdditiveBlending",[6691,7268],{},[6691,7270],{},"Material blending",[1418,7273,7274,7278],{},[1437,7275,7276],{"align":1423},[2071,7277,4529],{},[1437,7279,6686,7280,7282,6693,7284,7286,7288,7290],{"align":1423},[508,7281,2095],{},[6691,7283],{},[508,7285,1176],{},[6691,7287],{},[6691,7289],{},"Material transparency",[1418,7292,7293,7297],{},[1437,7294,7295],{"align":1423},[2071,7296,4517],{},[1437,7298,6686,7299,7301,6693,7303,7305,7307,7309],{"align":1423},[508,7300,2095],{},[6691,7302],{},[508,7304,1499],{},[6691,7306],{},[6691,7308],{},"Material depth write",[1653,7311,7312],{},"html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html pre.shiki code .s7zQu, html code.shiki .s7zQu{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html pre.shiki code .sbssI, html code.shiki .sbssI{--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}",{"title":476,"searchDepth":477,"depth":478,"links":7314},[7315,7321],{"id":526,"depth":478,"text":15,"children":7316},[7317,7318,7319,7320],{"id":5411,"depth":599,"text":5412},{"id":5596,"depth":599,"text":5597},{"id":5899,"depth":599,"text":5900},{"id":6279,"depth":599,"text":6280},{"id":1409,"depth":478,"text":1410},"Makes sparkles on geometry vertices, optionally guided by directional light.",{},{"title":379,"description":7322},"sidh_wQDMKRUeYy0-MM8UB_NfCo4ClPtPAjr8qECGps",{"id":7327,"title":383,"body":7328,"description":8029,"extension":481,"links":482,"meta":8030,"navigation":484,"path":384,"seo":8031,"stem":385,"__hash__":8032},"docs/2.api/8.staging/stage.md",{"type":469,"value":7329,"toc":8023},[7330,7335,7338,7352,7374,7427,7429,7801,7803,7915,7919,7922,8007,8020],[1675,7331,7332],{},[7333,7334],"staging-stage",{},[504,7336,7337],{},"This component creates a \"stage\" for your models. It sets up:",[1395,7339,7340,7343,7346,7349],{},[1398,7341,7342],{},"model lighting",[1398,7344,7345],{},"ground shadows",[1398,7347,7348],{},"zoom to fit",[1398,7350,7351],{},"environment",[7353,7354,7355,7358],"prose-note",{},[504,7356,7357],{},"If you are using other camera controls, be sure to make them the 'default'.",[528,7359,7361],{"className":530,"code":7360,"language":532,"meta":476,"style":476},"\u003COrbitControls make-default />\n",[508,7362,7363],{"__ignoreMap":476},[536,7364,7365,7367,7369,7372],{"class":538,"line":477},[536,7366,542],{"class":541},[536,7368,4741],{"class":545},[536,7370,7371],{"class":549}," make-default",[536,7373,1024],{"class":541},[7353,7375,7376,7379,7395],{},[504,7377,7378],{},"If you are using shadows='accumulative', enable shadows on your canvas and on your objects.",[528,7380,7382],{"className":530,"code":7381,"language":532,"meta":476,"style":476},"\u003CTresCanvas shadows />\n",[508,7383,7384],{"__ignoreMap":476},[536,7385,7386,7388,7390,7393],{"class":538,"line":477},[536,7387,542],{"class":541},[536,7389,652],{"class":545},[536,7391,7392],{"class":549}," shadows",[536,7394,1024],{"class":541},[528,7396,7398],{"className":530,"code":7397,"language":532,"meta":476,"style":476},"\u003CTresMesh cast-shadow />\n  ...\n\u003C/TresMesh>\n",[508,7399,7400,7411,7416],{"__ignoreMap":476},[536,7401,7402,7404,7406,7409],{"class":538,"line":477},[536,7403,542],{"class":541},[536,7405,1031],{"class":545},[536,7407,7408],{"class":549}," cast-shadow",[536,7410,1024],{"class":541},[536,7412,7413],{"class":538,"line":478},[536,7414,7415],{"class":580},"  ...\n",[536,7417,7418,7420,7423,7425],{"class":538,"line":599},[536,7419,542],{"class":541},[536,7421,7422],{"class":580},"/",[536,7424,1031],{"class":545},[536,7426,568],{"class":541},[524,7428,15],{"id":526},[528,7430,7433],{"className":530,"code":7431,"highlights":7432,"language":532,"meta":476,"style":476},"\u003Cscript setup lang=\"ts\">\nimport { TresCanvas } from '@tresjs/core'\nimport { Stage, OrbitControls, Plane } from '@tresjs/cientos'\n\u003C/script>\n\n\u003Ctemplate>\n  \u003CTresCanvas shadows>\n    \u003CTresPerspectiveCamera :position=\"[0, 3, 5]\" />\n    \u003COrbitControls make-default />\n    \u003CStage\n      lighting=\"rembrandt\"\n      shadows=\"contact\"\n      :adjust-camera=\"true\"\n      environment=\"city\"\n      :intensity=\"0.5\"\n    >\n      \u003CTresMesh cast-shadow>\n        \u003CTresBoxGeometry />\n        \u003CTresMeshStandardMaterial color=\"orange\" />\n      \u003C/TresMesh>\n      \u003CPlane :position=\"[0, -2, 0]\" receive-shadow :args=\"[5, 5]\">\n        \u003CTresMeshStandardMaterial />\n      \u003C/Plane>\n    \u003C/Stage>\n  \u003C/TresCanvas>\n\u003C/template>\n",[599,677,693,708,720,732,744],[508,7434,7435,7455,7473,7502,7510,7514,7522,7532,7564,7574,7582,7597,7612,7628,7642,7657,7662,7672,7681,7699,7707,7761,7769,7777,7785,7793],{"__ignoreMap":476},[536,7436,7437,7439,7441,7443,7445,7447,7449,7451,7453],{"class":538,"line":477},[536,7438,542],{"class":541},[536,7440,546],{"class":545},[536,7442,550],{"class":549},[536,7444,553],{"class":549},[536,7446,556],{"class":541},[536,7448,559],{"class":541},[536,7450,563],{"class":562},[536,7452,559],{"class":541},[536,7454,568],{"class":541},[536,7456,7457,7459,7461,7463,7465,7467,7469,7471],{"class":538,"line":478},[536,7458,574],{"class":573},[536,7460,577],{"class":541},[536,7462,581],{"class":580},[536,7464,584],{"class":541},[536,7466,587],{"class":573},[536,7468,590],{"class":541},[536,7470,593],{"class":562},[536,7472,596],{"class":541},[536,7474,7476,7478,7480,7483,7485,7487,7489,7492,7494,7496,7498,7500],{"class":7475,"line":599},[538,915],[536,7477,574],{"class":573},[536,7479,577],{"class":541},[536,7481,7482],{"class":580}," Stage",[536,7484,946],{"class":541},[536,7486,4617],{"class":580},[536,7488,946],{"class":541},[536,7490,7491],{"class":580}," Plane",[536,7493,584],{"class":541},[536,7495,587],{"class":573},[536,7497,590],{"class":541},[536,7499,615],{"class":562},[536,7501,596],{"class":541},[536,7503,7504,7506,7508],{"class":538,"line":620},[536,7505,623],{"class":541},[536,7507,546],{"class":545},[536,7509,568],{"class":541},[536,7511,7512],{"class":538,"line":630},[536,7513,633],{"emptyLinePlaceholder":484},[536,7515,7516,7518,7520],{"class":538,"line":636},[536,7517,542],{"class":541},[536,7519,641],{"class":545},[536,7521,568],{"class":541},[536,7523,7524,7526,7528,7530],{"class":538,"line":646},[536,7525,649],{"class":541},[536,7527,652],{"class":545},[536,7529,7392],{"class":549},[536,7531,568],{"class":541},[536,7533,7534,7536,7538,7540,7542,7544,7546,7548,7550,7552,7554,7556,7558,7560,7562],{"class":538,"line":657},[536,7535,660],{"class":541},[536,7537,2689],{"class":545},[536,7539,1053],{"class":541},[536,7541,2368],{"class":549},[536,7543,556],{"class":541},[536,7545,559],{"class":541},[536,7547,1192],{"class":541},[536,7549,1196],{"class":1195},[536,7551,1199],{"class":541},[536,7553,2706],{"class":1195},[536,7555,1199],{"class":541},[536,7557,2381],{"class":1195},[536,7559,1220],{"class":541},[536,7561,559],{"class":541},[536,7563,1024],{"class":541},[536,7565,7566,7568,7570,7572],{"class":538,"line":668},[536,7567,660],{"class":541},[536,7569,4741],{"class":545},[536,7571,7371],{"class":549},[536,7573,1024],{"class":541},[536,7575,7577,7579],{"class":7576,"line":677},[538,915],[536,7578,660],{"class":541},[536,7580,7581],{"class":545},"Stage\n",[536,7583,7585,7588,7590,7592,7595],{"class":7584,"line":693},[538,915],[536,7586,7587],{"class":549},"      lighting",[536,7589,556],{"class":541},[536,7591,559],{"class":541},[536,7593,7594],{"class":562},"rembrandt",[536,7596,774],{"class":541},[536,7598,7600,7603,7605,7607,7610],{"class":7599,"line":708},[538,915],[536,7601,7602],{"class":549},"      shadows",[536,7604,556],{"class":541},[536,7606,559],{"class":541},[536,7608,7609],{"class":562},"contact",[536,7611,774],{"class":541},[536,7613,7615,7617,7620,7622,7624,7626],{"class":7614,"line":720},[538,915],[536,7616,3821],{"class":541},[536,7618,7619],{"class":549},"adjust-camera",[536,7621,556],{"class":541},[536,7623,559],{"class":541},[536,7625,1176],{"class":1175},[536,7627,774],{"class":541},[536,7629,7631,7634,7636,7638,7640],{"class":7630,"line":732},[538,915],[536,7632,7633],{"class":549},"      environment",[536,7635,556],{"class":541},[536,7637,559],{"class":541},[536,7639,1116],{"class":562},[536,7641,774],{"class":541},[536,7643,7645,7647,7649,7651,7653,7655],{"class":7644,"line":744},[538,915],[536,7646,3821],{"class":541},[536,7648,2354],{"class":549},[536,7650,556],{"class":541},[536,7652,559],{"class":541},[536,7654,4063],{"class":1195},[536,7656,774],{"class":541},[536,7658,7659],{"class":538,"line":756},[536,7660,7661],{"class":541},"    >\n",[536,7663,7664,7666,7668,7670],{"class":538,"line":768},[536,7665,671],{"class":541},[536,7667,1031],{"class":545},[536,7669,7408],{"class":549},[536,7671,568],{"class":541},[536,7673,7674,7676,7679],{"class":538,"line":777},[536,7675,3257],{"class":541},[536,7677,7678],{"class":545},"TresBoxGeometry",[536,7680,1024],{"class":541},[536,7682,7683,7685,7687,7689,7691,7693,7695,7697],{"class":538,"line":783},[536,7684,3257],{"class":541},[536,7686,1050],{"class":545},[536,7688,2838],{"class":549},[536,7690,556],{"class":541},[536,7692,559],{"class":541},[536,7694,2845],{"class":562},[536,7696,559],{"class":541},[536,7698,1024],{"class":541},[536,7700,7701,7703,7705],{"class":538,"line":793},[536,7702,3290],{"class":541},[536,7704,1031],{"class":545},[536,7706,568],{"class":541},[536,7708,7709,7711,7713,7715,7717,7719,7721,7723,7725,7727,7729,7731,7733,7735,7737,7739,7741,7743,7745,7747,7749,7751,7753,7755,7757,7759],{"class":538,"line":803},[536,7710,671],{"class":541},[536,7712,237],{"class":545},[536,7714,1053],{"class":541},[536,7716,2368],{"class":549},[536,7718,556],{"class":541},[536,7720,559],{"class":541},[536,7722,1192],{"class":541},[536,7724,1196],{"class":1195},[536,7726,2384],{"class":541},[536,7728,1213],{"class":1195},[536,7730,1199],{"class":541},[536,7732,1196],{"class":1195},[536,7734,1220],{"class":541},[536,7736,559],{"class":541},[536,7738,2826],{"class":549},[536,7740,1053],{"class":541},[536,7742,2552],{"class":549},[536,7744,556],{"class":541},[536,7746,559],{"class":541},[536,7748,1192],{"class":541},[536,7750,2381],{"class":1195},[536,7752,1199],{"class":541},[536,7754,2381],{"class":1195},[536,7756,1220],{"class":541},[536,7758,559],{"class":541},[536,7760,568],{"class":541},[536,7762,7763,7765,7767],{"class":538,"line":5881},[536,7764,3257],{"class":541},[536,7766,1050],{"class":545},[536,7768,1024],{"class":541},[536,7770,7771,7773,7775],{"class":538,"line":5890},[536,7772,3290],{"class":541},[536,7774,237],{"class":545},[536,7776,568],{"class":541},[536,7778,7779,7781,7783],{"class":538,"line":6634},[536,7780,786],{"class":541},[536,7782,383],{"class":545},[536,7784,568],{"class":541},[536,7786,7787,7789,7791],{"class":538,"line":6639},[536,7788,796],{"class":541},[536,7790,652],{"class":545},[536,7792,568],{"class":541},[536,7794,7795,7797,7799],{"class":538,"line":6648},[536,7796,623],{"class":541},[536,7798,641],{"class":545},[536,7800,568],{"class":541},[524,7802,1410],{"id":1409},[1412,7804,7805,7815],{},[1415,7806,7807],{},[1418,7808,7809,7811,7813],{},[1421,7810,1424],{"align":1423},[1421,7812,1427],{"align":1423},[1421,7814,1430],{"align":1423},[1432,7816,7817,7835,7853,7871,7885,7901],{},[1418,7818,7819,7824,7830],{},[1437,7820,7821],{"align":1423},[2071,7822,7823],{},"lighting",[1437,7825,7826,7827],{"align":1423},"Lighting setup. Options: ",[508,7828,7829],{},"null | undefined | false | 'rembrandt' | 'portrait' | 'upfront' | 'soft' | { main: [x, y, z], fill: [x, y, z] }",[1437,7831,7832],{"align":1423},[508,7833,7834],{},"'rembrandt'",[1418,7836,7837,7842,7848],{},[1437,7838,7839],{"align":1423},[2071,7840,7841],{},"shadows",[1437,7843,7844,7845],{"align":1423},"Controls the ground shadows. Options: ",[508,7846,7847],{},"boolean | 'contact' | 'accumulative' | StageShadows",[1437,7849,7850],{"align":1423},[508,7851,7852],{},"'contact'",[1418,7854,7855,7860,7867],{},[1437,7856,7857],{"align":1423},[2071,7858,7859],{},"adjustCamera",[1437,7861,7862,7863,7866],{"align":1423},"Optionally wraps and thereby centers the models using ",[508,7864,7865],{},"\u003CBounds>",", can also be a camera offset",[1437,7868,7869],{"align":1423},[508,7870,1176],{},[1418,7872,7873,7877,7880],{},[1437,7874,7875],{"align":1423},[2071,7876,7351],{},[1437,7878,7879],{"align":1423},"The default environment",[1437,7881,7882],{"align":1423},[508,7883,7884],{},"'city'",[1418,7886,7887,7891,7897],{},[1437,7888,7889],{"align":1423},[2071,7890,2354],{},[1437,7892,7893,7894,7896],{"align":1423},"Lighting intensity, ",[508,7895,1196],{}," removes lights",[1437,7898,7899],{"align":1423},[508,7900,4063],{},[1418,7902,7903,7908,7911],{},[1437,7904,7905],{"align":1423},[2071,7906,7907],{},"align",[1437,7909,7910],{"align":1423},"To adjust alignment",[1437,7912,7913],{"align":1423},[508,7914,1448],{},[1272,7916,7918],{"id":7917},"stageshadows-type","StageShadows Type",[504,7920,7921],{},"When using custom shadow configuration, you can pass an object with the following properties:",[1412,7923,7924,7934],{},[1415,7925,7926],{},[1418,7927,7928,7930,7932],{},[1421,7929,1424],{"align":1423},[1421,7931,1427],{"align":1423},[1421,7933,1430],{"align":1423},[1432,7935,7936,7951,7964,7979,7993],{},[1418,7937,7938,7943,7949],{},[1437,7939,7940],{"align":1423},[2071,7941,7942],{},"type",[1437,7944,7945,7946],{"align":1423},"Shadow type: ",[508,7947,7948],{},"'contact' | 'accumulative'",[1437,7950,2422],{"align":1423},[1418,7952,7953,7957,7960],{},[1437,7954,7955],{"align":1423},[2071,7956,6945],{},[1437,7958,7959],{"align":1423},"Shadow plane offset",[1437,7961,7962],{"align":1423},[508,7963,1196],{},[1418,7965,7966,7971,7974],{},[1437,7967,7968],{"align":1423},[2071,7969,7970],{},"bias",[1437,7972,7973],{"align":1423},"Shadow bias",[1437,7975,7976],{"align":1423},[508,7977,7978],{},"-0.0001",[1418,7980,7981,7986,7989],{},[1437,7982,7983],{"align":1423},[2071,7984,7985],{},"normalBias",[1437,7987,7988],{"align":1423},"Shadow normal bias",[1437,7990,7991],{"align":1423},[508,7992,1196],{},[1418,7994,7995,7999,8002],{},[1437,7996,7997],{"align":1423},[2071,7998,3438],{},[1437,8000,8001],{"align":1423},"Shadow map size",[1437,8003,8004],{"align":1423},[508,8005,8006],{},"1024",[504,8008,8009,8010,1199,8013,8016,8017,515],{},"Additionally inherits all props from ",[508,8011,8012],{},"AccumulativeShadowsProps",[508,8014,8015],{},"RandomizedLightsProps",", and ",[508,8018,8019],{},"ContactShadowsProps",[1653,8021,8022],{},"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 .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 .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 .sbssI, html code.shiki .sbssI{--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C}html pre.shiki code .sfNiH, html code.shiki .sfNiH{--shiki-light:#FF5370;--shiki-default:#FF9CAC;--shiki-dark:#FF9CAC}",{"title":476,"searchDepth":477,"depth":478,"links":8024},[8025,8026],{"id":526,"depth":478,"text":15},{"id":1409,"depth":478,"text":1410,"children":8027},[8028],{"id":7917,"depth":599,"text":7918},"Creates a complete stage setup with lighting, shadows, and environment.",{},{"title":383,"description":8029},"ZUAOlQhFpQ_UzI0nm_Ae7_izK4y1v3X6HA7NTC6mQ3o",{"id":8034,"title":387,"body":8035,"description":8324,"extension":481,"links":482,"meta":8325,"navigation":484,"path":388,"seo":8326,"stem":389,"__hash__":8327},"docs/2.api/8.staging/stars.md",{"type":469,"value":8036,"toc":8320},[8037,8042,8048,8050,8055,8212,8214,8318],[498,8038,8039],{},[8040,8041],"staging-stars",{},[504,8043,8044,8047],{},[508,8045,8046],{},"\u003CStars />"," is a component that renders a stars in the sky of your scene. It is an abstraction that use Points, PointsMaterial and BufferGeometry to create a beautiful stars effect",[524,8049,15],{"id":526},[504,8051,3517,8052,8054],{},[508,8053,8046],{}," component without passing any props,",[528,8056,8059],{"className":530,"code":8057,"highlights":8058,"language":532,"meta":476,"style":476},"\u003Cscript setup lang=\"ts\">\nimport { TresCanvas } from '@tresjs/core'\nimport { Stars } from '@tresjs/cientos'\n\u003C/script>\n\n\u003Ctemplate>\n  \u003CTresCanvas>\n    \u003CTresPerspectiveCamera :position=\"[0, 3, 5]\" />\n    \u003CStars />\n    \u003CTresAmbientLight />\n  \u003C/TresCanvas>\n\u003C/template>\n",[599,668],[508,8060,8061,8081,8099,8119,8127,8131,8139,8147,8179,8188,8196,8204],{"__ignoreMap":476},[536,8062,8063,8065,8067,8069,8071,8073,8075,8077,8079],{"class":538,"line":477},[536,8064,542],{"class":541},[536,8066,546],{"class":545},[536,8068,550],{"class":549},[536,8070,553],{"class":549},[536,8072,556],{"class":541},[536,8074,559],{"class":541},[536,8076,563],{"class":562},[536,8078,559],{"class":541},[536,8080,568],{"class":541},[536,8082,8083,8085,8087,8089,8091,8093,8095,8097],{"class":538,"line":478},[536,8084,574],{"class":573},[536,8086,577],{"class":541},[536,8088,581],{"class":580},[536,8090,584],{"class":541},[536,8092,587],{"class":573},[536,8094,590],{"class":541},[536,8096,593],{"class":562},[536,8098,596],{"class":541},[536,8100,8102,8104,8106,8109,8111,8113,8115,8117],{"class":8101,"line":599},[538,915],[536,8103,574],{"class":573},[536,8105,577],{"class":541},[536,8107,8108],{"class":580}," Stars",[536,8110,584],{"class":541},[536,8112,587],{"class":573},[536,8114,590],{"class":541},[536,8116,615],{"class":562},[536,8118,596],{"class":541},[536,8120,8121,8123,8125],{"class":538,"line":620},[536,8122,623],{"class":541},[536,8124,546],{"class":545},[536,8126,568],{"class":541},[536,8128,8129],{"class":538,"line":630},[536,8130,633],{"emptyLinePlaceholder":484},[536,8132,8133,8135,8137],{"class":538,"line":636},[536,8134,542],{"class":541},[536,8136,641],{"class":545},[536,8138,568],{"class":541},[536,8140,8141,8143,8145],{"class":538,"line":646},[536,8142,649],{"class":541},[536,8144,652],{"class":545},[536,8146,568],{"class":541},[536,8148,8149,8151,8153,8155,8157,8159,8161,8163,8165,8167,8169,8171,8173,8175,8177],{"class":538,"line":657},[536,8150,660],{"class":541},[536,8152,2689],{"class":545},[536,8154,1053],{"class":541},[536,8156,2368],{"class":549},[536,8158,556],{"class":541},[536,8160,559],{"class":541},[536,8162,1192],{"class":541},[536,8164,1196],{"class":1195},[536,8166,1199],{"class":541},[536,8168,2706],{"class":1195},[536,8170,1199],{"class":541},[536,8172,2381],{"class":1195},[536,8174,1220],{"class":541},[536,8176,559],{"class":541},[536,8178,1024],{"class":541},[536,8180,8182,8184,8186],{"class":8181,"line":668},[538,915],[536,8183,660],{"class":541},[536,8185,387],{"class":545},[536,8187,1024],{"class":541},[536,8189,8190,8192,8194],{"class":538,"line":677},[536,8191,660],{"class":541},[536,8193,2732],{"class":545},[536,8195,1024],{"class":541},[536,8197,8198,8200,8202],{"class":538,"line":693},[536,8199,796],{"class":541},[536,8201,652],{"class":545},[536,8203,568],{"class":541},[536,8205,8206,8208,8210],{"class":538,"line":708},[536,8207,623],{"class":541},[536,8209,641],{"class":545},[536,8211,568],{"class":541},[524,8213,1410],{"id":1409},[1412,8215,8216,8226],{},[1415,8217,8218],{},[1418,8219,8220,8222,8224],{},[1421,8221,1424],{"align":1423},[1421,8223,1427],{"align":1423},[1421,8225,1430],{},[1432,8227,8228,8239,8250,8261,8272,8283,8294,8305],{},[1418,8229,8230,8234,8237],{},[1437,8231,8232],{"align":1423},[2071,8233,3438],{},[1437,8235,8236],{"align":1423},"The size of the stars",[1437,8238,4400],{},[1418,8240,8241,8245,8248],{},[1437,8242,8243],{"align":1423},[2071,8244,4541],{},[1437,8246,8247],{"align":1423},"keep the same size regardless distance.",[1437,8249,1176],{},[1418,8251,8252,8256,8259],{},[1437,8253,8254],{"align":1423},[2071,8255,4529],{},[1437,8257,8258],{"align":1423},"show transparency on the stars texture",[1437,8260,1176],{},[1418,8262,8263,8267,8270],{},[1437,8264,8265],{"align":1423},[2071,8266,4457],{},[1437,8268,8269],{"align":1423},"enables the WebGL to know when not to render the pixeltext.",[1437,8271,4463],{},[1418,8273,8274,8278,8281],{},[1437,8275,8276],{"align":1423},[2071,8277,4445],{},[1437,8279,8280],{"align":1423},"texture of the stars",[1437,8282,4438],{},[1418,8284,8285,8289,8292],{},[1437,8286,8287],{"align":1423},[2071,8288,3824],{},[1437,8290,8291],{"align":1423},"number of stars",[1437,8293,4488],{},[1418,8295,8296,8300,8303],{},[1437,8297,8298],{"align":1423},[2071,8299,5258],{},[1437,8301,8302],{"align":1423},"depth of star's shape",[1437,8304,3273],{},[1418,8306,8307,8312,8315],{},[1437,8308,8309],{"align":1423},[2071,8310,8311],{},"radius",[1437,8313,8314],{"align":1423},"Radius of star's shape",[1437,8316,8317],{},"100",[1653,8319,2931],{},{"title":476,"searchDepth":477,"depth":478,"links":8321},[8322,8323],{"id":526,"depth":478,"text":15},{"id":1409,"depth":478,"text":1410},"Renders beautiful stars in the sky using Points and BufferGeometry.",{},{"title":387,"description":8324},"Hth9yEzN_KgLKS-QKylR25ofLqF86DItRzJAOv9FBUM",1774953659185]