锻造函数 generateTexture()

Question

在下面的示例中，有一个名为 generateTexture() 的函数。

是否可以将文本（数字）绘制到像素阵列中？或者是否可以在该着色器上绘制文本（数字）？

我们的目标是画一个圆圈，里面有一个数字。

https://forge.autodesk.com/blog/using-dynamic-texture-inside-custom-shaders

更新： 我们注意到每个圈子不能使用唯一的 generateTexture()。 generateTexture() 结果被他们中的每一个使用。每个对象唯一可以自定义的是颜色，加上使用的纹理。

我们可以为此创建一个解决方法，即生成从 0 到 99 的每个纹理，然后让每个对象根据我们要显示的编号选择正确的纹理。我们不知道这是否足够有效以正常工作。否则，它可能必须是 0 到 9+ 或那个方向的东西。非常感谢有关我们更新问题的任何指南。谢谢

Answer 1

这是可能的，但您需要自己实施。着色器是一个非常低级的功能，因此无法直接绘制数字或文本，但您可以将给定字符转换为二维像素数组的表示形式。

Answer 2

我能够使用以下代码成功显示文本，只需将 generateTexture() 替换为 generateCanvasTexture() 在示例中，您应该得到以下结果：

const generateCanvasTexture = () => {

  const canvas = document.createElement("canvas")
  const ctx = canvas.getContext('2d')

  ctx.font = '20pt Arial'
  ctx.textAlign = 'center'
  ctx.textBaseline = 'middle'
  ctx.fillText(new Date().toLocaleString(),
    canvas.width / 2, canvas.height / 2)

  const canvasTexture = new THREE.Texture(canvas)

  canvasTexture.needsUpdate = true
  canvasTexture.flipX = false
  canvasTexture.flipY = false

  return canvasTexture
}

锻造函数 generateTexture()

Forge function generateTexture()

autodesk-forge

autodesk-viewer