我最近和 Threejs 一起工作很开心。要在 Threejs 应用程序中创建 2D 文本,我必须创建一个 Canvas ,用文本填充 Canvas 并将 Canvas 添加为纹理。就像本例中所做的那样。 http://stemkoski.github.io/Three.js/Texture-From-Canvas.html
对于文本,我使用自定义字体,并且有两个选项可以将该字体嵌入到应用程序中。使用 css3 @font-face
或在本网站中转换后将字体包含为字体 javascript。 http://typeface.neocracy.org/
除了我在这里列出的缺点之外,我想知道与另一种相比还有哪些其他缺点。
使用@font-face
- 字体在元素加载后加载,这需要额外的解决方法 Drawing text to <canvas> with @font-face does not work at the first time
使用字体
- 当字体转换为字体文件时,它们的大小会增加两倍以上。
提前致谢。
最佳答案
如果您使用字体绘制到 Canvas 中,就像您所说的那样,并且可能在页面的其余部分使用相同的字体,我会使用@font-face,因为它确实是标准方式,并且不需要 JavaScript字体编码。
但是如果您还希望能够使用 TextGeometry 将 3D 文本写入场景,那么您必须使用 typeface.js
[此处的示例:http://blog.andrewray.me/creating-a-3d-font-in-three-js/ ]
所以,在我看来,这实际上取决于您对该字体的其他用途。
只有“平面”,作为纹理图像,在 Three.js 中 + 可能在 HTML/App 的其余部分的其他地方
使用@font-face
Three.js 场景中的平面纹理图像 + TextGeometry 3D 文本
使用typeface.js
关于three.js - 在三个 js 应用程序 2d 文本中使用 css 字体与 typeface js,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27743284/