Skip to content

Instantly share code, notes, and snippets.

@fergalhanley
Last active August 21, 2017 07:44
Show Gist options
  • Save fergalhanley/f99974f5ab6bef31217b to your computer and use it in GitHub Desktop.
Save fergalhanley/f99974f5ab6bef31217b to your computer and use it in GitHub Desktop.
This AngularJS directive allows changing the color of dynamically loaded SVG files. Subject to same domain policy.
app.directive('vodSvg', function() {
return {
restrict: 'E',
replace: 'true',
template: '<object type="image/svg+xml" data=""></object>',
link: function(scope, element, attrs) {
var paintSvg = function (svgElem){
var paths = [];
['path', 'circle', 'rectangle', 'polygon'].forEach(function(shape){
paths.push.apply(paths, svgElem.contentDocument.getElementsByTagName(shape));
});
for(var i = 0; i < paths.length; i++) {
paths[i].style.fill = getComputedStyle(element[0]).color;
}
};
element.bind('load', function(e) {
paintSvg(e.srcElement);
});
}
};
});
@valmirphp
Copy link

Obg, isso me ajudou muito.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment