圣诞树网页代码.docx
圣诞树网页代码<!DOCTYPEhtml><htmllang=,en,><head><metacharset="UTF-8"><title>MusicalChristmasLights<title><linkrel="stylesheet"href="https7ajaxlibsnormalize5.0.0normalize.min.css,><style>*box-sizing:border-box;)bodymargin:O;height:100vh;overflow:hidden;display:flex;align-items:center;justify-content:center;background:#161616;color:#c5a880;font-family:sans-serif;)labeldisplay:inline-block;background-color:#161616;padding:16px;border-radius:0.3rem;cursor:pointer;margin-top:lrem;width:300px;border-radius:10px;border:Ipxsolid#c5a880;text-align:center;u(list-style-type:none;padding:0;margin:0;).btnbackground-color:#161616;border-radius:10px;color:#c5a880;border:Ipxsolid#c5a880;padding:16p×width:300px;margin-bottom:16px;line-height:1.5;cursor:pointer;.separatorfont-weight:bold;text-align:center;width:300p×margin:16pxOpx;color:#a07676;).titlecolor:#a07676;font-weight:bold;font-size:1.25rem;margin-bottom:16px;).text-loadingfont-size:2rem;)<style><script>window.console=window.consolefunction(t);<script><script>if(document.location.search.match(tpe=embedgi)window.parent.postMessage(,resize,'z"*");<script><head><bodytranslate=,no"><scriptsrc=".three.js-masterbuildthree.min.js"><script>< scriptsrc=".three.js-masterexamplesjspostprocessingEffectComposer.js"><script>< scriptsrc=",.three.js-masterexamplesjspostprocessingRenderPass.js"><script>< scriptsrc=".three.js-masterexamplesjspostprocessingShaderPass,js"><script><scriptsrc=n.three.js-masterexamplesjsshadersCopyShader.js,><script>< scriptsrc=".three.js-masterexamplesjsshadersLuminosityHighPassShader,js"><script>< scriptsrc=".three.js-masterexamplesjspostprocessingUnrealBloomPass.js,><script><divid="overlay"><ul><li><inputtype="file"id="upload"hidden><labelfor="upload">选择音乐vlabel><li><ul><div><scriptid="rendered-js">/constTHREE="constpi,sinzcos=Math;constTAU=2*PI;constmap=(value,sMinzSMax,dMinzdMax)=>returndMin+(value-sMin)/(sMax-sMin)*(dMax-dMin);)；constrange=(n,m=0)=>Array(n).fill(m).map(i,j)=>i+j);constrand=(max,min=0)=>min+Math.random()*(max-min);constrandlnt=(maxzmin=0)=>Math.floor(min+Math.random()*(max-min);constrandChoise=arr=>arrrandlnt(arr.length);constpolar=(angzr=1)=>r*cos(ang)zr*sin(ang);letscene,camera,rendererzanalyser;letstep=0;constuniforms=time:type:,f,zvalue:0.0,step:type:"f',value:0.0)；constparams=exposure:1,bloomStrength:0.9zbloorThreshold:0,bloomRadius:0.5；letcomposer;constfftSize=2048;consttotalPoints=4000;constlistener=newTHREE.AudioListener();constaudio=newTHREE.Audio(Iistener);document.querySelector("input").addEventListener(,change"zuploadAudiozfalse);constbuttons=document.querySelectorAII(,.btn");buttons.forEach(buttonzindex)=>button.addEventListener("click",()=>IoadAudio(Index);functioninit()constoverlay=document.getElementById("overlay");overlay.remove();scene=newTHREE.Scene();renderer=newTHREE.WebGLRenderer(antialias:true)；renderer.setPixelRatio(window.devicePixelRatio);renderer.setSize(window.innerWidthzWindowJnnerHeight);document.body.appendChild(renderer.domElement);camera=newTHREE.PerspectiveCamera(60,WindowJnnerWidth/WindowJnnerHeightz1,1000);camera.position.set(-0.09397456774197047z-2.5597086635726947z24.420789670889008);camera.rotation.set(0.10443543723052419z-0.003827152981119352z0.0004011488708739715);constformat=renderer.capabilities.isWebGL2?THREE.RedFormat:THREEXuminanceFormat;uniforms.tAudioData=value:newTHREE.DataTe×ture(analyser.data,fftSize/2r1,format)；addPlane(scenezuniforms,3000);addSnow(scenezuniforms);range(10).map(i=>addTree(scene,uniforms,totalPoints,20,0,-20*i);addTree(scenezuniforms,totalPoints,-20,0,-20*i);)；constrenderScene=newTHREE.RenderPass(scenezcamera);constbloomPass=newTHREE.UnrealBloomPass(newTHREE.Vector2(window.innerWidthzwindow.innerHeight),1.5z0.4,0.85);bloomPass.threshold=params.bloomThreshold;bloomPass.strength=params.bloomStrength;bloomPass.radius=params.bloomRadius;composer=newTHREE.EffectComposer(renderer);composer.addPass(renderScene);composer.addPass(bloomPass);addListners(camerazrenderer,composer);animate();)functionanimate(time)analyser.getFrequencyData();uniforms.tAudioData.value.needsUpdate=true;step=(step÷1)%1000;uniforms.time.value=time;uniforms.step.value=step;composer.render();requestAnimationFrame(animate);)functionloadAudio(i)document.getElementById("overlay").innerHTML='<divCIaSS="textloading”>正在下载音乐,请稍等.vdiv>'constfiles="https:/files.freemusicarchive.org/storage-freemusicarchive-org/music/no_curator/Simon_Panrucker/Happy_Christmas_You_Guys/Simon_Panrucker_-_01_-_Sno
