如何在 THREE.TextGeometry 中添加带有上标的字符串? [英] How to add a string with superscript in an THREE.TextGeometry?

问题描述

我正在使用 Three.js 开发尺寸标注工具.我想在两个对象之间的线上写距离的尺寸.我想写 2.45⁵ 如图所示.

I'm working on a dimensioning tool with Three.js. I would like to write dimensioning of distances over a line between two objects. I want to write 2.45⁵ as shown in the picture.

遗憾的是，在 Threejs R88 中，HTML 编码无法获取，例如 TextGeometry 中的上标函数.一种解决方案是将第二个文本几何图形(带有上标编号)附加到主要文本几何图形.但我想避免这种解决方案，因为我认为这不是一个非常明智/干净的解决方案.你有什么想法如何解决这个问题吗?

Sadly, as in Threejs R88 is HTML encoding not possible to get, for example, the superscript function in TextGeometry. A solution would be to append a second text geometry (with the superscript number) to the main one. But I would like to avoid this solution since I think it's not a very wise/clean one. Do you have any ideas how to solve this?

这样的事情显然不起作用:

someting like this doesn't work obviously:

var ss = '5'.sup();

var geometry = new THREE.TextGeometry( '2.45' + ss, {
        font: font,
        size: 80,
        height: 5});

提前谢谢你，我愿意接受每一个建议.

Thank you in advance, I'm open to every suggestion.

推荐答案

Font 你加载的字体必须支持你要使用的字符.

The Font you load must support the characters you want to use.

经过简短的检查，我能够在 helvetiker_regular.typeface.json 字体文件中找到²".这并不能保证它会包含您正在寻找的字符.例如，我无法在同一个文件中找到⁶"的定义.

After a brief inspection, I was able to find "²" in the helvetiker_regular.typeface.json font file. That does not guarantee that it will include the characters you're looking for. For example, I was unable to find a definition for "⁶" in the same file.

当然，最简单的解决方法是创建正常比例的数字，然后将它们缩放/定位到下标位置.Three.js 还提供了组合几何的方法，因此您可以在此过程中制作更少的网格(解决您的不干净"问题).

Of course, the easiest workaround is to create normal-scale numbers, then scale/position them into a suberscript position. Three.js also provides methods for combining geometries, so you would make fewer meshes in the process (addressing your "not clean" concern).

这篇关于如何在 THREE.TextGeometry 中添加带有上标的字符串?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！