Response title
This is preview!
colorize svg
in Using jQuery
•
5 years ago
Hey there,
for my smart home i use a piece of open source software (iobroker).
There is a function to colorize svgs depending on the state (e.g. an open door).
For sadness, the jquery function is obviously not correct implemented - the coloring does not work.
my goal is, that the stroke attribs of the svg (embedded through img-tag) could be replaced by an given color.
Code, that is not working:
- setSvgColor: function (el, color) {
- setTimeout(function () {
- el.parent().find('svg').remove();
- var $that = el;
- var imgURL = $that.attr('src');
- $.get(imgURL, function(data) {
- // Get the SVG tag, ignore the rest
- var $svg = jQuery(data).find('svg');
- // Remove any invalid XML tags as per http://validator.w3.org
- $svg = $svg.removeAttr('xmlns:a');
- $svg = $svg.attr('width', '100%');
- $svg = $svg.attr('height', '100%');
- $svg = $svg.attr('stroke', '#ff3c41');
- $svg.find('*').each(function () {
- var style = $(this).attr('style');
- if (style) {
- style = style.replace(/#FFFFFF/g, color);
- $(this).attr('style', style);
- }
- });
- // Replace image with new SVG
- $that.replaceWith($svg);
- }, 'xml');
- }, 0);
- }
anyone who could see what I am doing wrong?
Cheers, Dominic
1