Javascript webkit浏览器中svg文本的wierd行为

我正在使用变换缩放鼠标滚轮上的svg组。该组包含一个rect和一个文本节点。在firefox和IE中，这与预期一样有效：矩形和文本被缩放，文本保持在相同的位置。但在chrome/ipad中，文本的变化与矩形不同：当缩放文本时，文本会流入或流出矩形，如以下捕获：

更新： 多亏了罗伯特·朗森的回答，我才发现。

---

您可以找到有关文本呈现的更多信息。

一些UAs仅在字体超过一定大小时才应用不同的字体效果，例如提示和紧排，因此字体在缩放时不会保持一致的缩放比例

text rendering=“geometricsprecision”

可能会有所帮助，尽管没有绝对的保证

---

如果失败，则只要在发生事件时重新计算边界框即可。

显然，text rendering=“geometricPrecision”起到了作用。谢谢我明天会重新测试并接受答案。你有关于这方面的文章或博客吗？@madmed：根据实现经验，渲染字形轮廓（也称为几何精度）通常比选择给定字体大小，将字形光栅化为该大小，然后对其进行blitting要昂贵得多（我可以想象，在某些情况下，这只是交给操作系统的文本呈现引擎）。在任何情况下，如果差异很大，实现可能会优先考虑性能而不是质量。我尝试设置body{text rendering:geometricPrecision；}当它在桌面上工作时，iPad的性能非常糟糕，我将它切换到svg文本{text rendering:geometricsprecision；}，现在它工作得更好了。