Style an svg included in other svg created in D3.js

Question

Can I chang the color from an SVG included in another svg over the <image> tag created in D3.js

Look at the code below:

plan.select('image').transition().duration(250).ease('in')
            .attr('x', 10)
            .attr('y', 17)
            .attr('width', 55)
            .attr('height', 55)
            .attr('xlink:href', 'icon.svg')
            .style('fill', (year) => {
                let color:string = '#d4d4d4';
                if (isPast(year)) {
                    color = '#555555';
                } else if (hasAmount(year)) {
                    color = '#000000';
                }
                return color;
            });

In the past of codeHistory, I included the svg as a font so the styling was quite easy, but the icons didn't display correct. (some spaces are cancelled magically)

Now i try to include the svg direct over the image tag but i don't know how to change the color of the included svg...

is there another way of doing this? another idea of mine is using css to style the included svg but then the svg has to be included as html text and not as an image... — Synoon, Feb 16 '16 at 11:16
that's one way. Or have multiple images and select the one you want. — Robert Longson, Feb 16 '16 at 11:17
the problem is i dont know how to include the svg as html text... — Synoon, Feb 16 '16 at 12:02
http://stackoverflow.com/questions/11978995/how-to-change-color-of-svg-image-using-css-jquery-svg-image-replacement — Robert Longson, Feb 16 '16 at 12:18

Style an svg included in other svg created in D3.js

0 Answers0