javascript - 在 Three.js 中对 THREE.TextGeometry 对象应用发光效果

Question

我已经做了好几个小时的谷歌搜索，看看是否可以做到在 three.js 环境中。

我想创建一个基于 TextGeometry 的发光效果，而不是像下面 Lee StemKoski 中类似的球体或立方体对象这样的简单基元 - 下面的阴影发光示例。

我一直在阅读和试验 Lee StemKoski examples

特别是他的 Shader Glow example如前所述，它适用于简单的对象，但不适用于复杂的几何形状。因此，我想知道是否有任何变通方法可以解决这个问题或其他关于如何在文本周围创建发光效果的建议。

问候

w9914420

更新:我决定通过将图像附加到文本来使用映射概念，我可以创建发光效果。在此示例中，我使用了一个圆圈，但为我需要的文本制作 map 应该不会太难。

更新:2017 年 3 月 20 日 - 所以我尝试使用 theeX.atmosphere Material 来创建难以捉摸的文本发光效果。以下是部分结果。

正如您所看到的那样——我遇到的问题是我无法进一步平滑外发光文本的顶点。我不确定是否有任何建议值得赞赏。

用于创建效果的 native 代码。

//normal text created  

var geometry2  = threeLab.asset.simpleText('hello','my_font');
var materialme  = new THREE.MeshNormalMaterial();
var mesh    = new THREE.Mesh( geometry2, materialme );
this.scene.add( mesh );


// we create a secondary text object to use as glow
var geometry  = threeLab.asset.simpleText('hello','my_font');

// clone for manipulation
var geoclone = geometry.clone();


//Thes functions are need to make it work in this case
geoclone.mergeVertices();
//geoclone.computeCentroids();
geoclone.computeVertexNormals();
geoclone.computeFaceNormals();

// part of threex library to make the glow scale and expand
THREEx.dilateGeometry(geoclone, 0.5);
var materialz   = THREEx.createAtmosphereMaterial();
var meshHalo    = new THREE.Mesh(geoclone, materialz );

//we have now our glow
this.scene.add( meshHalo );

Answer 1

所以最后我增加了辅助 TextGeometry 对象的 bevelsegments，这有助于平滑它。然后我就可以像这样将我的第一个文本封装到第二个文本中:

通过进一步调整，我将能够获得更微妙的发光效果，但目前效果还可以。

谢谢大家的意见:)