在Snap.svg中加载多个SVG文件会发生冲突吗？

Question

这是问题所在。我正在尝试使用Snap.svg制作一些SVG动画。我使用了一些预先绘制的svg资产。

我可以用snap快速加载单个svg文件，但是当我尝试加载多个svg文件时，颜色都搞砸了。

我用Google搜索并尝试了不同的解决方案，包括将它们加载到单独的svg元素中，逐个加载它们，使用angular $ complie预编译加载的svg ....但是所有这些都无法正常工作：（

任何人对错误有什么建议吗？

以下是我用来加载svg

的代码段

    var s = Snap(target);
    var g = s.group();
    Snap.load("../assets/svg/"+part+".svg",function(f){
        g.append(f);
        g.drag();
        resolve();
    })

这是我的有力尝试

.directive('snap', ['$compile',
function($compile){
    return {
        restrict: 'E',
        link: function(scope, elem, attrs){
            var s = Snap(400,400);
            Snap.load('../assets/svg/'+attrs.part,function(f){
                s.append(f);
                elem.append($compile(s)(scope));
            });
        }
    };
}

请帮助，谢谢！

所有SVG文件均由插图画家生成