使用Snap.svg将图像放在多边形内

Question

我有一个用Adobe的Snap.svg绘制的多边形（事实上它是一个六边形）：

var s = Snap('#test');

var hexagon = s.paper.polygon([
            0, 50,
            50, 0,
            100, 0,
            150, 50,
            100, 100,
            50, 100,
            0, 50
]);

hexagon.attr({
            stroke: '#fff',
            strokeWidth: 1
});

我没有用多余的颜料填充多边形，而是想在其中放置一个图像。我在文档中找到的唯一的东西是图像功能，但我不知道如何插入它。任何人都有任何想法？

==

最终解决方案：

var image = s.paper.image('http://placekitten.com/g/200/300', 0, 0, 150, 150);
image = image.pattern(0, 0, 150, 150);
...
hexagon.attr({
            stroke: '#fff',
            strokeWidth: 1,
            fill: image
        });

Answer 1

您无法通过图案直接填充包含图像的元素。

这意味着你需要创建一个包含图像的模式，然后fill the shape with the pattern。