使用Canvas作为three.js纹理：文本不显示在特定大小之上

Question

我最近一直在尝试使用three.js，但是当我用作纹理的画布大小超过256x256时，我遇到了一个显示停止。

以下是一些示例代码，用于演示正在发生的事情：http://jsfiddle.net/sSD65/26/

请注意，当size = 256时，画布及其内容在多维数据集的所有面上都能正确呈现。 size < 256时也是如此。

然而，只要size > 256，画布的边框就会在多维数据集的所有面上呈现，但文本会被神秘地遗漏。

size = 257：http://jsfiddle.net/sSD65/27/

时会发生什么情况的示例

我无法理解为什么画布的图形部分在立方体上呈现而不是文本部分。

这是three.js中的一个错误，画布问题还是（很可能）我是傻瓜？有什么想法吗？

Answer 1

这确实很奇怪。它看起来像Chrome端的一些纹理缓存/同步问题，代码处理中的某处2d canvas =＆gt; WebGL纹理转换。

如果在绘制文本后添加一些画布绘制操作，即使使用257像素大小的画布，它也会再次工作：

http://jsfiddle.net/sSD65/28/

所以看起来正在发生的是帆布尺寸＆gt; 256 Chrome在渲染文本以​​创建WebGL纹理之前使用状态为2d的画布。

我猜它会尝试为较大的画布优化WebGL纹理上传，并且“context.fillText”操作没有正确设置某些“脏”标志。