javascript - 拉斐尔重复背景图案

Question

我想要一个重复的正方形图案（有点像蓝图）作为整个 SVG 元素的背景。我正在使用拉斐尔。我怎样才能做到这一点？

我想使用 SVG 而不是图像来执行此操作，因为我使用平移/缩放 SVG，SetViewBox并且我希望背景也可以适当地缩放。

Answer 1

一种选择是以通常的方式渲染这些方块，通过paper.rect(). 但是，可能会很昂贵，并且如果画布可以增大尺寸，则需要进行一些维护。

另一种选择是进行图案填充paper.rect(0,0,100,100).attr({fill: "url(images/pattern.png)"});（请参阅本教程），它应该会自动重复给出的图像。不过，我自己并没有这样做，所以我不确定当你这样做时模式是如何缩放的SetViewBox()。