Fabric.js svg，多个路径剪辑为多个图像

Question

当一个svg文件有多个路径（让我们说对象）时，我需要将这些路径剪切为多个图像。我应该保持路径的实际位置。添加图像时，我可以将此图像剪切到选定的路径吗？

目前我只能将svg剪辑为一张图片。但这不是我想要的。

https://jsfiddle.net/hydride/wh35ymev/

var svgEl = document.body.getElementsByTagName('svg')[0];
var serializer = new XMLSerializer();
var svgStr = serializer.serializeToString(svgEl);

var canvas = new fabric.Canvas('c');
canvas.backgroundColor = 'rgb(150,150,150)';
var obj;
var path = fabric.loadSVGFromString(svgStr,function(objects, options) {
  obj = fabric.util.groupSVGElements(objects, options);
  obj.scaleToHeight(canvas.height);
  obj.setFill('transparent');
  canvas.add(obj).renderAll();
});

$("#addButton").click(function(){
    fabric.Image.fromURL('http://fabricjs.com/assets/pug_small.jpg', function (img) {
    img.scaleToHeight(canvas.height).set({
      clipTo: function (ctx) {
        obj.render(ctx);
      }
    });
    canvas.add(img).setActiveObject(img);
    canvas.renderAll();
  });
});