Chrome和SVG（拉斐尔），绘制“屏幕外”的麻烦

Question

我正在开发一个原型系统，它可以作为一个概念证明，可以使现有系统更具互动性。

它基本上模拟了我们的主要软件包，但在互联网上使用JSONP请求来更新大量图像和Raphael向量，使其看起来像是在运行。

我在Chrome上遇到了麻烦但拉斐尔没有在屏幕外绘制矢量。我的意思是“屏幕外”是主应用程序通过iframe运行，因为它依赖于通过AJAX进行跨域远程轮询来获取来回通信。下面的图片展示了我的意思。

在这里，我在iframe中滚动了一点点来查看“屏幕外”的位，你可以看到灰色箭头没有渲染。我已经使用Chrome的开发人员工具来突出显示SVN标记，显示它仅向SVG标记提供450px乘810px，这与为iframe分配的大小相同。

值得指出的是，它在Firefox中呈现得很好。有什么想法吗？

Answer 1

我遇到了类似的问题，发现了一个似乎与之相关的WebKit项目的错误报告：

https://bugs.webkit.org/show_bug.cgi?id=64823

根据评论，这是渲染引擎中的一个错误，除了丢失iframe或使用其他方式滚动SVG视口（如移动SVG元素中的所有元素）之外，没有其他解决方法。

从好的方面来看，version 16.0.912.21今天已经发布到测试频道，似乎已经修复了该错误。我还检查了最新的铬构建（17.something），并且该bug没有重新出现。我猜这个修复应该会在几周后进入稳定通道。