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的问题

ThreeJS中创建文字的几种方法的更多相关文章

  1. Java中创建数组的几种方法

    Java中创建数组的几种方法 public static void main(String[] args) { //创建数组的第一种方法 int[] arr=new int[6]; int intVa ...

  2. 在Microsoft Power BI中创建地图的10种方法

    今天,我们来简单聊一聊“地图”. 在我们日常生活中,地图地位已经提升的越来越高,出门聚餐.驾驶.坐车.旅行......应运而生的就是各种Map APP. 作为数据分析师,我们今天不讲生活地图,要跟大家 ...

  3. cocos2dx中创建动画的三种方法

    1.最最原始的方法,先创建动画帧,再创建动画打包(animation),再创建动画(animate) 第一步: 创建动画帧:CCSpriteFrame,依赖于原始的资源图片(xx.png,xx.jpg ...

  4. JAVA中创建线程的三种方法及比较

    JAVA中创建线程的方式有三种,各有优缺点,具体如下: 一.继承Thread类来创建线程 1.创建一个任务类,继承Thread线程类,因为Thread类已经实现了Runnable接口,然后重写run( ...

  5. java中创建线程的几种方法及区别

    1,实现Runnable接口创建线程 特点: A:将代码和数据分开,形成清晰的模型 B:线程体run()方法所在的类可以从其它类中继承一些有用的属性和方法 C:有利于保持程序风格的一致性 2,继承Th ...

  6. Java中创建线程的三种方法以及区别

    Java使用Thread类代表线程,所有的线程对象都必须是Thread类或其子类的实例.Java可以用三种方式来创建线程,如下所示: 1)继承Thread类创建线程 2)实现Runnable接口创建线 ...

  7. java中创建线程的3种方法

    1.继承Thread类优点:可以直接使用Thread类中的方法,代码比较简单.缺点:继承Thread类之后不能继承其他类. 2.实现Runable接口优点:实现接口,比影响继承其他类或实现接口.缺点: ...

  8. Javascript中创建函数的几种方法

    // 工厂函数模式 // 无法解决对象识别问题 function person0(name, age, job) { var obj = new Object(); obj.name = name; ...

  9. WPF中RichTextBox中添加文字的两种方法

    RichTextBox控件不同于TextBox控件,后者可以直接通过其Text属性绑定或者在后台动态添加文字. (一)使用数据绑定 <RichTextBox FontSize="12& ...

随机推荐

  1. vi启动时报错:YouCompleteMe unavailable: requires Vim 7.4.1578+如何处理?

    答:源码编译安装最新的vim 以redhat为例: 1. 移除旧的vi,vim sudo yum remove vi vim -y 2. 安装ncurses库 sudo yum install ncu ...

  2. natively 在本地机器

    ​For JavaScript-based projects, it makes sense to have a command line task runner that executes Java ...

  3. test result

  4. React Native登录注册页面实现空白处收起键盘

    其实很简单,直接使用ScrollView作为父视图即可.有木有很神奇啊,以前都还不知道呢.....

  5. React Native npm第三方报错

    添加npm install第三方报错: 使用: yarn add 组件名称 注意: 这里不需要像npm的--save

  6. 解决Java中的HttpServletResponse中文乱码问题

    response.setHeader("Content-type", "textml;charset=UTF-8"); response.setCharacte ...

  7. FTP与SFTP的区别

    简介 wikipedia - FTP --- FTP File Transfer wikipedia - SFTP --- SSH File Transfer 对比 缩写 名称 协议与端口 安全策略 ...

  8. ElasticSearch 获取es集群信息

    参考博客:https://www.cnblogs.com/phpshen/p/8668833.html es集群信息有些版本下如果证书过期就会查不到,有些版本貌似不需要,提供一个据说不需要证书的版本的 ...

  9. edusoho 查找网址对应的控制器和模板页面

    刚接触这套系统的新手都在纠结模板在哪个文件里,有时候就算告诉他,遇到其他同样的模板照样还问,授人以鱼不如授人以渔!这个文章记录下我自己的看法,大爪子忽喷! 刚看到群里有人问 xxx.com/admin ...

  10. js监听屏幕的高度变化

    之前用VUE写完一个聊天界面,对于ios的效果该优化的地方都已经优化,且已上线.现在因项目需要,在另外一个angularjs+ionic的框架也要写一个聊天页面,目前还在开发中,发现忘记了一些很关键的 ...