[{"data":1,"prerenderedAt":3974},["ShallowReactive",2],{"navigation":3,"/api/materials":470,"/api/materials-surround":491,"material-list":496},[4,22],{"title":5,"path":6,"stem":7,"children":8},"Getting Started","/getting-started","1.getting-started/1.index",[9,10,14,18],{"title":5,"path":6,"stem":7},{"title":11,"path":12,"stem":13},"Installation Guide","/getting-started/installation","1.getting-started/2.installation",{"title":15,"path":16,"stem":17},"Usage","/getting-started/usage","1.getting-started/3.usage",{"title":19,"path":20,"stem":21},"Upgrade Guide","/getting-started/upgrade-guide","1.getting-started/4.upgrade-guide",{"title":23,"path":24,"stem":25,"children":26},"Api","/api","2.api",[27,30,80,114,156,190,284,310,344,394,436],{"title":28,"path":24,"stem":29},"All","2.api/index",{"title":31,"path":32,"stem":33,"children":34},"Abstractions","/api/abstractions","2.api/1.abstractions/index",[35,36,40,44,48,52,56,60,64,68,72,76],{"title":31,"path":32,"stem":33},{"title":37,"path":38,"stem":39},"Align","/api/abstractions/align","2.api/1.abstractions/align",{"title":41,"path":42,"stem":43},"Billboard","/api/abstractions/billboard","2.api/1.abstractions/billboard",{"title":45,"path":46,"stem":47},"Camera Shake","/api/abstractions/camera-shake","2.api/1.abstractions/camera-shake",{"title":49,"path":50,"stem":51},"Edges","/api/abstractions/edges","2.api/1.abstractions/edges",{"title":53,"path":54,"stem":55},"Fit","/api/abstractions/fit","2.api/1.abstractions/fit",{"title":57,"path":58,"stem":59},"Levioso (Float)","/api/abstractions/levioso","2.api/1.abstractions/levioso",{"title":61,"path":62,"stem":63},"Mask","/api/abstractions/mask","2.api/1.abstractions/mask",{"title":65,"path":66,"stem":67},"Outline","/api/abstractions/outline","2.api/1.abstractions/outline",{"title":69,"path":70,"stem":71},"Sampler","/api/abstractions/sampler","2.api/1.abstractions/sampler",{"title":73,"path":74,"stem":75},"ScreenSizer","/api/abstractions/screen-sizer","2.api/1.abstractions/screen-sizer",{"title":77,"path":78,"stem":79},"ScreenSpace","/api/abstractions/screen-space","2.api/1.abstractions/screen-space",{"title":81,"path":82,"stem":83,"children":84},"Controls","/api/controls","2.api/2.controls/index",[85,86,90,94,98,102,106,110],{"title":81,"path":82,"stem":83},{"title":87,"path":88,"stem":89},"Camera Controls","/api/controls/camera-controls","2.api/2.controls/camera-controls",{"title":91,"path":92,"stem":93},"Drag Controls","/api/controls/drag-controls","2.api/2.controls/drag-controls",{"title":95,"path":96,"stem":97},"Keyboard Controls","/api/controls/keyboard-controls","2.api/2.controls/keyboard-controls",{"title":99,"path":100,"stem":101},"Map Controls","/api/controls/map-controls","2.api/2.controls/map-controls",{"title":103,"path":104,"stem":105},"Orbit Controls","/api/controls/orbit-controls","2.api/2.controls/orbit-controls",{"title":107,"path":108,"stem":109},"PointerLock Controls","/api/controls/pointer-lock-controls","2.api/2.controls/pointer-lock-controls",{"title":111,"path":112,"stem":113},"Transform Controls","/api/controls/transform-controls","2.api/2.controls/transform-controls",{"title":115,"path":116,"stem":117,"children":118},"Loaders","/api/loaders","2.api/3.loaders/index",[119,120,124,128,132,136,140,144,148,152],{"title":115,"path":116,"stem":117},{"title":121,"path":122,"stem":123},"useGLTF","/api/loaders/use-gltf","2.api/3.loaders/1.use-gltf",{"title":125,"path":126,"stem":127},"GLTFModel","/api/loaders/gltf-model","2.api/3.loaders/2.gltf-model",{"title":129,"path":130,"stem":131},"useFBX","/api/loaders/use-fbx","2.api/3.loaders/3.use-fbx",{"title":133,"path":134,"stem":135},"FBXModel","/api/loaders/fbx-model","2.api/3.loaders/4.fbx-model",{"title":137,"path":138,"stem":139},"useTexture","/api/loaders/use-texture","2.api/3.loaders/5.use-texture",{"title":141,"path":142,"stem":143},"useTextures","/api/loaders/use-textures","2.api/3.loaders/6.use-textures",{"title":145,"path":146,"stem":147},"useSVG","/api/loaders/use-svg","2.api/3.loaders/7.use-svg",{"title":149,"path":150,"stem":151},"useProgress","/api/loaders/use-progress","2.api/3.loaders/use-progress",{"title":153,"path":154,"stem":155},"useVideoTexture","/api/loaders/use-video-texture","2.api/3.loaders/use-video-texture",{"title":157,"path":158,"stem":159,"children":160},"Materials","/api/materials","2.api/4.materials/index",[161,162,166,170,174,178,182,186],{"title":157,"path":158,"stem":159},{"title":163,"path":164,"stem":165},"Custom Shader Material","/api/materials/custom-shader-material","2.api/4.materials/custom-shader-material",{"title":167,"path":168,"stem":169},"Mesh Glass Material","/api/materials/glass-material","2.api/4.materials/glass-material",{"title":171,"path":172,"stem":173},"Holographic Material","/api/materials/holographic-material","2.api/4.materials/holographic-material",{"title":175,"path":176,"stem":177},"Mesh Discard Material","/api/materials/mesh-discard-material","2.api/4.materials/mesh-discard-material",{"title":179,"path":180,"stem":181},"Mesh Reflection Material","/api/materials/mesh-reflection-material","2.api/4.materials/mesh-reflection-material",{"title":183,"path":184,"stem":185},"Point Material","/api/materials/point-material","2.api/4.materials/point-material",{"title":187,"path":188,"stem":189},"Wobble Material","/api/materials/wobble-material","2.api/4.materials/wobble-material",{"title":191,"path":192,"stem":193,"children":194},"Shapes","/api/shapes","2.api/5.shapes/index",[195,196,200,204,208,212,216,220,224,228,232,236,240,244,248,252,256,260,264,268,272,276,280],{"title":191,"path":192,"stem":193},{"title":197,"path":198,"stem":199},"Box","/api/shapes/box","2.api/5.shapes/box",{"title":201,"path":202,"stem":203},"CatmullRomCurve3","/api/shapes/catmullromcurve3","2.api/5.shapes/catmullromcurve3",{"title":205,"path":206,"stem":207},"Circle","/api/shapes/circle","2.api/5.shapes/circle",{"title":209,"path":210,"stem":211},"Cone","/api/shapes/cone","2.api/5.shapes/cone",{"title":213,"path":214,"stem":215},"Cubic Bezier Line","/api/shapes/cubic-bezier-line","2.api/5.shapes/cubic-bezier-line",{"title":217,"path":218,"stem":219},"Cylinder","/api/shapes/cylinder","2.api/5.shapes/cylinder",{"title":221,"path":222,"stem":223},"Dodecahedron","/api/shapes/dodecahedron","2.api/5.shapes/dodecahedron",{"title":225,"path":226,"stem":227},"Grid","/api/shapes/grid","2.api/5.shapes/grid",{"title":229,"path":230,"stem":231},"Icosahedron","/api/shapes/icosahedron","2.api/5.shapes/icosahedron",{"title":233,"path":234,"stem":235},"Line2","/api/shapes/line2","2.api/5.shapes/line2",{"title":237,"path":238,"stem":239},"Octahedron","/api/shapes/octahedron","2.api/5.shapes/octahedron",{"title":241,"path":242,"stem":243},"Plane","/api/shapes/plane","2.api/5.shapes/plane",{"title":245,"path":246,"stem":247},"Quadratic Bezier Line","/api/shapes/quadratic-bezier-line","2.api/5.shapes/quadratic-bezier-line",{"title":249,"path":250,"stem":251},"Ring","/api/shapes/ring","2.api/5.shapes/ring",{"title":253,"path":254,"stem":255},"Rounded Box","/api/shapes/rounded-box","2.api/5.shapes/rounded-box",{"title":257,"path":258,"stem":259},"Screen Quad","/api/shapes/screen-quad","2.api/5.shapes/screen-quad",{"title":261,"path":262,"stem":263},"Sphere","/api/shapes/sphere","2.api/5.shapes/sphere",{"title":265,"path":266,"stem":267},"Superformula","/api/shapes/superformula","2.api/5.shapes/superformula",{"title":269,"path":270,"stem":271},"Tetrahedron","/api/shapes/tetrahedron","2.api/5.shapes/tetrahedron",{"title":273,"path":274,"stem":275},"Torus","/api/shapes/torus","2.api/5.shapes/torus",{"title":277,"path":278,"stem":279},"Torus Knot","/api/shapes/torus-knot","2.api/5.shapes/torus-knot",{"title":281,"path":282,"stem":283},"Tube","/api/shapes/tube","2.api/5.shapes/tube",{"title":285,"path":286,"stem":287,"children":288},"Debug/Performance","/api/debug-performance","2.api/6.debug-performance/index",[289,290,294,298,302,306],{"title":285,"path":286,"stem":287},{"title":291,"path":292,"stem":293},"Helper","/api/debug-performance/helper","2.api/6.debug-performance/helper",{"title":295,"path":296,"stem":297},"LOD","/api/debug-performance/lod","2.api/6.debug-performance/lod",{"title":299,"path":300,"stem":301},"Stats","/api/debug-performance/stats","2.api/6.debug-performance/stats",{"title":303,"path":304,"stem":305},"StatsGl","/api/debug-performance/stats-gl","2.api/6.debug-performance/stats-gl",{"title":307,"path":308,"stem":309},"useBVH","/api/debug-performance/use-bvh","2.api/6.debug-performance/use-bvh",{"title":311,"path":312,"stem":313,"children":314},"Light/Shadow","/api/light-shadow","2.api/7.light-shadow/index",[315,316,320,324,328,332,336,340],{"title":311,"path":312,"stem":313},{"title":317,"path":318,"stem":319},"Accumulative Shadows","/api/light-shadow/accumulative-shadows","2.api/7.light-shadow/accumulative-shadows",{"title":321,"path":322,"stem":323},"Bake Shadows","/api/light-shadow/bake-shadows","2.api/7.light-shadow/bake-shadows",{"title":325,"path":326,"stem":327},"Circle Shadow","/api/light-shadow/circle-shadow","2.api/7.light-shadow/circle-shadow",{"title":329,"path":330,"stem":331},"Contact Shadows","/api/light-shadow/contact-shadows","2.api/7.light-shadow/contact-shadows",{"title":333,"path":334,"stem":335},"Lensflare","/api/light-shadow/lensflare","2.api/7.light-shadow/lensflare",{"title":337,"path":338,"stem":339},"Randomized Lights","/api/light-shadow/randomized-lights","2.api/7.light-shadow/randomized-lights",{"title":341,"path":342,"stem":343},"Soft Shadows","/api/light-shadow/soft-shadows","2.api/7.light-shadow/soft-shadows",{"title":345,"path":346,"stem":347,"children":348},"Staging","/api/staging","2.api/8.staging/index",[349,350,354,358,362,366,370,374,378,382,386,390],{"title":345,"path":346,"stem":347},{"title":351,"path":352,"stem":353},"Environment","/api/staging/environment","2.api/8.staging/1.environment",{"title":355,"path":356,"stem":357},"useEnvironment","/api/staging/use-environment","2.api/8.staging/2.use-environment",{"title":359,"path":360,"stem":361},"Lightformer","/api/staging/lightformer","2.api/8.staging/3.lightformer",{"title":363,"path":364,"stem":365},"Backdrop","/api/staging/backdrop","2.api/8.staging/backdrop",{"title":367,"path":368,"stem":369},"Ocean","/api/staging/ocean","2.api/8.staging/ocean",{"title":371,"path":372,"stem":373},"Precipitation","/api/staging/precipitation","2.api/8.staging/precipitation",{"title":375,"path":376,"stem":377},"Sky","/api/staging/sky","2.api/8.staging/sky",{"title":379,"path":380,"stem":381},"Smoke","/api/staging/smoke","2.api/8.staging/smoke",{"title":383,"path":384,"stem":385},"Sparkles","/api/staging/sparkles","2.api/8.staging/sparkles",{"title":387,"path":388,"stem":389},"Stage","/api/staging/stage","2.api/8.staging/stage",{"title":391,"path":392,"stem":393},"Stars","/api/staging/stars","2.api/8.staging/stars",{"title":395,"path":396,"stem":397,"children":398},"Objects","/api/objects","2.api/9.objects/index",[399,400,404,408,412,416,420,424,428,432],{"title":395,"path":396,"stem":397},{"title":401,"path":402,"stem":403},"AnimatedSprite","/api/objects/animated-sprite","2.api/9.objects/animated-sprite",{"title":405,"path":406,"stem":407},"CubeCamera","/api/objects/cube-camera","2.api/9.objects/cube-camera",{"title":409,"path":410,"stem":411},"Fbo","/api/objects/fbo","2.api/9.objects/fbo",{"title":413,"path":414,"stem":415},"GradientTexture","/api/objects/gradient-texture","2.api/9.objects/gradient-texture",{"title":417,"path":418,"stem":419},"HTML","/api/objects/html","2.api/9.objects/html",{"title":421,"path":422,"stem":423},"Image","/api/objects/image","2.api/9.objects/image",{"title":425,"path":426,"stem":427},"MarchingCubes","/api/objects/marching-cubes","2.api/9.objects/marching-cubes",{"title":429,"path":430,"stem":431},"Reflector","/api/objects/reflector","2.api/9.objects/reflector",{"title":433,"path":434,"stem":435},"Text3D","/api/objects/text-3d","2.api/9.objects/text-3d",{"title":437,"path":438,"stem":439,"children":440},"Miscellaneous","/api/miscellaneous","2.api/miscellaneous/index",[441,442,446,450,454,458,462,466],{"title":437,"path":438,"stem":439},{"title":443,"path":444,"stem":445},"Bounds","/api/miscellaneous/bounds","2.api/miscellaneous/bounds",{"title":447,"path":448,"stem":449},"GlobalAudio","/api/miscellaneous/global-audio","2.api/miscellaneous/global-audio",{"title":451,"path":452,"stem":453},"MouseParallax","/api/miscellaneous/mouse-parallax","2.api/miscellaneous/mouse-parallax",{"title":455,"path":456,"stem":457},"PositionalAudio","/api/miscellaneous/positional-audio","2.api/miscellaneous/positional-audio",{"title":459,"path":460,"stem":461},"useAnimations","/api/miscellaneous/use-animations","2.api/miscellaneous/use-animations",{"title":463,"path":464,"stem":465},"useGLTFExporter","/api/miscellaneous/use-gltf-exporter","2.api/miscellaneous/use-gltf-exporter",{"title":467,"path":468,"stem":469},"useIntersect","/api/miscellaneous/use-intersect","2.api/miscellaneous/use-intersect",{"id":471,"title":157,"body":472,"description":484,"extension":485,"links":486,"meta":487,"navigation":488,"path":158,"seo":489,"stem":159,"__hash__":490},"docs/2.api/4.materials/index.md",{"type":473,"value":474,"toc":479},"minimark",[475],[476,477],"api-list",{"list-name":478},"material-list",{"title":480,"searchDepth":481,"depth":482,"links":483},"",1,2,[],"All materials","md",null,{},true,{"title":157,"description":484},"BesZhb4Nwt5wfIqWwZZLh5Sit7_8paFEbEBzuTW5QQU",[492,494],{"title":153,"path":154,"stem":155,"description":493,"children":-1},"A composable to load video textures in TresJS scenes.",{"title":163,"path":164,"stem":165,"description":495,"children":-1},"Extends Three.js' material library with your own Vertex and Fragment shaders.",[497,1103,1773,2261,2433,3283,3610],{"id":498,"title":163,"body":499,"description":495,"extension":485,"links":486,"meta":1100,"navigation":488,"path":164,"seo":1101,"stem":165,"__hash__":1102},"docs/2.api/4.materials/custom-shader-material.md",{"type":473,"value":500,"toc":1096},[501,507,535,539,1074,1078,1092],[502,503,504],"scene-wrapper",{},[505,506],"materials-custom-shader-material",{},[508,509,510,511,515,516,519,520,529,530,534],"p",{},"The ",[512,513,514],"code",{},"cientos"," package provides ",[512,517,518],{},"\u003CTresCustomShaderMaterial />"," component which is a wrapper around the ",[521,522,526],"a",{"href":523,"rel":524},"https://github.com/FarazzShaikh/THREE-CustomShaderMaterial",[525],"nofollow",[512,527,528],{},"three-custom-shader-material"," class. As states in the repo, it ",[531,532,533],"em",{},"\"lets you extend Three.js' material library with your own Vertex and Fragment shaders\"",".",[536,537,15],"h2",{"id":538},"usage",[540,541,561],"pre",{"className":542,"code":543,"highlights":544,"language":560,"meta":480,"style":480},"language-vue shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003Cscript setup lang=\"ts\">\nimport { TresCustomShaderMaterial } from '@tresjs/cientos'\nimport { shallowRef } from 'vue'\n\nconst customShaderMaterialRef = shallowRef()\n\u003C/script>\n\n\u003Ctemplate>\n  \u003CTresCanvas>\n    \u003CTresPerspectiveCamera :position=\"[3, 3, 3]\" />\n    \u003CTresMesh>\n      \u003CTresBoxGeometry />\n      \u003CTresCustomShaderMaterial\n        ref=\"customShaderMaterialRef\"\n        :vertex-shader=\"vertexShader\"\n        :fragment-shader=\"fragmentShader\"\n        :uniforms=\"{\n          u_time: { value: 0 },\n          u_color: { value: new THREE.Color(0.2, 0.0, 0.1) },\n          u_resolution: { value: new THREE.Vector2() }\n        }\"\n        :transparent=\"true\"\n        :side=\"THREE.DoubleSide\"\n        base-material=\"MeshLambertMaterial\"\n        silent\n        :map=\"texture\"\n        :color=\"0xff0000\"\n      />\n    \u003C/TresMesh>\n    \u003CTresAmbientLight />\n  \u003C/TresCanvas>\n\u003C/template>\n",[482,545,546,547,548,549,550,551,552,553,554,555,556,557,558,559],13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,"vue",[512,562,563,597,627,647,653,670,680,685,695,706,749,759,770,778,794,812,829,844,865,905,927,935,953,974,989,995,1012,1029,1035,1045,1055,1065],{"__ignoreMap":480},[564,565,567,571,575,579,582,585,588,592,594],"span",{"class":566,"line":481},"line",[564,568,570],{"class":569},"sMK4o","\u003C",[564,572,574],{"class":573},"swJcz","script",[564,576,578],{"class":577},"spNyl"," setup",[564,580,581],{"class":577}," lang",[564,583,584],{"class":569},"=",[564,586,587],{"class":569},"\"",[564,589,591],{"class":590},"sfazB","ts",[564,593,587],{"class":569},[564,595,596],{"class":569},">\n",[564,598,601,605,608,612,615,618,621,624],{"class":599,"line":482},[566,600],"highlight",[564,602,604],{"class":603},"s7zQu","import",[564,606,607],{"class":569}," {",[564,609,611],{"class":610},"sTEyZ"," TresCustomShaderMaterial",[564,613,614],{"class":569}," }",[564,616,617],{"class":603}," from",[564,619,620],{"class":569}," '",[564,622,623],{"class":590},"@tresjs/cientos",[564,625,626],{"class":569},"'\n",[564,628,630,632,634,637,639,641,643,645],{"class":566,"line":629},3,[564,631,604],{"class":603},[564,633,607],{"class":569},[564,635,636],{"class":610}," shallowRef",[564,638,614],{"class":569},[564,640,617],{"class":603},[564,642,620],{"class":569},[564,644,560],{"class":590},[564,646,626],{"class":569},[564,648,650],{"class":566,"line":649},4,[564,651,652],{"emptyLinePlaceholder":488},"\n",[564,654,656,659,662,664,667],{"class":566,"line":655},5,[564,657,658],{"class":577},"const",[564,660,661],{"class":610}," customShaderMaterialRef ",[564,663,584],{"class":569},[564,665,636],{"class":666},"s2Zo4",[564,668,669],{"class":610},"()\n",[564,671,673,676,678],{"class":566,"line":672},6,[564,674,675],{"class":569},"\u003C/",[564,677,574],{"class":573},[564,679,596],{"class":569},[564,681,683],{"class":566,"line":682},7,[564,684,652],{"emptyLinePlaceholder":488},[564,686,688,690,693],{"class":566,"line":687},8,[564,689,570],{"class":569},[564,691,692],{"class":573},"template",[564,694,596],{"class":569},[564,696,698,701,704],{"class":566,"line":697},9,[564,699,700],{"class":569},"  \u003C",[564,702,703],{"class":573},"TresCanvas",[564,705,596],{"class":569},[564,707,709,712,715,718,721,723,725,728,732,735,737,739,741,744,746],{"class":566,"line":708},10,[564,710,711],{"class":569},"    \u003C",[564,713,714],{"class":573},"TresPerspectiveCamera",[564,716,717],{"class":569}," :",[564,719,720],{"class":577},"position",[564,722,584],{"class":569},[564,724,587],{"class":569},[564,726,727],{"class":569},"[",[564,729,731],{"class":730},"sbssI","3",[564,733,734],{"class":569},", ",[564,736,731],{"class":730},[564,738,734],{"class":569},[564,740,731],{"class":730},[564,742,743],{"class":569},"]",[564,745,587],{"class":569},[564,747,748],{"class":569}," />\n",[564,750,752,754,757],{"class":566,"line":751},11,[564,753,711],{"class":569},[564,755,756],{"class":573},"TresMesh",[564,758,596],{"class":569},[564,760,762,765,768],{"class":566,"line":761},12,[564,763,764],{"class":569},"      \u003C",[564,766,767],{"class":573},"TresBoxGeometry",[564,769,748],{"class":569},[564,771,773,775],{"class":772,"line":545},[566,600],[564,774,764],{"class":569},[564,776,777],{"class":573},"TresCustomShaderMaterial\n",[564,779,781,784,786,788,791],{"class":780,"line":546},[566,600],[564,782,783],{"class":577},"        ref",[564,785,584],{"class":569},[564,787,587],{"class":569},[564,789,790],{"class":590},"customShaderMaterialRef",[564,792,793],{"class":569},"\"\n",[564,795,797,800,803,805,807,810],{"class":796,"line":547},[566,600],[564,798,799],{"class":569},"        :",[564,801,802],{"class":577},"vertex-shader",[564,804,584],{"class":569},[564,806,587],{"class":569},[564,808,809],{"class":610},"vertexShader",[564,811,793],{"class":569},[564,813,815,817,820,822,824,827],{"class":814,"line":548},[566,600],[564,816,799],{"class":569},[564,818,819],{"class":577},"fragment-shader",[564,821,584],{"class":569},[564,823,587],{"class":569},[564,825,826],{"class":610},"fragmentShader",[564,828,793],{"class":569},[564,830,832,834,837,839,841],{"class":831,"line":549},[566,600],[564,833,799],{"class":569},[564,835,836],{"class":577},"uniforms",[564,838,584],{"class":569},[564,840,587],{"class":569},[564,842,843],{"class":569},"{\n",[564,845,847,850,853,856,859,862],{"class":846,"line":550},[566,600],[564,848,849],{"class":573},"          u_time",[564,851,852],{"class":569},": { ",[564,854,855],{"class":573},"value",[564,857,858],{"class":569},": ",[564,860,861],{"class":730},"0",[564,863,864],{"class":569}," },\n",[564,866,868,871,873,875,878,881,883,886,889,892,894,897,899,902],{"class":867,"line":551},[566,600],[564,869,870],{"class":573},"          u_color",[564,872,852],{"class":569},[564,874,855],{"class":573},[564,876,877],{"class":569},": new ",[564,879,880],{"class":610},"THREE",[564,882,534],{"class":569},[564,884,885],{"class":666},"Color",[564,887,888],{"class":569},"(",[564,890,891],{"class":730},"0.2",[564,893,734],{"class":569},[564,895,896],{"class":730},"0.0",[564,898,734],{"class":569},[564,900,901],{"class":730},"0.1",[564,903,904],{"class":569},") },\n",[564,906,908,911,913,915,917,919,921,924],{"class":907,"line":552},[566,600],[564,909,910],{"class":573},"          u_resolution",[564,912,852],{"class":569},[564,914,855],{"class":573},[564,916,877],{"class":569},[564,918,880],{"class":610},[564,920,534],{"class":569},[564,922,923],{"class":666},"Vector2",[564,925,926],{"class":569},"() }\n",[564,928,930,933],{"class":929,"line":553},[566,600],[564,931,932],{"class":569},"        }",[564,934,793],{"class":569},[564,936,938,940,943,945,947,951],{"class":937,"line":554},[566,600],[564,939,799],{"class":569},[564,941,942],{"class":577},"transparent",[564,944,584],{"class":569},[564,946,587],{"class":569},[564,948,950],{"class":949},"sfNiH","true",[564,952,793],{"class":569},[564,954,956,958,961,963,965,967,969,972],{"class":955,"line":555},[566,600],[564,957,799],{"class":569},[564,959,960],{"class":577},"side",[564,962,584],{"class":569},[564,964,587],{"class":569},[564,966,880],{"class":610},[564,968,534],{"class":569},[564,970,971],{"class":610},"DoubleSide",[564,973,793],{"class":569},[564,975,977,980,982,984,987],{"class":976,"line":556},[566,600],[564,978,979],{"class":577},"        base-material",[564,981,584],{"class":569},[564,983,587],{"class":569},[564,985,986],{"class":590},"MeshLambertMaterial",[564,988,793],{"class":569},[564,990,992],{"class":991,"line":557},[566,600],[564,993,994],{"class":577},"        silent\n",[564,996,998,1000,1003,1005,1007,1010],{"class":997,"line":558},[566,600],[564,999,799],{"class":569},[564,1001,1002],{"class":577},"map",[564,1004,584],{"class":569},[564,1006,587],{"class":569},[564,1008,1009],{"class":610},"texture",[564,1011,793],{"class":569},[564,1013,1015,1017,1020,1022,1024,1027],{"class":1014,"line":559},[566,600],[564,1016,799],{"class":569},[564,1018,1019],{"class":577},"color",[564,1021,584],{"class":569},[564,1023,587],{"class":569},[564,1025,1026],{"class":730},"0xff0000",[564,1028,793],{"class":569},[564,1030,1032],{"class":566,"line":1031},28,[564,1033,1034],{"class":569},"      />\n",[564,1036,1038,1041,1043],{"class":566,"line":1037},29,[564,1039,1040],{"class":569},"    \u003C/",[564,1042,756],{"class":573},[564,1044,596],{"class":569},[564,1046,1048,1050,1053],{"class":566,"line":1047},30,[564,1049,711],{"class":569},[564,1051,1052],{"class":573},"TresAmbientLight",[564,1054,748],{"class":569},[564,1056,1058,1061,1063],{"class":566,"line":1057},31,[564,1059,1060],{"class":569},"  \u003C/",[564,1062,703],{"class":573},[564,1064,596],{"class":569},[564,1066,1068,1070,1072],{"class":566,"line":1067},32,[564,1069,675],{"class":569},[564,1071,692],{"class":573},[564,1073,596],{"class":569},[536,1075,1077],{"id":1076},"props","Props",[508,1079,1080,1081,1084,1085,1087,1088,534],{},"Being a wrapper around the ",[512,1082,1083],{},"CustomShaderMaterial"," class, the ",[512,1086,518],{}," component accepts all the props that the class does. You can find the full list of props in the ",[521,1089,1091],{"href":523,"rel":1090},[525],"official repo",[1093,1094,1095],"style",{},"html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html pre.shiki code .s7zQu, html code.shiki .s7zQu{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html pre.shiki code .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}html 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}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":480,"searchDepth":481,"depth":482,"links":1097},[1098,1099],{"id":538,"depth":482,"text":15},{"id":1076,"depth":482,"text":1077},{},{"title":163,"description":495},"WirW-L7fmUIEqDL1ownbJUS8vqN1Ie6ubq6WxZ9mH-o",{"id":1104,"title":167,"body":1105,"description":1769,"extension":485,"links":486,"meta":1770,"navigation":488,"path":168,"seo":1771,"stem":169,"__hash__":1772},"docs/2.api/4.materials/glass-material.md",{"type":473,"value":1106,"toc":1760},[1107,1112,1124,1126,1131,1376,1378,1385,1389,1743,1747,1757],[502,1108,1109],{},[1110,1111],"materials-glass-material",{},[508,1113,510,1114,1116,1117,1120,1121,534],{},[512,1115,514],{}," package provides a new",[512,1118,1119],{},"\u003CMeshGlassMaterial />"," component that makes a geometry look like glass. This is achieved by re-defining the ",[512,1122,1123],{},"MeshPhysicalMaterial",[536,1125,15],{"id":538},[1127,1128,1130],"h3",{"id":1129},"you-can-use-it-like-you-normally-do-with-tresjs","You can use it like you normally do with TresJs",[540,1132,1135],{"className":542,"code":1133,"highlights":1134,"language":560,"meta":480,"style":480},"\u003Cscript setup lang=\"ts\">\nimport { TresCanvas } from '@tresjs/core'\nimport { MeshGlassMaterial } from '@tresjs/cientos'\n\u003C/script>\n\n\u003Ctemplate>\n  \u003CTresCanvas>\n    \u003CTresPerspectiveCamera :position=\"[3, 3, 3]\" :look-at=\"[0, 0, 0]\" />\n    \u003CTresMesh>\n      \u003CTresTorusGeometry />\n      \u003CMeshGlassMaterial />\n    \u003C/TresMesh>\n    \u003CTresAmbientLight />\n    \u003CTresDirectionalLight :position=\"[0, 2, 4]\" />\n  \u003C/TresCanvas>\n\u003C/template>\n",[482,708],[512,1136,1137,1157,1178,1197,1205,1209,1217,1225,1282,1290,1300,1309,1317,1325,1360,1368],{"__ignoreMap":480},[564,1138,1139,1141,1143,1145,1147,1149,1151,1153,1155],{"class":566,"line":481},[564,1140,570],{"class":569},[564,1142,574],{"class":573},[564,1144,578],{"class":577},[564,1146,581],{"class":577},[564,1148,584],{"class":569},[564,1150,587],{"class":569},[564,1152,591],{"class":590},[564,1154,587],{"class":569},[564,1156,596],{"class":569},[564,1158,1160,1162,1164,1167,1169,1171,1173,1176],{"class":1159,"line":482},[566,600],[564,1161,604],{"class":603},[564,1163,607],{"class":569},[564,1165,1166],{"class":610}," TresCanvas",[564,1168,614],{"class":569},[564,1170,617],{"class":603},[564,1172,620],{"class":569},[564,1174,1175],{"class":590},"@tresjs/core",[564,1177,626],{"class":569},[564,1179,1180,1182,1184,1187,1189,1191,1193,1195],{"class":566,"line":629},[564,1181,604],{"class":603},[564,1183,607],{"class":569},[564,1185,1186],{"class":610}," MeshGlassMaterial",[564,1188,614],{"class":569},[564,1190,617],{"class":603},[564,1192,620],{"class":569},[564,1194,623],{"class":590},[564,1196,626],{"class":569},[564,1198,1199,1201,1203],{"class":566,"line":649},[564,1200,675],{"class":569},[564,1202,574],{"class":573},[564,1204,596],{"class":569},[564,1206,1207],{"class":566,"line":655},[564,1208,652],{"emptyLinePlaceholder":488},[564,1210,1211,1213,1215],{"class":566,"line":672},[564,1212,570],{"class":569},[564,1214,692],{"class":573},[564,1216,596],{"class":569},[564,1218,1219,1221,1223],{"class":566,"line":682},[564,1220,700],{"class":569},[564,1222,703],{"class":573},[564,1224,596],{"class":569},[564,1226,1227,1229,1231,1233,1235,1237,1239,1241,1243,1245,1247,1249,1251,1253,1255,1257,1260,1262,1264,1266,1268,1270,1272,1274,1276,1278,1280],{"class":566,"line":687},[564,1228,711],{"class":569},[564,1230,714],{"class":573},[564,1232,717],{"class":569},[564,1234,720],{"class":577},[564,1236,584],{"class":569},[564,1238,587],{"class":569},[564,1240,727],{"class":569},[564,1242,731],{"class":730},[564,1244,734],{"class":569},[564,1246,731],{"class":730},[564,1248,734],{"class":569},[564,1250,731],{"class":730},[564,1252,743],{"class":569},[564,1254,587],{"class":569},[564,1256,717],{"class":569},[564,1258,1259],{"class":577},"look-at",[564,1261,584],{"class":569},[564,1263,587],{"class":569},[564,1265,727],{"class":569},[564,1267,861],{"class":730},[564,1269,734],{"class":569},[564,1271,861],{"class":730},[564,1273,734],{"class":569},[564,1275,861],{"class":730},[564,1277,743],{"class":569},[564,1279,587],{"class":569},[564,1281,748],{"class":569},[564,1283,1284,1286,1288],{"class":566,"line":697},[564,1285,711],{"class":569},[564,1287,756],{"class":573},[564,1289,596],{"class":569},[564,1291,1293,1295,1298],{"class":1292,"line":708},[566,600],[564,1294,764],{"class":569},[564,1296,1297],{"class":573},"TresTorusGeometry",[564,1299,748],{"class":569},[564,1301,1302,1304,1307],{"class":566,"line":751},[564,1303,764],{"class":569},[564,1305,1306],{"class":573},"MeshGlassMaterial",[564,1308,748],{"class":569},[564,1310,1311,1313,1315],{"class":566,"line":761},[564,1312,1040],{"class":569},[564,1314,756],{"class":573},[564,1316,596],{"class":569},[564,1318,1319,1321,1323],{"class":566,"line":545},[564,1320,711],{"class":569},[564,1322,1052],{"class":573},[564,1324,748],{"class":569},[564,1326,1327,1329,1332,1334,1336,1338,1340,1342,1344,1346,1349,1351,1354,1356,1358],{"class":566,"line":546},[564,1328,711],{"class":569},[564,1330,1331],{"class":573},"TresDirectionalLight",[564,1333,717],{"class":569},[564,1335,720],{"class":577},[564,1337,584],{"class":569},[564,1339,587],{"class":569},[564,1341,727],{"class":569},[564,1343,861],{"class":730},[564,1345,734],{"class":569},[564,1347,1348],{"class":730},"2",[564,1350,734],{"class":569},[564,1352,1353],{"class":730},"4",[564,1355,743],{"class":569},[564,1357,587],{"class":569},[564,1359,748],{"class":569},[564,1361,1362,1364,1366],{"class":566,"line":547},[564,1363,1060],{"class":569},[564,1365,703],{"class":573},[564,1367,596],{"class":569},[564,1369,1370,1372,1374],{"class":566,"line":548},[564,1371,675],{"class":569},[564,1373,692],{"class":573},[564,1375,596],{"class":569},[536,1377,1077],{"id":1076},[508,1379,1380,1381,1384],{},"No props are required. The component extends ",[512,1382,1383],{},"THREE.MeshPhysicalMaterial"," and accepts all the same props plus additional reflection-specific properties.",[1127,1386,1388],{"id":1387},"you-can-also-replace-the-material-of-an-existing-mesh-like-this","You can also replace the material of an existing mesh like this:",[540,1390,1393],{"className":542,"code":1391,"highlights":1392,"language":560,"meta":480,"style":480},"\u003Cscript setup lang=\"ts\">\nimport { ref, shallowRef, watch } from 'vue'\nimport { TresCanvas } from '@tresjs/core'\nimport { MeshGlassMaterial, Box } from '@tresjs/cientos'\n\nconst glassMaterialRef = shallowRef()\nconst boxRef = shallowRef()\n\nwatch(glassMaterialRef, value => {\n  // For good practice we dispose the old material\n  boxRef.value.instance.material.dispose()\n\n  // We assign the new MeshGlassMaterialClass\n  boxRef.value.instance.material = value.MeshGlassMaterialClass\n})\n\u003C/script>\n\u003Ctemplate>\n  \u003CTresMesh>\n    \u003CTresTorusGeometry />\n    \u003CMeshGlassMaterial ref=\"glassMaterialRef\" />\n  \u003C/TresMesh>\n  \u003C!-- Mesh to be replaced -->\n  \u003CTresMesh ref=\"boxRef\">\n    \u003CTresBoxGeometry />\n    \u003CMeshBasicMaterial  />\n  \u003C/TresMesh>\n\u003C/template>\n",[649,672,682,687,697,708,751,761,545,546,547,552],[512,1394,1395,1415,1444,1462,1486,1490,1504,1518,1523,1544,1551,1578,1583,1589,1616,1625,1633,1641,1649,1657,1677,1685,1690,1709,1717,1727,1735],{"__ignoreMap":480},[564,1396,1397,1399,1401,1403,1405,1407,1409,1411,1413],{"class":566,"line":481},[564,1398,570],{"class":569},[564,1400,574],{"class":573},[564,1402,578],{"class":577},[564,1404,581],{"class":577},[564,1406,584],{"class":569},[564,1408,587],{"class":569},[564,1410,591],{"class":590},[564,1412,587],{"class":569},[564,1414,596],{"class":569},[564,1416,1417,1419,1421,1424,1427,1429,1431,1434,1436,1438,1440,1442],{"class":566,"line":482},[564,1418,604],{"class":603},[564,1420,607],{"class":569},[564,1422,1423],{"class":610}," ref",[564,1425,1426],{"class":569},",",[564,1428,636],{"class":610},[564,1430,1426],{"class":569},[564,1432,1433],{"class":610}," watch",[564,1435,614],{"class":569},[564,1437,617],{"class":603},[564,1439,620],{"class":569},[564,1441,560],{"class":590},[564,1443,626],{"class":569},[564,1445,1446,1448,1450,1452,1454,1456,1458,1460],{"class":566,"line":629},[564,1447,604],{"class":603},[564,1449,607],{"class":569},[564,1451,1166],{"class":610},[564,1453,614],{"class":569},[564,1455,617],{"class":603},[564,1457,620],{"class":569},[564,1459,1175],{"class":590},[564,1461,626],{"class":569},[564,1463,1465,1467,1469,1471,1473,1476,1478,1480,1482,1484],{"class":1464,"line":649},[566,600],[564,1466,604],{"class":603},[564,1468,607],{"class":569},[564,1470,1186],{"class":610},[564,1472,1426],{"class":569},[564,1474,1475],{"class":610}," Box",[564,1477,614],{"class":569},[564,1479,617],{"class":603},[564,1481,620],{"class":569},[564,1483,623],{"class":590},[564,1485,626],{"class":569},[564,1487,1488],{"class":566,"line":655},[564,1489,652],{"emptyLinePlaceholder":488},[564,1491,1493,1495,1498,1500,1502],{"class":1492,"line":672},[566,600],[564,1494,658],{"class":577},[564,1496,1497],{"class":610}," glassMaterialRef ",[564,1499,584],{"class":569},[564,1501,636],{"class":666},[564,1503,669],{"class":610},[564,1505,1507,1509,1512,1514,1516],{"class":1506,"line":682},[566,600],[564,1508,658],{"class":577},[564,1510,1511],{"class":610}," boxRef ",[564,1513,584],{"class":569},[564,1515,636],{"class":666},[564,1517,669],{"class":610},[564,1519,1521],{"class":1520,"line":687},[566,600],[564,1522,652],{"emptyLinePlaceholder":488},[564,1524,1526,1529,1532,1534,1538,1541],{"class":1525,"line":697},[566,600],[564,1527,1528],{"class":666},"watch",[564,1530,1531],{"class":610},"(glassMaterialRef",[564,1533,1426],{"class":569},[564,1535,1537],{"class":1536},"sHdIc"," value",[564,1539,1540],{"class":577}," =>",[564,1542,1543],{"class":569}," {\n",[564,1545,1547],{"class":1546,"line":708},[566,600],[564,1548,1550],{"class":1549},"sHwdD","  // For good practice we dispose the old material\n",[564,1552,1554,1557,1559,1561,1563,1566,1568,1571,1573,1576],{"class":1553,"line":751},[566,600],[564,1555,1556],{"class":610},"  boxRef",[564,1558,534],{"class":569},[564,1560,855],{"class":610},[564,1562,534],{"class":569},[564,1564,1565],{"class":610},"instance",[564,1567,534],{"class":569},[564,1569,1570],{"class":610},"material",[564,1572,534],{"class":569},[564,1574,1575],{"class":666},"dispose",[564,1577,669],{"class":573},[564,1579,1581],{"class":1580,"line":761},[566,600],[564,1582,652],{"emptyLinePlaceholder":488},[564,1584,1586],{"class":1585,"line":545},[566,600],[564,1587,1588],{"class":1549},"  // We assign the new MeshGlassMaterialClass\n",[564,1590,1592,1594,1596,1598,1600,1602,1604,1606,1609,1611,1613],{"class":1591,"line":546},[566,600],[564,1593,1556],{"class":610},[564,1595,534],{"class":569},[564,1597,855],{"class":610},[564,1599,534],{"class":569},[564,1601,1565],{"class":610},[564,1603,534],{"class":569},[564,1605,1570],{"class":610},[564,1607,1608],{"class":569}," =",[564,1610,1537],{"class":610},[564,1612,534],{"class":569},[564,1614,1615],{"class":610},"MeshGlassMaterialClass\n",[564,1617,1619,1622],{"class":1618,"line":547},[566,600],[564,1620,1621],{"class":569},"}",[564,1623,1624],{"class":610},")\n",[564,1626,1627,1629,1631],{"class":566,"line":548},[564,1628,675],{"class":569},[564,1630,574],{"class":573},[564,1632,596],{"class":569},[564,1634,1635,1637,1639],{"class":566,"line":549},[564,1636,570],{"class":569},[564,1638,692],{"class":573},[564,1640,596],{"class":569},[564,1642,1643,1645,1647],{"class":566,"line":550},[564,1644,700],{"class":569},[564,1646,756],{"class":573},[564,1648,596],{"class":569},[564,1650,1651,1653,1655],{"class":566,"line":551},[564,1652,711],{"class":569},[564,1654,1297],{"class":573},[564,1656,748],{"class":569},[564,1658,1660,1662,1664,1666,1668,1670,1673,1675],{"class":1659,"line":552},[566,600],[564,1661,711],{"class":569},[564,1663,1306],{"class":573},[564,1665,1423],{"class":577},[564,1667,584],{"class":569},[564,1669,587],{"class":569},[564,1671,1672],{"class":590},"glassMaterialRef",[564,1674,587],{"class":569},[564,1676,748],{"class":569},[564,1678,1679,1681,1683],{"class":566,"line":553},[564,1680,1060],{"class":569},[564,1682,756],{"class":573},[564,1684,596],{"class":569},[564,1686,1687],{"class":566,"line":554},[564,1688,1689],{"class":1549},"  \u003C!-- Mesh to be replaced -->\n",[564,1691,1692,1694,1696,1698,1700,1702,1705,1707],{"class":566,"line":555},[564,1693,700],{"class":569},[564,1695,756],{"class":573},[564,1697,1423],{"class":577},[564,1699,584],{"class":569},[564,1701,587],{"class":569},[564,1703,1704],{"class":590},"boxRef",[564,1706,587],{"class":569},[564,1708,596],{"class":569},[564,1710,1711,1713,1715],{"class":566,"line":556},[564,1712,711],{"class":569},[564,1714,767],{"class":573},[564,1716,748],{"class":569},[564,1718,1719,1721,1724],{"class":566,"line":557},[564,1720,711],{"class":569},[564,1722,1723],{"class":573},"MeshBasicMaterial",[564,1725,1726],{"class":569},"  />\n",[564,1728,1729,1731,1733],{"class":566,"line":558},[564,1730,1060],{"class":569},[564,1732,756],{"class":573},[564,1734,596],{"class":569},[564,1736,1737,1739,1741],{"class":566,"line":559},[564,1738,675],{"class":569},[564,1740,692],{"class":573},[564,1742,596],{"class":569},[536,1744,1746],{"id":1745},"tips","Tips",[1748,1749,1750,1754],"ul",{},[1751,1752,1753],"li",{},"For more fine tuning effects you can provide an environment map texture as an envMap and play with the intensity to achieve a more realistic effect",[1751,1755,1756],{},"Another good option is to provide a normal texture as clearcoatNormalMap to add different results",[1093,1758,1759],{},"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}html pre.shiki code .sHdIc, html code.shiki .sHdIc{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#EEFFFF;--shiki-default-font-style:italic;--shiki-dark:#BABED8;--shiki-dark-font-style:italic}html pre.shiki code .sHwdD, html code.shiki .sHwdD{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#546E7A;--shiki-default-font-style:italic;--shiki-dark:#676E95;--shiki-dark-font-style:italic}",{"title":480,"searchDepth":481,"depth":482,"links":1761},[1762,1765,1768],{"id":538,"depth":482,"text":15,"children":1763},[1764],{"id":1129,"depth":629,"text":1130},{"id":1076,"depth":482,"text":1077,"children":1766},[1767],{"id":1387,"depth":629,"text":1388},{"id":1745,"depth":482,"text":1746},"Makes a geometry look like glass by re-defining the MeshPhysicalMaterial.",{},{"title":167,"description":1769},"XeLIOrrqO5hF6DK2JnTAyGusif0o80_d6hTc8m5QJQE",{"id":1774,"title":171,"body":1775,"description":2257,"extension":485,"links":486,"meta":2258,"navigation":488,"path":172,"seo":2259,"stem":173,"__hash__":2260},"docs/2.api/4.materials/holographic-material.md",{"type":473,"value":1776,"toc":2252},[1777,1783,1787,1790,1793,1799,1801,2012,2014,2249],[1778,1779,1780],"scene-controls-wrapper",{},[1781,1782],"materials-holographic-material",{},[536,1784,1786],{"id":1785},"a-simple-to-use-holographic-material-for-tresjs","A simple to use holographic material for TresJS",[508,1788,1789],{},"Dive into a world of mesmerizing holographic wonders with the HolographicMaterial for vanilla Three.js. This enchanting Three.js material brings your virtual reality experiences to life, infusing them with a burst of vibrant colors, dynamic scanlines, and a touch of futuristic brilliance.",[508,1791,1792],{},"While this material operates independently of any post-processing, it achieves an enhanced visual appeal when coupled with bloom effects. The utilization of bloom proves particularly effective in rendering a captivating glow effect, especially in areas where overexposure is prevalent.",[1794,1795,1796],"prose-note",{},[508,1797,1798],{},"This component ports Anderson Mancini's threejs-vanilla-holographic-material to TresJS. All credit goes to him.",[536,1800,15],{"id":538},[540,1802,1805],{"className":542,"code":1803,"highlights":1804,"language":560,"meta":480,"style":480},"\u003Cscript setup lang=\"ts\">\nimport { TresCanvas } from '@tresjs/core'\nimport { HolographicMaterial, Sphere } from '@tresjs/cientos'\n\n\u003C/script>\n\u003Ctemplate>\n  \u003CTresCanvas>\n    \u003CTresPerspectiveCamera :position=\"[3, 3, 3]\" :look-at=[0,0,0] />\n    \u003CSphere :scale=\"0.5\">\n      \u003CHolographicMaterial />\n    \u003C/Sphere>\n    \u003CTresAmbientLight />\n  \u003C/TresCanvas>\n\u003C/template>\n",[629,708],[512,1806,1807,1827,1845,1870,1874,1882,1890,1898,1948,1970,1980,1988,1996,2004],{"__ignoreMap":480},[564,1808,1809,1811,1813,1815,1817,1819,1821,1823,1825],{"class":566,"line":481},[564,1810,570],{"class":569},[564,1812,574],{"class":573},[564,1814,578],{"class":577},[564,1816,581],{"class":577},[564,1818,584],{"class":569},[564,1820,587],{"class":569},[564,1822,591],{"class":590},[564,1824,587],{"class":569},[564,1826,596],{"class":569},[564,1828,1829,1831,1833,1835,1837,1839,1841,1843],{"class":566,"line":482},[564,1830,604],{"class":603},[564,1832,607],{"class":569},[564,1834,1166],{"class":610},[564,1836,614],{"class":569},[564,1838,617],{"class":603},[564,1840,620],{"class":569},[564,1842,1175],{"class":590},[564,1844,626],{"class":569},[564,1846,1848,1850,1852,1855,1857,1860,1862,1864,1866,1868],{"class":1847,"line":629},[566,600],[564,1849,604],{"class":603},[564,1851,607],{"class":569},[564,1853,1854],{"class":610}," HolographicMaterial",[564,1856,1426],{"class":569},[564,1858,1859],{"class":610}," Sphere",[564,1861,614],{"class":569},[564,1863,617],{"class":603},[564,1865,620],{"class":569},[564,1867,623],{"class":590},[564,1869,626],{"class":569},[564,1871,1872],{"class":566,"line":649},[564,1873,652],{"emptyLinePlaceholder":488},[564,1875,1876,1878,1880],{"class":566,"line":655},[564,1877,675],{"class":569},[564,1879,574],{"class":573},[564,1881,596],{"class":569},[564,1883,1884,1886,1888],{"class":566,"line":672},[564,1885,570],{"class":569},[564,1887,692],{"class":573},[564,1889,596],{"class":569},[564,1891,1892,1894,1896],{"class":566,"line":682},[564,1893,700],{"class":569},[564,1895,703],{"class":573},[564,1897,596],{"class":569},[564,1899,1900,1902,1904,1906,1908,1910,1912,1914,1916,1918,1920,1922,1924,1926,1928,1930,1932,1935,1937,1939,1941,1943,1945],{"class":566,"line":687},[564,1901,711],{"class":569},[564,1903,714],{"class":573},[564,1905,717],{"class":569},[564,1907,720],{"class":577},[564,1909,584],{"class":569},[564,1911,587],{"class":569},[564,1913,727],{"class":569},[564,1915,731],{"class":730},[564,1917,734],{"class":569},[564,1919,731],{"class":730},[564,1921,734],{"class":569},[564,1923,731],{"class":730},[564,1925,743],{"class":569},[564,1927,587],{"class":569},[564,1929,717],{"class":569},[564,1931,1259],{"class":577},[564,1933,1934],{"class":569},"=[",[564,1936,861],{"class":730},[564,1938,1426],{"class":569},[564,1940,861],{"class":730},[564,1942,1426],{"class":569},[564,1944,861],{"class":730},[564,1946,1947],{"class":569},"] />\n",[564,1949,1950,1952,1954,1956,1959,1961,1963,1966,1968],{"class":566,"line":697},[564,1951,711],{"class":569},[564,1953,261],{"class":573},[564,1955,717],{"class":569},[564,1957,1958],{"class":577},"scale",[564,1960,584],{"class":569},[564,1962,587],{"class":569},[564,1964,1965],{"class":730},"0.5",[564,1967,587],{"class":569},[564,1969,596],{"class":569},[564,1971,1973,1975,1978],{"class":1972,"line":708},[566,600],[564,1974,764],{"class":569},[564,1976,1977],{"class":573},"HolographicMaterial",[564,1979,748],{"class":569},[564,1981,1982,1984,1986],{"class":566,"line":751},[564,1983,1040],{"class":569},[564,1985,261],{"class":573},[564,1987,596],{"class":569},[564,1989,1990,1992,1994],{"class":566,"line":761},[564,1991,711],{"class":569},[564,1993,1052],{"class":573},[564,1995,748],{"class":569},[564,1997,1998,2000,2002],{"class":566,"line":545},[564,1999,1060],{"class":569},[564,2001,703],{"class":573},[564,2003,596],{"class":569},[564,2005,2006,2008,2010],{"class":566,"line":546},[564,2007,675],{"class":569},[564,2009,692],{"class":573},[564,2011,596],{"class":569},[536,2013,1077],{"id":1076},[2015,2016,2017,2037],"table",{},[2018,2019,2020],"thead",{},[2021,2022,2023,2028,2031,2034],"tr",{},[2024,2025,2027],"th",{"align":2026},"left","Prop",[2024,2029,2030],{"align":2026},"Description",[2024,2032,2033],{},"Type",[2024,2035,2036],{},"default",[2038,2039,2040,2062,2081,2100,2119,2137,2157,2176,2194,2212,2230],"tbody",{},[2021,2041,2042,2049,2052,2057],{},[2043,2044,2045],"td",{"align":2026},[2046,2047,2048],"strong",{},"fresnelAmount",[2043,2050,2051],{"align":2026},"Value of the Fresnel effect. Ranges from 0.0 to 1.0.",[2043,2053,2054],{},[512,2055,2056],{},"Number",[2043,2058,2059],{},[512,2060,2061],{},"0.45",[2021,2063,2064,2069,2072,2076],{},[2043,2065,2066],{"align":2026},[2046,2067,2068],{},"fresnelOpacity",[2043,2070,2071],{"align":2026},"Opacity of the Fresnel effect. Ranges from 0.0 to 1.0.",[2043,2073,2074],{},[512,2075,2056],{},[2043,2077,2078],{},[512,2079,2080],{},"1.0",[2021,2082,2083,2088,2091,2095],{},[2043,2084,2085],{"align":2026},[2046,2086,2087],{},"scanlineSize",[2043,2089,2090],{"align":2026},"Size of the scanlines. Ranges from 1 to 15.",[2043,2092,2093],{},[512,2094,2056],{},[2043,2096,2097],{},[512,2098,2099],{},"8.0",[2021,2101,2102,2107,2110,2114],{},[2043,2103,2104],{"align":2026},[2046,2105,2106],{},"hologramBrightness",[2043,2108,2109],{"align":2026},"Brightness of the hologram. Ranges from 0.0 to 2.0.",[2043,2111,2112],{},[512,2113,2056],{},[2043,2115,2116],{},[512,2117,2118],{},"1.2",[2021,2120,2121,2126,2129,2133],{},[2043,2122,2123],{"align":2026},[2046,2124,2125],{},"signalSpeed",[2043,2127,2128],{"align":2026},"Speed of the signal effect. Ranges from 0.0 to 2.0.",[2043,2130,2131],{},[512,2132,2056],{},[2043,2134,2135],{},[512,2136,2061],{},[2021,2138,2139,2144,2147,2152],{},[2043,2140,2141],{"align":2026},[2046,2142,2143],{},"hologramColor",[2043,2145,2146],{"align":2026},"Specifies the color of the hologram.",[2043,2148,2149],{},[512,2150,2151],{},"String",[2043,2153,2154],{},[512,2155,2156],{},"\"#00d5ff\"",[2021,2158,2159,2164,2167,2172],{},[2043,2160,2161],{"align":2026},[2046,2162,2163],{},"enableBlinking",[2043,2165,2166],{"align":2026},"Enables or disables the blinking effect.",[2043,2168,2169],{},[512,2170,2171],{},"Boolean",[2043,2173,2174],{},[512,2175,950],{},[2021,2177,2178,2183,2186,2190],{},[2043,2179,2180],{"align":2026},[2046,2181,2182],{},"hologramOpacity",[2043,2184,2185],{"align":2026},"Specifies the opacity of the hologram.",[2043,2187,2188],{},[512,2189,2056],{},[2043,2191,2192],{},[512,2193,2080],{},[2021,2195,2196,2201,2204,2208],{},[2043,2197,2198],{"align":2026},[2046,2199,2200],{},"blinkFresnelOnly",[2043,2202,2203],{"align":2026},"Enables or disables the blinking effect for the Fresnel only.",[2043,2205,2206],{},[512,2207,2171],{},[2043,2209,2210],{},[512,2211,950],{},[2021,2213,2214,2219,2222,2226],{},[2043,2215,2216],{"align":2026},[2046,2217,2218],{},"enableAdditive",[2043,2220,2221],{"align":2026},"Enables or disables the Additive Blend Mode.",[2043,2223,2224],{},[512,2225,2171],{},[2043,2227,2228],{},[512,2229,950],{},[2021,2231,2232,2236,2239,2244],{},[2043,2233,2234],{"align":2026},[2046,2235,960],{},[2043,2237,2238],{"align":2026},"Specifies side for the material, as String.",[2043,2240,2241],{},[512,2242,2243],{},"THREE.FrontSide, THREE.BackSide, THREE.DoubleSide",[2043,2245,2246],{},[512,2247,2248],{},"FrontSide",[1093,2250,2251],{},"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":480,"searchDepth":481,"depth":482,"links":2253},[2254,2255,2256],{"id":1785,"depth":482,"text":1786},{"id":538,"depth":482,"text":15},{"id":1076,"depth":482,"text":1077},"A simple to use holographic material for TresJS with vibrant colors, dynamic scanlines, and futuristic brilliance.",{},{"title":171,"description":2257},"qI6m7jV8AEZ5_Ruhn6hSlmpTi7LrcHgetMD_vYArm8Y",{"id":2262,"title":175,"body":2263,"description":2429,"extension":485,"links":486,"meta":2430,"navigation":488,"path":176,"seo":2431,"stem":177,"__hash__":2432},"docs/2.api/4.materials/mesh-discard-material.md",{"type":473,"value":2264,"toc":2426},[2265,2271,2273,2423],[508,2266,2267,2270],{},[512,2268,2269],{},"\u003CMeshDiscardMaterial />"," hides the object it's attached to. The object's shadows and children will be rendered.",[536,2272,15],{"id":538},[540,2274,2277],{"className":542,"code":2275,"highlights":2276,"language":560,"meta":480,"style":480},"\u003Cscript setup lang=\"ts\">\nimport { TresCanvas } from '@tresjs/core'\nimport { MeshDiscardMaterial } from '@tresjs/cientos'\n\u003C/script>\n\n\u003Ctemplate>\n  \u003CTresCanvas>\n    \u003CTresPerspectiveCamera />\n    \u003CTresMesh>\n      \u003CTresBoxGeometry />\n      \u003CMeshDiscardMaterial />\n    \u003C/TresMesh>\n  \u003C/TresCanvas>\n\u003C/template>\n",[629,751],[512,2278,2279,2299,2317,2337,2345,2349,2357,2365,2373,2381,2389,2399,2407,2415],{"__ignoreMap":480},[564,2280,2281,2283,2285,2287,2289,2291,2293,2295,2297],{"class":566,"line":481},[564,2282,570],{"class":569},[564,2284,574],{"class":573},[564,2286,578],{"class":577},[564,2288,581],{"class":577},[564,2290,584],{"class":569},[564,2292,587],{"class":569},[564,2294,591],{"class":590},[564,2296,587],{"class":569},[564,2298,596],{"class":569},[564,2300,2301,2303,2305,2307,2309,2311,2313,2315],{"class":566,"line":482},[564,2302,604],{"class":603},[564,2304,607],{"class":569},[564,2306,1166],{"class":610},[564,2308,614],{"class":569},[564,2310,617],{"class":603},[564,2312,620],{"class":569},[564,2314,1175],{"class":590},[564,2316,626],{"class":569},[564,2318,2320,2322,2324,2327,2329,2331,2333,2335],{"class":2319,"line":629},[566,600],[564,2321,604],{"class":603},[564,2323,607],{"class":569},[564,2325,2326],{"class":610}," MeshDiscardMaterial",[564,2328,614],{"class":569},[564,2330,617],{"class":603},[564,2332,620],{"class":569},[564,2334,623],{"class":590},[564,2336,626],{"class":569},[564,2338,2339,2341,2343],{"class":566,"line":649},[564,2340,675],{"class":569},[564,2342,574],{"class":573},[564,2344,596],{"class":569},[564,2346,2347],{"class":566,"line":655},[564,2348,652],{"emptyLinePlaceholder":488},[564,2350,2351,2353,2355],{"class":566,"line":672},[564,2352,570],{"class":569},[564,2354,692],{"class":573},[564,2356,596],{"class":569},[564,2358,2359,2361,2363],{"class":566,"line":682},[564,2360,700],{"class":569},[564,2362,703],{"class":573},[564,2364,596],{"class":569},[564,2366,2367,2369,2371],{"class":566,"line":687},[564,2368,711],{"class":569},[564,2370,714],{"class":573},[564,2372,748],{"class":569},[564,2374,2375,2377,2379],{"class":566,"line":697},[564,2376,711],{"class":569},[564,2378,756],{"class":573},[564,2380,596],{"class":569},[564,2382,2383,2385,2387],{"class":566,"line":708},[564,2384,764],{"class":569},[564,2386,767],{"class":573},[564,2388,748],{"class":569},[564,2390,2392,2394,2397],{"class":2391,"line":751},[566,600],[564,2393,764],{"class":569},[564,2395,2396],{"class":573},"MeshDiscardMaterial",[564,2398,748],{"class":569},[564,2400,2401,2403,2405],{"class":566,"line":761},[564,2402,1040],{"class":569},[564,2404,756],{"class":573},[564,2406,596],{"class":569},[564,2408,2409,2411,2413],{"class":566,"line":545},[564,2410,1060],{"class":569},[564,2412,703],{"class":573},[564,2414,596],{"class":569},[564,2416,2417,2419,2421],{"class":566,"line":546},[564,2418,675],{"class":569},[564,2420,692],{"class":573},[564,2422,596],{"class":569},[1093,2424,2425],{},"html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html pre.shiki code .s7zQu, html code.shiki .s7zQu{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}",{"title":480,"searchDepth":481,"depth":482,"links":2427},[2428],{"id":538,"depth":482,"text":15},"Hides the object it's attached to while keeping shadows and children visible.",{},{"title":175,"description":2429},"ivSz3UBTzifkzor3XvoS_5CUJD_0d-7Dh7JvwBwFh80",{"id":2434,"title":179,"body":2435,"description":3279,"extension":485,"links":486,"meta":3280,"navigation":488,"path":180,"seo":3281,"stem":181,"__hash__":3282},"docs/2.api/4.materials/mesh-reflection-material.md",{"type":473,"value":2436,"toc":3275},[2437,2442,2454,2463,2470,2472,2970,2972,3247,3273],[1778,2438,2439],{},[2440,2441],"materials-mesh-reflection-material",{},[508,2443,510,2444,2446,2447,2450,2451,534],{},[512,2445,514],{}," package provides a ",[512,2448,2449],{},"\u003CMeshReflectionMaterial />"," component for making floors or walls that reflect the objects in your ",[512,2452,2453],{},"Scene",[508,2455,2456,2457,2462],{},"The component is based on the excellent ",[521,2458,2461],{"href":2459,"rel":2460},"https://github.com/pmndrs/drei",[525],"Drei"," component of the same name.",[508,2464,2465,2466,2469],{},"It extends ",[512,2467,2468],{},"THREE.MeshStandardMaterial"," and accepts all the same props.",[536,2471,15],{"id":538},[540,2473,2476],{"className":542,"code":2474,"highlights":2475,"language":560,"meta":480,"style":480},"\u003Cscript setup lang=\"ts\">\nimport { TresCanvas } from '@tresjs/core'\nimport { MeshReflectionMaterial } from '@tresjs/cientos'\n\u003C/script>\n\n\u003Ctemplate>\n  \u003CTresCanvas>\n    \u003CTresPerspectiveCamera :position=\"[3, 3, 3]\" :look-at=\"[0, 0, 0]\" />\n    \u003CTresMesh :rotation=\"[-Math.PI / 2, 0, 0]\">\n      \u003CTresPlaneGeometry :args=\"[10, 10]\" />\n      \u003CMeshReflectionMaterial\n        :blur=\"[300, 100]\"\n        :mixBlur=\"30\"\n        :mixStrength=\"80\"\n        :mixContrast=\"1\"\n        color=\"#a0a0a0\"\n        metalness=\"0.5\"\n        roughness=\"1\"\n        mirror=\"0\"\n      />\n    \u003C/TresMesh>\n    \u003CTresMesh :position=\"[0, 1, 0]\">\n      \u003CTresBoxGeometry />\n      \u003CTresMeshStandardMaterial color=\"orange\" />\n    \u003C/TresMesh>\n    \u003CTresAmbientLight />\n    \u003CTresDirectionalLight :position=\"[0, 2, 4]\" />\n  \u003C/TresCanvas>\n\u003C/template>\n",[629,548,549,550,551],[512,2477,2478,2498,2516,2536,2544,2548,2556,2564,2620,2665,2696,2703,2728,2744,2760,2776,2791,2805,2819,2833,2837,2845,2877,2885,2906,2914,2922,2954,2962],{"__ignoreMap":480},[564,2479,2480,2482,2484,2486,2488,2490,2492,2494,2496],{"class":566,"line":481},[564,2481,570],{"class":569},[564,2483,574],{"class":573},[564,2485,578],{"class":577},[564,2487,581],{"class":577},[564,2489,584],{"class":569},[564,2491,587],{"class":569},[564,2493,591],{"class":590},[564,2495,587],{"class":569},[564,2497,596],{"class":569},[564,2499,2500,2502,2504,2506,2508,2510,2512,2514],{"class":566,"line":482},[564,2501,604],{"class":603},[564,2503,607],{"class":569},[564,2505,1166],{"class":610},[564,2507,614],{"class":569},[564,2509,617],{"class":603},[564,2511,620],{"class":569},[564,2513,1175],{"class":590},[564,2515,626],{"class":569},[564,2517,2519,2521,2523,2526,2528,2530,2532,2534],{"class":2518,"line":629},[566,600],[564,2520,604],{"class":603},[564,2522,607],{"class":569},[564,2524,2525],{"class":610}," MeshReflectionMaterial",[564,2527,614],{"class":569},[564,2529,617],{"class":603},[564,2531,620],{"class":569},[564,2533,623],{"class":590},[564,2535,626],{"class":569},[564,2537,2538,2540,2542],{"class":566,"line":649},[564,2539,675],{"class":569},[564,2541,574],{"class":573},[564,2543,596],{"class":569},[564,2545,2546],{"class":566,"line":655},[564,2547,652],{"emptyLinePlaceholder":488},[564,2549,2550,2552,2554],{"class":566,"line":672},[564,2551,570],{"class":569},[564,2553,692],{"class":573},[564,2555,596],{"class":569},[564,2557,2558,2560,2562],{"class":566,"line":682},[564,2559,700],{"class":569},[564,2561,703],{"class":573},[564,2563,596],{"class":569},[564,2565,2566,2568,2570,2572,2574,2576,2578,2580,2582,2584,2586,2588,2590,2592,2594,2596,2598,2600,2602,2604,2606,2608,2610,2612,2614,2616,2618],{"class":566,"line":687},[564,2567,711],{"class":569},[564,2569,714],{"class":573},[564,2571,717],{"class":569},[564,2573,720],{"class":577},[564,2575,584],{"class":569},[564,2577,587],{"class":569},[564,2579,727],{"class":569},[564,2581,731],{"class":730},[564,2583,734],{"class":569},[564,2585,731],{"class":730},[564,2587,734],{"class":569},[564,2589,731],{"class":730},[564,2591,743],{"class":569},[564,2593,587],{"class":569},[564,2595,717],{"class":569},[564,2597,1259],{"class":577},[564,2599,584],{"class":569},[564,2601,587],{"class":569},[564,2603,727],{"class":569},[564,2605,861],{"class":730},[564,2607,734],{"class":569},[564,2609,861],{"class":730},[564,2611,734],{"class":569},[564,2613,861],{"class":730},[564,2615,743],{"class":569},[564,2617,587],{"class":569},[564,2619,748],{"class":569},[564,2621,2622,2624,2626,2628,2631,2633,2635,2638,2641,2643,2646,2649,2651,2653,2655,2657,2659,2661,2663],{"class":566,"line":697},[564,2623,711],{"class":569},[564,2625,756],{"class":573},[564,2627,717],{"class":569},[564,2629,2630],{"class":577},"rotation",[564,2632,584],{"class":569},[564,2634,587],{"class":569},[564,2636,2637],{"class":569},"[-",[564,2639,2640],{"class":610},"Math",[564,2642,534],{"class":569},[564,2644,2645],{"class":610},"PI",[564,2647,2648],{"class":569}," / ",[564,2650,1348],{"class":730},[564,2652,734],{"class":569},[564,2654,861],{"class":730},[564,2656,734],{"class":569},[564,2658,861],{"class":730},[564,2660,743],{"class":569},[564,2662,587],{"class":569},[564,2664,596],{"class":569},[564,2666,2667,2669,2672,2674,2677,2679,2681,2683,2686,2688,2690,2692,2694],{"class":566,"line":708},[564,2668,764],{"class":569},[564,2670,2671],{"class":573},"TresPlaneGeometry",[564,2673,717],{"class":569},[564,2675,2676],{"class":577},"args",[564,2678,584],{"class":569},[564,2680,587],{"class":569},[564,2682,727],{"class":569},[564,2684,2685],{"class":730},"10",[564,2687,734],{"class":569},[564,2689,2685],{"class":730},[564,2691,743],{"class":569},[564,2693,587],{"class":569},[564,2695,748],{"class":569},[564,2697,2698,2700],{"class":566,"line":751},[564,2699,764],{"class":569},[564,2701,2702],{"class":573},"MeshReflectionMaterial\n",[564,2704,2705,2707,2710,2712,2714,2716,2719,2721,2724,2726],{"class":566,"line":761},[564,2706,799],{"class":569},[564,2708,2709],{"class":577},"blur",[564,2711,584],{"class":569},[564,2713,587],{"class":569},[564,2715,727],{"class":569},[564,2717,2718],{"class":730},"300",[564,2720,734],{"class":569},[564,2722,2723],{"class":730},"100",[564,2725,743],{"class":569},[564,2727,793],{"class":569},[564,2729,2730,2732,2735,2737,2739,2742],{"class":566,"line":545},[564,2731,799],{"class":569},[564,2733,2734],{"class":577},"mixBlur",[564,2736,584],{"class":569},[564,2738,587],{"class":569},[564,2740,2741],{"class":730},"30",[564,2743,793],{"class":569},[564,2745,2746,2748,2751,2753,2755,2758],{"class":566,"line":546},[564,2747,799],{"class":569},[564,2749,2750],{"class":577},"mixStrength",[564,2752,584],{"class":569},[564,2754,587],{"class":569},[564,2756,2757],{"class":730},"80",[564,2759,793],{"class":569},[564,2761,2762,2764,2767,2769,2771,2774],{"class":566,"line":547},[564,2763,799],{"class":569},[564,2765,2766],{"class":577},"mixContrast",[564,2768,584],{"class":569},[564,2770,587],{"class":569},[564,2772,2773],{"class":730},"1",[564,2775,793],{"class":569},[564,2777,2779,2782,2784,2786,2789],{"class":2778,"line":548},[566,600],[564,2780,2781],{"class":577},"        color",[564,2783,584],{"class":569},[564,2785,587],{"class":569},[564,2787,2788],{"class":590},"#a0a0a0",[564,2790,793],{"class":569},[564,2792,2794,2797,2799,2801,2803],{"class":2793,"line":549},[566,600],[564,2795,2796],{"class":577},"        metalness",[564,2798,584],{"class":569},[564,2800,587],{"class":569},[564,2802,1965],{"class":590},[564,2804,793],{"class":569},[564,2806,2808,2811,2813,2815,2817],{"class":2807,"line":550},[566,600],[564,2809,2810],{"class":577},"        roughness",[564,2812,584],{"class":569},[564,2814,587],{"class":569},[564,2816,2773],{"class":590},[564,2818,793],{"class":569},[564,2820,2822,2825,2827,2829,2831],{"class":2821,"line":551},[566,600],[564,2823,2824],{"class":577},"        mirror",[564,2826,584],{"class":569},[564,2828,587],{"class":569},[564,2830,861],{"class":590},[564,2832,793],{"class":569},[564,2834,2835],{"class":566,"line":552},[564,2836,1034],{"class":569},[564,2838,2839,2841,2843],{"class":566,"line":553},[564,2840,1040],{"class":569},[564,2842,756],{"class":573},[564,2844,596],{"class":569},[564,2846,2847,2849,2851,2853,2855,2857,2859,2861,2863,2865,2867,2869,2871,2873,2875],{"class":566,"line":554},[564,2848,711],{"class":569},[564,2850,756],{"class":573},[564,2852,717],{"class":569},[564,2854,720],{"class":577},[564,2856,584],{"class":569},[564,2858,587],{"class":569},[564,2860,727],{"class":569},[564,2862,861],{"class":730},[564,2864,734],{"class":569},[564,2866,2773],{"class":730},[564,2868,734],{"class":569},[564,2870,861],{"class":730},[564,2872,743],{"class":569},[564,2874,587],{"class":569},[564,2876,596],{"class":569},[564,2878,2879,2881,2883],{"class":566,"line":555},[564,2880,764],{"class":569},[564,2882,767],{"class":573},[564,2884,748],{"class":569},[564,2886,2887,2889,2892,2895,2897,2899,2902,2904],{"class":566,"line":556},[564,2888,764],{"class":569},[564,2890,2891],{"class":573},"TresMeshStandardMaterial",[564,2893,2894],{"class":577}," color",[564,2896,584],{"class":569},[564,2898,587],{"class":569},[564,2900,2901],{"class":590},"orange",[564,2903,587],{"class":569},[564,2905,748],{"class":569},[564,2907,2908,2910,2912],{"class":566,"line":557},[564,2909,1040],{"class":569},[564,2911,756],{"class":573},[564,2913,596],{"class":569},[564,2915,2916,2918,2920],{"class":566,"line":558},[564,2917,711],{"class":569},[564,2919,1052],{"class":573},[564,2921,748],{"class":569},[564,2923,2924,2926,2928,2930,2932,2934,2936,2938,2940,2942,2944,2946,2948,2950,2952],{"class":566,"line":559},[564,2925,711],{"class":569},[564,2927,1331],{"class":573},[564,2929,717],{"class":569},[564,2931,720],{"class":577},[564,2933,584],{"class":569},[564,2935,587],{"class":569},[564,2937,727],{"class":569},[564,2939,861],{"class":730},[564,2941,734],{"class":569},[564,2943,1348],{"class":730},[564,2945,734],{"class":569},[564,2947,1353],{"class":730},[564,2949,743],{"class":569},[564,2951,587],{"class":569},[564,2953,748],{"class":569},[564,2955,2956,2958,2960],{"class":566,"line":1031},[564,2957,1060],{"class":569},[564,2959,703],{"class":573},[564,2961,596],{"class":569},[564,2963,2964,2966,2968],{"class":566,"line":1037},[564,2965,675],{"class":569},[564,2967,692],{"class":573},[564,2969,596],{"class":569},[536,2971,1077],{"id":1076},[2015,2973,2974,2986],{},[2018,2975,2976],{},[2021,2977,2978,2981,2983],{},[2024,2979,2980],{"align":2026},"Name",[2024,2982,2030],{"align":2026},[2024,2984,2985],{},"Default",[2038,2987,2988,3003,3017,3031,3048,3062,3076,3090,3104,3118,3135,3149,3163,3177,3202,3217,3233],{},[2021,2989,2990,2995,2998],{},[2043,2991,2992],{"align":2026},[512,2993,2994],{},"resolution",[2043,2996,2997],{"align":2026},"Length in pixels of one side of the square reflective textures",[2043,2999,3000],{},[512,3001,3002],{},"256",[2021,3004,3005,3010,3013],{},[2043,3006,3007],{"align":2026},[512,3008,3009],{},"mix",[2043,3011,3012],{"align":2026},"Overall strength of the reflection",[2043,3014,3015],{},[512,3016,2773],{},[2021,3018,3019,3024,3027],{},[2043,3020,3021],{"align":2026},[512,3022,3023],{},"sharpMix",[2043,3025,3026],{"align":2026},"Strength of the sharp reflection on smooth surfaces",[2043,3028,3029],{},[512,3030,2773],{},[2021,3032,3033,3038,3044],{},[2043,3034,3035],{"align":2026},[512,3036,3037],{},"sharpDepthScale",[2043,3039,3040,3041,3043],{"align":2026},"Sharp reflection can be faded out by depth – distance from the reflective surface. Performance note: if the value is greater than ",[512,3042,861],{},", a depth texture will be created",[2043,3045,3046],{},[512,3047,2773],{},[2021,3049,3050,3055,3058],{},[2043,3051,3052],{"align":2026},[512,3053,3054],{},"sharpDepthBias",[2043,3056,3057],{"align":2026},"Sharp reflection depth falloff bias",[2043,3059,3060],{},[512,3061,861],{},[2021,3063,3064,3069,3072],{},[2043,3065,3066],{"align":2026},[512,3067,3068],{},"sharpDepthEdgeMin",[2043,3070,3071],{"align":2026},"Sharp reflection depth falloff start",[2043,3073,3074],{},[512,3075,861],{},[2021,3077,3078,3083,3086],{},[2043,3079,3080],{"align":2026},[512,3081,3082],{},"sharpDepthEdgeMax",[2043,3084,3085],{"align":2026},"Sharp reflection depth falloff end",[2043,3087,3088],{},[512,3089,891],{},[2021,3091,3092,3097,3100],{},[2043,3093,3094],{"align":2026},[512,3095,3096],{},"blurMixSmooth",[2043,3098,3099],{"align":2026},"Strength of the blurred reflection on smooth surfaces",[2043,3101,3102],{},[512,3103,2773],{},[2021,3105,3106,3111,3114],{},[2043,3107,3108],{"align":2026},[512,3109,3110],{},"blurMixRough",[2043,3112,3113],{"align":2026},"Strength of the blurred reflection on rough surfaces",[2043,3115,3116],{},[512,3117,2773],{},[2021,3119,3120,3125,3131],{},[2043,3121,3122],{"align":2026},[512,3123,3124],{},"blurDepthScale",[2043,3126,3127,3128,3130],{"align":2026},"Blurred reflection can spread out by depth – distance from the reflective surface. Performance note: if the value is greater than ",[512,3129,861],{},", depth texture will be rendered",[2043,3132,3133],{},[512,3134,2773],{},[2021,3136,3137,3142,3145],{},[2043,3138,3139],{"align":2026},[512,3140,3141],{},"blurDepthBias",[2043,3143,3144],{"align":2026},"Blurred reflection depth spread bias",[2043,3146,3147],{},[512,3148,861],{},[2021,3150,3151,3156,3159],{},[2043,3152,3153],{"align":2026},[512,3154,3155],{},"blurDepthEdgeMin",[2043,3157,3158],{"align":2026},"Blurred reflection depth spread start",[2043,3160,3161],{},[512,3162,861],{},[2021,3164,3165,3170,3173],{},[2043,3166,3167],{"align":2026},[512,3168,3169],{},"blurDepthEdgeMax",[2043,3171,3172],{"align":2026},"Blurred reflection depth spread end",[2043,3174,3175],{},[512,3176,891],{},[2021,3178,3179,3184,3198],{},[2043,3180,3181],{"align":2026},[512,3182,3183],{},"blurSize",[2043,3185,3186,3187,3190,3191,3194,3195,3197],{"align":2026},"Size of the blur. If ",[512,3188,3189],{},"[number, number]",", first number is width, second is height. Performance note: if other than ",[512,3192,3193],{},"[0, 0]"," or ",[512,3196,861],{},", a blur texture will be rendered",[2043,3199,3200],{},[512,3201,3193],{},[2021,3203,3204,3209,3212],{},[2043,3205,3206],{"align":2026},[512,3207,3208],{},"distortionMap",[2043,3210,3211],{"align":2026},"Texture for offsetting the reflection",[2043,3213,3214],{},[512,3215,3216],{},"undefined",[2021,3218,3219,3224,3229],{},[2043,3220,3221],{"align":2026},[512,3222,3223],{},"distortion",[2043,3225,3226,3227],{"align":2026},"Influence of ",[512,3228,3208],{},[2043,3230,3231],{},[512,3232,861],{},[2021,3234,3235,3240,3243],{},[2043,3236,3237],{"align":2026},[512,3238,3239],{},"reflectorOffset",[2043,3241,3242],{"align":2026},"Offsets the reflection",[2043,3244,3245],{},[512,3246,861],{},[508,3248,3249,3250,3252,3253,734,3255,734,3258,734,3261,734,3263,734,3266,734,3269,3272],{},"Additionally, the component extends ",[512,3251,2468],{}," and accepts all the same props including ",[512,3254,1019],{},[512,3256,3257],{},"roughness",[512,3259,3260],{},"metalness",[512,3262,1002],{},[512,3264,3265],{},"normalMap",[512,3267,3268],{},"roughnessMap",[512,3270,3271],{},"metalnessMap",", and more.",[1093,3274,2251],{},{"title":480,"searchDepth":481,"depth":482,"links":3276},[3277,3278],{"id":538,"depth":482,"text":15},{"id":1076,"depth":482,"text":1077},"Makes floors or walls that reflect the objects in your Scene.",{},{"title":179,"description":3279},"SmQ10ERsYJAK7ytDjV3ZCr9APJRPR6MGXbpwBm6D2G8",{"id":3284,"title":183,"body":3285,"description":3606,"extension":485,"links":486,"meta":3607,"navigation":488,"path":184,"seo":3608,"stem":185,"__hash__":3609},"docs/2.api/4.materials/point-material.md",{"type":473,"value":3286,"toc":3602},[3287,3292,3302,3308,3310,3584,3586,3600],[502,3288,3289],{},[3290,3291],"materials-point-material",{},[508,3293,3294,3297,3298,3301],{},[512,3295,3296],{},"\u003CPointMaterial />"," extends ",[512,3299,3300],{},"THREE.PointsMaterial",". It renders the points as dots, rather than the default squares.",[3303,3304,3305],"prose-warning",{},[508,3306,3307],{},"N.B., stacking order and transparency of objects using THREE.PointsMaterial and by extension PointMaterial can be somewhat unintuitive, especially when combined with other on-screen objects. Please see discussions at threejs.org for more infomation.",[536,3309,15],{"id":538},[540,3311,3314],{"className":542,"code":3312,"highlights":3313,"language":560,"meta":480,"style":480},"\u003Cscript setup lang=\"ts\">\nimport { TresCanvas } from '@tresjs/core'\nimport { PointMaterial, OrbitControls } from '@tresjs/cientos'\n\u003C/script>\n\n\u003Ctemplate>\n  \u003CTresCanvas>\n    \u003CTresPerspectiveCamera :position=\"[3, 3, 3]\" :look-at=\"[0, 0, 0]\" />\n    \u003COrbitControls />\n    \u003CTresPoints>\n      \u003CTresIcosahedronGeometry :args=\"[1, 4]\" />\n      \u003CPointMaterial\n        :size=\"5\"\n        color=\"orange\"\n      />\n    \u003C/TresPoints>\n    \u003CTresAmbientLight />\n  \u003C/TresCanvas>\n\u003C/template>\n",[629,761,545,546],[512,3315,3316,3336,3354,3379,3387,3391,3399,3407,3463,3472,3481,3510,3518,3535,3548,3552,3560,3568,3576],{"__ignoreMap":480},[564,3317,3318,3320,3322,3324,3326,3328,3330,3332,3334],{"class":566,"line":481},[564,3319,570],{"class":569},[564,3321,574],{"class":573},[564,3323,578],{"class":577},[564,3325,581],{"class":577},[564,3327,584],{"class":569},[564,3329,587],{"class":569},[564,3331,591],{"class":590},[564,3333,587],{"class":569},[564,3335,596],{"class":569},[564,3337,3338,3340,3342,3344,3346,3348,3350,3352],{"class":566,"line":482},[564,3339,604],{"class":603},[564,3341,607],{"class":569},[564,3343,1166],{"class":610},[564,3345,614],{"class":569},[564,3347,617],{"class":603},[564,3349,620],{"class":569},[564,3351,1175],{"class":590},[564,3353,626],{"class":569},[564,3355,3357,3359,3361,3364,3366,3369,3371,3373,3375,3377],{"class":3356,"line":629},[566,600],[564,3358,604],{"class":603},[564,3360,607],{"class":569},[564,3362,3363],{"class":610}," PointMaterial",[564,3365,1426],{"class":569},[564,3367,3368],{"class":610}," OrbitControls",[564,3370,614],{"class":569},[564,3372,617],{"class":603},[564,3374,620],{"class":569},[564,3376,623],{"class":590},[564,3378,626],{"class":569},[564,3380,3381,3383,3385],{"class":566,"line":649},[564,3382,675],{"class":569},[564,3384,574],{"class":573},[564,3386,596],{"class":569},[564,3388,3389],{"class":566,"line":655},[564,3390,652],{"emptyLinePlaceholder":488},[564,3392,3393,3395,3397],{"class":566,"line":672},[564,3394,570],{"class":569},[564,3396,692],{"class":573},[564,3398,596],{"class":569},[564,3400,3401,3403,3405],{"class":566,"line":682},[564,3402,700],{"class":569},[564,3404,703],{"class":573},[564,3406,596],{"class":569},[564,3408,3409,3411,3413,3415,3417,3419,3421,3423,3425,3427,3429,3431,3433,3435,3437,3439,3441,3443,3445,3447,3449,3451,3453,3455,3457,3459,3461],{"class":566,"line":687},[564,3410,711],{"class":569},[564,3412,714],{"class":573},[564,3414,717],{"class":569},[564,3416,720],{"class":577},[564,3418,584],{"class":569},[564,3420,587],{"class":569},[564,3422,727],{"class":569},[564,3424,731],{"class":730},[564,3426,734],{"class":569},[564,3428,731],{"class":730},[564,3430,734],{"class":569},[564,3432,731],{"class":730},[564,3434,743],{"class":569},[564,3436,587],{"class":569},[564,3438,717],{"class":569},[564,3440,1259],{"class":577},[564,3442,584],{"class":569},[564,3444,587],{"class":569},[564,3446,727],{"class":569},[564,3448,861],{"class":730},[564,3450,734],{"class":569},[564,3452,861],{"class":730},[564,3454,734],{"class":569},[564,3456,861],{"class":730},[564,3458,743],{"class":569},[564,3460,587],{"class":569},[564,3462,748],{"class":569},[564,3464,3465,3467,3470],{"class":566,"line":697},[564,3466,711],{"class":569},[564,3468,3469],{"class":573},"OrbitControls",[564,3471,748],{"class":569},[564,3473,3474,3476,3479],{"class":566,"line":708},[564,3475,711],{"class":569},[564,3477,3478],{"class":573},"TresPoints",[564,3480,596],{"class":569},[564,3482,3483,3485,3488,3490,3492,3494,3496,3498,3500,3502,3504,3506,3508],{"class":566,"line":751},[564,3484,764],{"class":569},[564,3486,3487],{"class":573},"TresIcosahedronGeometry",[564,3489,717],{"class":569},[564,3491,2676],{"class":577},[564,3493,584],{"class":569},[564,3495,587],{"class":569},[564,3497,727],{"class":569},[564,3499,2773],{"class":730},[564,3501,734],{"class":569},[564,3503,1353],{"class":730},[564,3505,743],{"class":569},[564,3507,587],{"class":569},[564,3509,748],{"class":569},[564,3511,3513,3515],{"class":3512,"line":761},[566,600],[564,3514,764],{"class":569},[564,3516,3517],{"class":573},"PointMaterial\n",[564,3519,3521,3523,3526,3528,3530,3533],{"class":3520,"line":545},[566,600],[564,3522,799],{"class":569},[564,3524,3525],{"class":577},"size",[564,3527,584],{"class":569},[564,3529,587],{"class":569},[564,3531,3532],{"class":730},"5",[564,3534,793],{"class":569},[564,3536,3538,3540,3542,3544,3546],{"class":3537,"line":546},[566,600],[564,3539,2781],{"class":577},[564,3541,584],{"class":569},[564,3543,587],{"class":569},[564,3545,2901],{"class":590},[564,3547,793],{"class":569},[564,3549,3550],{"class":566,"line":547},[564,3551,1034],{"class":569},[564,3553,3554,3556,3558],{"class":566,"line":548},[564,3555,1040],{"class":569},[564,3557,3478],{"class":573},[564,3559,596],{"class":569},[564,3561,3562,3564,3566],{"class":566,"line":549},[564,3563,711],{"class":569},[564,3565,1052],{"class":573},[564,3567,748],{"class":569},[564,3569,3570,3572,3574],{"class":566,"line":550},[564,3571,1060],{"class":569},[564,3573,703],{"class":573},[564,3575,596],{"class":569},[564,3577,3578,3580,3582],{"class":566,"line":551},[564,3579,675],{"class":569},[564,3581,692],{"class":573},[564,3583,596],{"class":569},[536,3585,1077],{"id":1076},[508,3587,3588,3589,3596,3597,534],{},"All ",[521,3590,3593,3595],{"href":3591,"rel":3592},"https://threejs.org/docs/#api/en/materials/PointsMaterial",[525],[512,3594,3300],{}," properties"," are inherited by ",[512,3598,3599],{},"PointMaterial",[1093,3601,2251],{},{"title":480,"searchDepth":481,"depth":482,"links":3603},[3604,3605],{"id":538,"depth":482,"text":15},{"id":1076,"depth":482,"text":1077},"Extends THREE.PointsMaterial to render points as dots rather than squares.",{},{"title":183,"description":3606},"Aajs-h_7UFOgfUg69Q5QfqvfyKDHM1UKxS8GfRKzI2U",{"id":3611,"title":187,"body":3612,"description":3970,"extension":485,"links":486,"meta":3971,"navigation":488,"path":188,"seo":3972,"stem":189,"__hash__":3973},"docs/2.api/4.materials/wobble-material.md",{"type":473,"value":3613,"toc":3966},[3614,3619,3627,3629,3917,3919,3959,3964],[1778,3615,3616],{},[3617,3618],"materials-wobble-material",{},[508,3620,510,3621,2446,3623,3626],{},[512,3622,514],{},[512,3624,3625],{},"\u003CMeshWobbleMaterial />"," component that makes a geometry wobble and wave around.",[536,3628,15],{"id":538},[540,3630,3633],{"className":542,"code":3631,"highlights":3632,"language":560,"meta":480,"style":480},"\u003Cscript setup lang=\"ts\">\nimport { TresCanvas } from '@tresjs/core'\nimport { MeshWobbleMaterial } from '@tresjs/cientos'\n\u003C/script>\n\n\u003Ctemplate>\n  \u003CTresCanvas>\n    \u003CTresPerspectiveCamera :position=\"[3, 3, 3]\" :look-at=\"[0, 0, 0]\" />\n    \u003CTresMesh>\n      \u003CTresTorusGeometry />\n      \u003CMeshWobbleMaterial\n        color=\"#f25042\"\n        :speed=\"1\"\n        :factor=\"0.6\"\n      />\n    \u003C/TresMesh>\n    \u003CTresAmbientLight />\n    \u003CTresDirectionalLight :position=\"[0, 2, 4]\" />\n  \u003C/TresCanvas>\n\u003C/template>\n",[629,751,761,545,546,547],[512,3634,3635,3655,3673,3693,3701,3705,3713,3721,3777,3785,3793,3801,3815,3831,3848,3853,3861,3869,3901,3909],{"__ignoreMap":480},[564,3636,3637,3639,3641,3643,3645,3647,3649,3651,3653],{"class":566,"line":481},[564,3638,570],{"class":569},[564,3640,574],{"class":573},[564,3642,578],{"class":577},[564,3644,581],{"class":577},[564,3646,584],{"class":569},[564,3648,587],{"class":569},[564,3650,591],{"class":590},[564,3652,587],{"class":569},[564,3654,596],{"class":569},[564,3656,3657,3659,3661,3663,3665,3667,3669,3671],{"class":566,"line":482},[564,3658,604],{"class":603},[564,3660,607],{"class":569},[564,3662,1166],{"class":610},[564,3664,614],{"class":569},[564,3666,617],{"class":603},[564,3668,620],{"class":569},[564,3670,1175],{"class":590},[564,3672,626],{"class":569},[564,3674,3676,3678,3680,3683,3685,3687,3689,3691],{"class":3675,"line":629},[566,600],[564,3677,604],{"class":603},[564,3679,607],{"class":569},[564,3681,3682],{"class":610}," MeshWobbleMaterial",[564,3684,614],{"class":569},[564,3686,617],{"class":603},[564,3688,620],{"class":569},[564,3690,623],{"class":590},[564,3692,626],{"class":569},[564,3694,3695,3697,3699],{"class":566,"line":649},[564,3696,675],{"class":569},[564,3698,574],{"class":573},[564,3700,596],{"class":569},[564,3702,3703],{"class":566,"line":655},[564,3704,652],{"emptyLinePlaceholder":488},[564,3706,3707,3709,3711],{"class":566,"line":672},[564,3708,570],{"class":569},[564,3710,692],{"class":573},[564,3712,596],{"class":569},[564,3714,3715,3717,3719],{"class":566,"line":682},[564,3716,700],{"class":569},[564,3718,703],{"class":573},[564,3720,596],{"class":569},[564,3722,3723,3725,3727,3729,3731,3733,3735,3737,3739,3741,3743,3745,3747,3749,3751,3753,3755,3757,3759,3761,3763,3765,3767,3769,3771,3773,3775],{"class":566,"line":687},[564,3724,711],{"class":569},[564,3726,714],{"class":573},[564,3728,717],{"class":569},[564,3730,720],{"class":577},[564,3732,584],{"class":569},[564,3734,587],{"class":569},[564,3736,727],{"class":569},[564,3738,731],{"class":730},[564,3740,734],{"class":569},[564,3742,731],{"class":730},[564,3744,734],{"class":569},[564,3746,731],{"class":730},[564,3748,743],{"class":569},[564,3750,587],{"class":569},[564,3752,717],{"class":569},[564,3754,1259],{"class":577},[564,3756,584],{"class":569},[564,3758,587],{"class":569},[564,3760,727],{"class":569},[564,3762,861],{"class":730},[564,3764,734],{"class":569},[564,3766,861],{"class":730},[564,3768,734],{"class":569},[564,3770,861],{"class":730},[564,3772,743],{"class":569},[564,3774,587],{"class":569},[564,3776,748],{"class":569},[564,3778,3779,3781,3783],{"class":566,"line":697},[564,3780,711],{"class":569},[564,3782,756],{"class":573},[564,3784,596],{"class":569},[564,3786,3787,3789,3791],{"class":566,"line":708},[564,3788,764],{"class":569},[564,3790,1297],{"class":573},[564,3792,748],{"class":569},[564,3794,3796,3798],{"class":3795,"line":751},[566,600],[564,3797,764],{"class":569},[564,3799,3800],{"class":573},"MeshWobbleMaterial\n",[564,3802,3804,3806,3808,3810,3813],{"class":3803,"line":761},[566,600],[564,3805,2781],{"class":577},[564,3807,584],{"class":569},[564,3809,587],{"class":569},[564,3811,3812],{"class":590},"#f25042",[564,3814,793],{"class":569},[564,3816,3818,3820,3823,3825,3827,3829],{"class":3817,"line":545},[566,600],[564,3819,799],{"class":569},[564,3821,3822],{"class":577},"speed",[564,3824,584],{"class":569},[564,3826,587],{"class":569},[564,3828,2773],{"class":730},[564,3830,793],{"class":569},[564,3832,3834,3836,3839,3841,3843,3846],{"class":3833,"line":546},[566,600],[564,3835,799],{"class":569},[564,3837,3838],{"class":577},"factor",[564,3840,584],{"class":569},[564,3842,587],{"class":569},[564,3844,3845],{"class":730},"0.6",[564,3847,793],{"class":569},[564,3849,3851],{"class":3850,"line":547},[566,600],[564,3852,1034],{"class":569},[564,3854,3855,3857,3859],{"class":566,"line":548},[564,3856,1040],{"class":569},[564,3858,756],{"class":573},[564,3860,596],{"class":569},[564,3862,3863,3865,3867],{"class":566,"line":549},[564,3864,711],{"class":569},[564,3866,1052],{"class":573},[564,3868,748],{"class":569},[564,3870,3871,3873,3875,3877,3879,3881,3883,3885,3887,3889,3891,3893,3895,3897,3899],{"class":566,"line":550},[564,3872,711],{"class":569},[564,3874,1331],{"class":573},[564,3876,717],{"class":569},[564,3878,720],{"class":577},[564,3880,584],{"class":569},[564,3882,587],{"class":569},[564,3884,727],{"class":569},[564,3886,861],{"class":730},[564,3888,734],{"class":569},[564,3890,1348],{"class":730},[564,3892,734],{"class":569},[564,3894,1353],{"class":730},[564,3896,743],{"class":569},[564,3898,587],{"class":569},[564,3900,748],{"class":569},[564,3902,3903,3905,3907],{"class":566,"line":551},[564,3904,1060],{"class":569},[564,3906,703],{"class":573},[564,3908,596],{"class":569},[564,3910,3911,3913,3915],{"class":566,"line":552},[564,3912,675],{"class":569},[564,3914,692],{"class":573},[564,3916,596],{"class":569},[536,3918,1077],{"id":1076},[2015,3920,3921,3931],{},[2018,3922,3923],{},[2021,3924,3925,3927,3929],{},[2024,3926,2027],{"align":2026},[2024,3928,2030],{"align":2026},[2024,3930,2985],{},[2038,3932,3933,3946],{},[2021,3934,3935,3939,3942],{},[2043,3936,3937],{"align":2026},[2046,3938,3822],{},[2043,3940,3941],{"align":2026},"how fast the wobble effect would be.",[2043,3943,3944],{},[512,3945,2773],{},[2021,3947,3948,3952,3955],{},[2043,3949,3950],{"align":2026},[2046,3951,3838],{},[2043,3953,3954],{"align":2026},"how strong the wobble effect will deform the geometry",[2043,3956,3957],{},[512,3958,2773],{},[508,3960,3961,3962,1384],{},"This material extends ",[512,3963,2468],{},[1093,3965,2251],{},{"title":480,"searchDepth":481,"depth":482,"links":3967},[3968,3969],{"id":538,"depth":482,"text":15},{"id":1076,"depth":482,"text":1077},"Makes a geometry wobble and wave around with customizable speed and factor.",{},{"title":187,"description":3970},"FCaNs3jjWImwSxNZzcx1r_CPKoNz27JGUgdcUzvQ1Ys",1776202096132]