1. DOM + CSS
傳統html5的文字實現,用於添加描述性疊加文字的方法。一般使用絕對定位,並且保證z-index夠大,用於顯示在3D場景之上。
優點:
與CSS3D效果一致
缺點:
3d效果和運動還原不好
2. THREE.CanvasTexture
在canvas中繪制文字,然后使用CanvasTexture作為紋理進行貼圖
例子
優點:
文字效果較為豐富,方便繪制。
缺點:
一旦生成,分辨率固定,放大會產生失真。
3. THREE.TextGeometry / THREE.TextBufferGeometry
使用原生的TextGeometry進行渲染生成。例子
優點:
效果好,可與場景進行同步
缺點:
單個字體的顏色和動畫制作較為復雜,且耗費資源較大
4. 3d字體模型
使用3d制作的字體模型,使用threejs進行加載控制。例子
優點:
效果好,可定制效果
缺點:
加載模型較為耗費資源,字體內容無法自定義
5. 位圖字體
通過BmpFont生成文字模板,然后進行加載顯示。BMFonts (位圖字體) 可以將字形批處理為單個BufferGeometry。BMFont的渲染支持自動換行、字母間距、字句調整、signed distance fields with standard derivatives、multi-channel signed distance fields、多紋理字體等特性。three-bmfont-text
優點:
可自定義字體和效果
缺點:
加載模型較為耗費資源,字體內容無法自定義
6. Three.Sprite
Sprite加載圖像紋理
優點:
永遠面向相機的平面,適合作為標簽顯示
缺點:
存在canvasTexture的問題
