近期工作有涉及到數(shù)字大屏的需求，于是利用業(yè)余時(shí)間，結(jié)合 Three.js 和 CSS實(shí)現(xiàn)賽博朋克2077風(fēng)格視覺(jué)效果 實(shí)現(xiàn)炫酷 3D 數(shù)字地球大屏頁(yè)面。頁(yè)面使用 React + Three.js + Echarts + stylus 技術(shù)棧，本文涉及到的主要知識(shí)點(diǎn)包括：THREE.Spherical 球體坐標(biāo)系的應(yīng)用、Shader 結(jié)合 TWEEN 實(shí)現(xiàn)飛線和沖擊波動(dòng)畫(huà)效果、dat.GUI 調(diào)試工具庫(kù)的使用、clip-path 創(chuàng)建不規(guī)則圖形、Echarts 的基本使用方法、radial-gradient 創(chuàng)建雷達(dá)圖形及動(dòng)畫(huà)、GlitchPass 添加故障風(fēng)格后期、Raycaster 網(wǎng)格點(diǎn)擊事件等。
名稱欄目：使用Three.js實(shí)現(xiàn)炫酷的賽博朋克風(fēng)格3D數(shù)字地球大屏 🌐
文章起源：http://weahome.cn/article/dsojjgg.html