我正在使用javascript svg-pan-zoom.js(https://github.com/ariutta/svg-pan-zoom)libary来缩放和平移Web应用程序中的svg。放大Firefox是非常缓慢和滞后的,而放大Chrome和IE11的效果非常好(使用5MB .svg文件进行测试,提供平面图 - 如果文件较小,这个问题并不明显)。平移工作正常。我在论坛上已经阅读了很多关于这个问题的主题,但我还没有找到任何解决方案。有谁知道导致这个问题的原因以及如何解决这个问题?
Example:
http://jsfiddle.net/coz3fd0L/3/
答案 0 :(得分:3)
检查您的refreshRate
选项。也许你设置了一个很高的数字。
如果没有,那么你可以设置一个较低的数字(例如10,这意味着每秒最多10帧),如果可以改善你的问题。
除此之外,我不知道svg-pan-zoom中的任何其他问题。至少如果平移是平滑的,那么缩放应该是相同的。
也许你的SVG有很多边/曲线/节点,而Firefox在修改这些东西方面很糟糕。或者在使用矩阵变换时调整大SVG的大小是不好的(矩阵变换用于svg-pan-zoom中的缩放/平移)。
更新:从我看来,这纯粹是一个Firefox问题(或者它的方式)。只需从示例http://imgh.us/test_51.svg打开SVG即可获得100%的CPU(用于页面滚动)。
此外,我确实尝试手动更改矩阵变换值(以测试它是否是svg-pan-zoom问题)并且它无论如何都非常慢。
我看到的唯一解决方案是尝试优化您的SVG(也许可以使它们更简单:更少的边缘,节点,不渲染白色元素......)。