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

Jam*_*all 2 canvas webgl three.js html5-canvas

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

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

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

但是,只要size > 256画布的边框在立方体的所有面上渲染,但文本就会被神秘地遗漏掉.

以下情况的示例size = 257:http://jsfiddle.net/sSD65/27/

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

这是three.js中的一个错误,画布问题还是(很可能)我是傻瓜?有任何想法吗?

alt*_*edq 7

这确实很奇怪.它看起来像Chrome端的一些纹理缓存/同步问题,代码处理2d canvas => WebGL纹理转换.

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

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

所以看起来正在发生的是,在画布大小> 256时,Chrome在渲染文本以​​创建WebGL纹理之前使用了2d画布状态.

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