是否可以看到<canvas>是如何被操纵的？</canvas>

Question

我很感兴趣如何呈现地球的这个WebGL动画：

http://ats-vs-world.cadillac.com/#!/home

与其他HTML元素不同，我还没有找到一种方法来查看canvas元素的操作方式。

在Chrome和其他浏览器中，您可以“中断...子树修改”，“中断...属性修改”等。对于画布，当它被操纵时，该元素是空白的。

有没有办法做到这一点？

编辑：我非常感谢@ Joe的回答。但是，总的来说（这个网站并不具体）还有什么方法，那么看看如何被操纵？

Answer 1

我绝对推荐WebGL Inspector。

除此之外，您是否尝试过检查来源？您可以从Chrome的检查员那里查看一些项目（着色器，纹理）。

Answer 2

Chrome有一个画布检查员处于试验阶段（当我写这篇文章时）。要启用它，请转到about：flags并启用“Developer Tools实验”。然后在开发人员工具设置（cog图标）中，转到实验选项卡，您应该看到“画布检查”选项 - http://www.html5rocks.com/en/tutorials/canvas/inspection/