[{"data":1,"prerenderedAt":1246},["ShallowReactive",2],{"navigation":3,"/api/materials/glass-material":474,"/api/materials/glass-material-surround":1241},[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,84,114,156,190,284,310,344,394,440],{"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,80],{"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},"Decal","/api/abstractions/decal","2.api/1.abstractions/decal",{"title":53,"path":54,"stem":55},"Edges","/api/abstractions/edges","2.api/1.abstractions/edges",{"title":57,"path":58,"stem":59},"Fit","/api/abstractions/fit","2.api/1.abstractions/fit",{"title":61,"path":62,"stem":63},"Levioso (Float)","/api/abstractions/levioso","2.api/1.abstractions/levioso",{"title":65,"path":66,"stem":67},"Mask","/api/abstractions/mask","2.api/1.abstractions/mask",{"title":69,"path":70,"stem":71},"Outline","/api/abstractions/outline","2.api/1.abstractions/outline",{"title":73,"path":74,"stem":75},"Sampler","/api/abstractions/sampler","2.api/1.abstractions/sampler",{"title":77,"path":78,"stem":79},"ScreenSizer","/api/abstractions/screen-sizer","2.api/1.abstractions/screen-sizer",{"title":81,"path":82,"stem":83},"ScreenSpace","/api/abstractions/screen-space","2.api/1.abstractions/screen-space",{"title":85,"path":86,"stem":87,"children":88},"Controls","/api/controls","2.api/2.controls/index",[89,90,94,98,102,106,110],{"title":85,"path":86,"stem":87},{"title":91,"path":92,"stem":93},"Camera Controls","/api/controls/camera-controls","2.api/2.controls/camera-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,436],{"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},"Refractor","/api/objects/refractor","2.api/9.objects/refractor",{"title":437,"path":438,"stem":439},"Text3D","/api/objects/text-3d","2.api/9.objects/text-3d",{"title":441,"path":442,"stem":443,"children":444},"Miscellaneous","/api/miscellaneous","2.api/miscellaneous/index",[445,446,450,454,458,462,466,470],{"title":441,"path":442,"stem":443},{"title":447,"path":448,"stem":449},"Bounds","/api/miscellaneous/bounds","2.api/miscellaneous/bounds",{"title":451,"path":452,"stem":453},"GlobalAudio","/api/miscellaneous/global-audio","2.api/miscellaneous/global-audio",{"title":455,"path":456,"stem":457},"MouseParallax","/api/miscellaneous/mouse-parallax","2.api/miscellaneous/mouse-parallax",{"title":459,"path":460,"stem":461},"PositionalAudio","/api/miscellaneous/positional-audio","2.api/miscellaneous/positional-audio",{"title":463,"path":464,"stem":465},"useAnimations","/api/miscellaneous/use-animations","2.api/miscellaneous/use-animations",{"title":467,"path":468,"stem":469},"useGLTFExporter","/api/miscellaneous/use-gltf-exporter","2.api/miscellaneous/use-gltf-exporter",{"title":471,"path":472,"stem":473},"useIntersect","/api/miscellaneous/use-intersect","2.api/miscellaneous/use-intersect",{"id":475,"title":167,"body":476,"description":1235,"extension":1236,"links":1237,"meta":1238,"navigation":624,"path":168,"seo":1239,"stem":169,"__hash__":1240},"docs/2.api/4.materials/glass-material.md",{"type":477,"value":478,"toc":1226},"minimark",[479,485,502,506,511,822,826,833,837,1208,1212,1222],[480,481,482],"scene-wrapper",{},[483,484],"materials-glass-material",{},[486,487,488,489,493,494,497,498,501],"p",{},"The ",[490,491,492],"code",{},"cientos"," package provides a new",[490,495,496],{},"\u003CMeshGlassMaterial />"," component that makes a geometry look like glass. This is achieved by re-defining the ",[490,499,500],{},"MeshPhysicalMaterial",".",[503,504,15],"h2",{"id":505},"usage",[507,508,510],"h3",{"id":509},"you-can-use-it-like-you-normally-do-with-tresjs","You can use it like you normally do with TresJs",[512,513,521],"pre",{"className":514,"code":515,"highlights":516,"language":519,"meta":520,"style":520},"language-vue shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\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",[517,518],2,10,"vue","",[490,522,523,558,588,609,619,626,636,647,716,726,737,747,757,767,803,813],{"__ignoreMap":520},[524,525,528,532,536,540,543,546,549,553,555],"span",{"class":526,"line":527},"line",1,[524,529,531],{"class":530},"sMK4o","\u003C",[524,533,535],{"class":534},"swJcz","script",[524,537,539],{"class":538},"spNyl"," setup",[524,541,542],{"class":538}," lang",[524,544,545],{"class":530},"=",[524,547,548],{"class":530},"\"",[524,550,552],{"class":551},"sfazB","ts",[524,554,548],{"class":530},[524,556,557],{"class":530},">\n",[524,559,562,566,569,573,576,579,582,585],{"class":560,"line":517},[526,561],"highlight",[524,563,565],{"class":564},"s7zQu","import",[524,567,568],{"class":530}," {",[524,570,572],{"class":571},"sTEyZ"," TresCanvas",[524,574,575],{"class":530}," }",[524,577,578],{"class":564}," from",[524,580,581],{"class":530}," '",[524,583,584],{"class":551},"@tresjs/core",[524,586,587],{"class":530},"'\n",[524,589,591,593,595,598,600,602,604,607],{"class":526,"line":590},3,[524,592,565],{"class":564},[524,594,568],{"class":530},[524,596,597],{"class":571}," MeshGlassMaterial",[524,599,575],{"class":530},[524,601,578],{"class":564},[524,603,581],{"class":530},[524,605,606],{"class":551},"@tresjs/cientos",[524,608,587],{"class":530},[524,610,612,615,617],{"class":526,"line":611},4,[524,613,614],{"class":530},"\u003C/",[524,616,535],{"class":534},[524,618,557],{"class":530},[524,620,622],{"class":526,"line":621},5,[524,623,625],{"emptyLinePlaceholder":624},true,"\n",[524,627,629,631,634],{"class":526,"line":628},6,[524,630,531],{"class":530},[524,632,633],{"class":534},"template",[524,635,557],{"class":530},[524,637,639,642,645],{"class":526,"line":638},7,[524,640,641],{"class":530},"  \u003C",[524,643,644],{"class":534},"TresCanvas",[524,646,557],{"class":530},[524,648,650,653,656,659,662,664,666,669,673,676,678,680,682,685,687,689,692,694,696,698,701,703,705,707,709,711,713],{"class":526,"line":649},8,[524,651,652],{"class":530},"    \u003C",[524,654,655],{"class":534},"TresPerspectiveCamera",[524,657,658],{"class":530}," :",[524,660,661],{"class":538},"position",[524,663,545],{"class":530},[524,665,548],{"class":530},[524,667,668],{"class":530},"[",[524,670,672],{"class":671},"sbssI","3",[524,674,675],{"class":530},", ",[524,677,672],{"class":671},[524,679,675],{"class":530},[524,681,672],{"class":671},[524,683,684],{"class":530},"]",[524,686,548],{"class":530},[524,688,658],{"class":530},[524,690,691],{"class":538},"look-at",[524,693,545],{"class":530},[524,695,548],{"class":530},[524,697,668],{"class":530},[524,699,700],{"class":671},"0",[524,702,675],{"class":530},[524,704,700],{"class":671},[524,706,675],{"class":530},[524,708,700],{"class":671},[524,710,684],{"class":530},[524,712,548],{"class":530},[524,714,715],{"class":530}," />\n",[524,717,719,721,724],{"class":526,"line":718},9,[524,720,652],{"class":530},[524,722,723],{"class":534},"TresMesh",[524,725,557],{"class":530},[524,727,729,732,735],{"class":728,"line":518},[526,561],[524,730,731],{"class":530},"      \u003C",[524,733,734],{"class":534},"TresTorusGeometry",[524,736,715],{"class":530},[524,738,740,742,745],{"class":526,"line":739},11,[524,741,731],{"class":530},[524,743,744],{"class":534},"MeshGlassMaterial",[524,746,715],{"class":530},[524,748,750,753,755],{"class":526,"line":749},12,[524,751,752],{"class":530},"    \u003C/",[524,754,723],{"class":534},[524,756,557],{"class":530},[524,758,760,762,765],{"class":526,"line":759},13,[524,761,652],{"class":530},[524,763,764],{"class":534},"TresAmbientLight",[524,766,715],{"class":530},[524,768,770,772,775,777,779,781,783,785,787,789,792,794,797,799,801],{"class":526,"line":769},14,[524,771,652],{"class":530},[524,773,774],{"class":534},"TresDirectionalLight",[524,776,658],{"class":530},[524,778,661],{"class":538},[524,780,545],{"class":530},[524,782,548],{"class":530},[524,784,668],{"class":530},[524,786,700],{"class":671},[524,788,675],{"class":530},[524,790,791],{"class":671},"2",[524,793,675],{"class":530},[524,795,796],{"class":671},"4",[524,798,684],{"class":530},[524,800,548],{"class":530},[524,802,715],{"class":530},[524,804,806,809,811],{"class":526,"line":805},15,[524,807,808],{"class":530},"  \u003C/",[524,810,644],{"class":534},[524,812,557],{"class":530},[524,814,816,818,820],{"class":526,"line":815},16,[524,817,614],{"class":530},[524,819,633],{"class":534},[524,821,557],{"class":530},[503,823,825],{"id":824},"props","Props",[486,827,828,829,832],{},"No props are required. The component extends ",[490,830,831],{},"THREE.MeshPhysicalMaterial"," and accepts all the same props plus additional reflection-specific properties.",[507,834,836],{"id":835},"you-can-also-replace-the-material-of-an-existing-mesh-like-this","You can also replace the material of an existing mesh like this:",[512,838,842],{"className":514,"code":839,"highlights":840,"language":519,"meta":520,"style":520},"\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",[611,628,638,649,718,518,739,749,759,769,805,841],20,[490,843,844,864,894,912,936,940,957,971,976,997,1004,1032,1037,1043,1070,1079,1087,1096,1105,1114,1134,1143,1149,1169,1179,1190,1199],{"__ignoreMap":520},[524,845,846,848,850,852,854,856,858,860,862],{"class":526,"line":527},[524,847,531],{"class":530},[524,849,535],{"class":534},[524,851,539],{"class":538},[524,853,542],{"class":538},[524,855,545],{"class":530},[524,857,548],{"class":530},[524,859,552],{"class":551},[524,861,548],{"class":530},[524,863,557],{"class":530},[524,865,866,868,870,873,876,879,881,884,886,888,890,892],{"class":526,"line":517},[524,867,565],{"class":564},[524,869,568],{"class":530},[524,871,872],{"class":571}," ref",[524,874,875],{"class":530},",",[524,877,878],{"class":571}," shallowRef",[524,880,875],{"class":530},[524,882,883],{"class":571}," watch",[524,885,575],{"class":530},[524,887,578],{"class":564},[524,889,581],{"class":530},[524,891,519],{"class":551},[524,893,587],{"class":530},[524,895,896,898,900,902,904,906,908,910],{"class":526,"line":590},[524,897,565],{"class":564},[524,899,568],{"class":530},[524,901,572],{"class":571},[524,903,575],{"class":530},[524,905,578],{"class":564},[524,907,581],{"class":530},[524,909,584],{"class":551},[524,911,587],{"class":530},[524,913,915,917,919,921,923,926,928,930,932,934],{"class":914,"line":611},[526,561],[524,916,565],{"class":564},[524,918,568],{"class":530},[524,920,597],{"class":571},[524,922,875],{"class":530},[524,924,925],{"class":571}," Box",[524,927,575],{"class":530},[524,929,578],{"class":564},[524,931,581],{"class":530},[524,933,606],{"class":551},[524,935,587],{"class":530},[524,937,938],{"class":526,"line":621},[524,939,625],{"emptyLinePlaceholder":624},[524,941,943,946,949,951,954],{"class":942,"line":628},[526,561],[524,944,945],{"class":538},"const",[524,947,948],{"class":571}," glassMaterialRef ",[524,950,545],{"class":530},[524,952,878],{"class":953},"s2Zo4",[524,955,956],{"class":571},"()\n",[524,958,960,962,965,967,969],{"class":959,"line":638},[526,561],[524,961,945],{"class":538},[524,963,964],{"class":571}," boxRef ",[524,966,545],{"class":530},[524,968,878],{"class":953},[524,970,956],{"class":571},[524,972,974],{"class":973,"line":649},[526,561],[524,975,625],{"emptyLinePlaceholder":624},[524,977,979,982,985,987,991,994],{"class":978,"line":718},[526,561],[524,980,981],{"class":953},"watch",[524,983,984],{"class":571},"(glassMaterialRef",[524,986,875],{"class":530},[524,988,990],{"class":989},"sHdIc"," value",[524,992,993],{"class":538}," =>",[524,995,996],{"class":530}," {\n",[524,998,1000],{"class":999,"line":518},[526,561],[524,1001,1003],{"class":1002},"sHwdD","  // For good practice we dispose the old material\n",[524,1005,1007,1010,1012,1015,1017,1020,1022,1025,1027,1030],{"class":1006,"line":739},[526,561],[524,1008,1009],{"class":571},"  boxRef",[524,1011,501],{"class":530},[524,1013,1014],{"class":571},"value",[524,1016,501],{"class":530},[524,1018,1019],{"class":571},"instance",[524,1021,501],{"class":530},[524,1023,1024],{"class":571},"material",[524,1026,501],{"class":530},[524,1028,1029],{"class":953},"dispose",[524,1031,956],{"class":534},[524,1033,1035],{"class":1034,"line":749},[526,561],[524,1036,625],{"emptyLinePlaceholder":624},[524,1038,1040],{"class":1039,"line":759},[526,561],[524,1041,1042],{"class":1002},"  // We assign the new MeshGlassMaterialClass\n",[524,1044,1046,1048,1050,1052,1054,1056,1058,1060,1063,1065,1067],{"class":1045,"line":769},[526,561],[524,1047,1009],{"class":571},[524,1049,501],{"class":530},[524,1051,1014],{"class":571},[524,1053,501],{"class":530},[524,1055,1019],{"class":571},[524,1057,501],{"class":530},[524,1059,1024],{"class":571},[524,1061,1062],{"class":530}," =",[524,1064,990],{"class":571},[524,1066,501],{"class":530},[524,1068,1069],{"class":571},"MeshGlassMaterialClass\n",[524,1071,1073,1076],{"class":1072,"line":805},[526,561],[524,1074,1075],{"class":530},"}",[524,1077,1078],{"class":571},")\n",[524,1080,1081,1083,1085],{"class":526,"line":815},[524,1082,614],{"class":530},[524,1084,535],{"class":534},[524,1086,557],{"class":530},[524,1088,1090,1092,1094],{"class":526,"line":1089},17,[524,1091,531],{"class":530},[524,1093,633],{"class":534},[524,1095,557],{"class":530},[524,1097,1099,1101,1103],{"class":526,"line":1098},18,[524,1100,641],{"class":530},[524,1102,723],{"class":534},[524,1104,557],{"class":530},[524,1106,1108,1110,1112],{"class":526,"line":1107},19,[524,1109,652],{"class":530},[524,1111,734],{"class":534},[524,1113,715],{"class":530},[524,1115,1117,1119,1121,1123,1125,1127,1130,1132],{"class":1116,"line":841},[526,561],[524,1118,652],{"class":530},[524,1120,744],{"class":534},[524,1122,872],{"class":538},[524,1124,545],{"class":530},[524,1126,548],{"class":530},[524,1128,1129],{"class":551},"glassMaterialRef",[524,1131,548],{"class":530},[524,1133,715],{"class":530},[524,1135,1137,1139,1141],{"class":526,"line":1136},21,[524,1138,808],{"class":530},[524,1140,723],{"class":534},[524,1142,557],{"class":530},[524,1144,1146],{"class":526,"line":1145},22,[524,1147,1148],{"class":1002},"  \u003C!-- Mesh to be replaced -->\n",[524,1150,1152,1154,1156,1158,1160,1162,1165,1167],{"class":526,"line":1151},23,[524,1153,641],{"class":530},[524,1155,723],{"class":534},[524,1157,872],{"class":538},[524,1159,545],{"class":530},[524,1161,548],{"class":530},[524,1163,1164],{"class":551},"boxRef",[524,1166,548],{"class":530},[524,1168,557],{"class":530},[524,1170,1172,1174,1177],{"class":526,"line":1171},24,[524,1173,652],{"class":530},[524,1175,1176],{"class":534},"TresBoxGeometry",[524,1178,715],{"class":530},[524,1180,1182,1184,1187],{"class":526,"line":1181},25,[524,1183,652],{"class":530},[524,1185,1186],{"class":534},"MeshBasicMaterial",[524,1188,1189],{"class":530},"  />\n",[524,1191,1193,1195,1197],{"class":526,"line":1192},26,[524,1194,808],{"class":530},[524,1196,723],{"class":534},[524,1198,557],{"class":530},[524,1200,1202,1204,1206],{"class":526,"line":1201},27,[524,1203,614],{"class":530},[524,1205,633],{"class":534},[524,1207,557],{"class":530},[503,1209,1211],{"id":1210},"tips","Tips",[1213,1214,1215,1219],"ul",{},[1216,1217,1218],"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",[1216,1220,1221],{},"Another good option is to provide a normal texture as clearcoatNormalMap to add different results",[1223,1224,1225],"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 .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":520,"searchDepth":527,"depth":517,"links":1227},[1228,1231,1234],{"id":505,"depth":517,"text":15,"children":1229},[1230],{"id":509,"depth":590,"text":510},{"id":824,"depth":517,"text":825,"children":1232},[1233],{"id":835,"depth":590,"text":836},{"id":1210,"depth":517,"text":1211},"Makes a geometry look like glass by re-defining the MeshPhysicalMaterial.","md",null,{},{"title":167,"description":1235},"XeLIOrrqO5hF6DK2JnTAyGusif0o80_d6hTc8m5QJQE",[1242,1244],{"title":163,"path":164,"stem":165,"description":1243,"children":-1},"Extends Three.js' material library with your own Vertex and Fragment shaders.",{"title":171,"path":172,"stem":173,"description":1245,"children":-1},"A simple to use holographic material for TresJS with vibrant colors, dynamic scanlines, and futuristic brilliance.",1781273437884]