SVG USE XLINK sibling? -


i have reusable svg component contains templated content. part of component default function, i'd include shadow/reflection visual effect.

so, easy, right; use , done. except, here's reduced example show problem i'm having:

<svg>     <use xlink:href="#reflect"></use>     <g id="reflect">         <templated-content class="blue" />     </g> </svg>  <svg>     <use xlink:href="#reflect"></use>     <g id="reflect">         <templated-content class="red" />     </g> </svg> 

will each reflection red, or blue? because element can reused, , each instance potentially different, can't rely on constant id attribute.

i'd prefer avoid assigning id pairs each instance via script. couldn't find useful in w3c xlink spec, there's enough jargon there may have missed something.

is there supported way include relative use, or perhaps similar result via declarative feature?

edit: i know invalid include multiple elements same id. why want way create reflection relative declarative reference. can done?

having 2 items same id in same document invalid.

a <use> element must point id , each id must unique, there's no such thing relative <use>

each reflection should blue.

you'll need generate unique ids.


Comments

Popular posts from this blog

asp.net mvc - SSO between MVCForum and Umbraco7 -

Python Tkinter keyboard using bind -

ubuntu - Selenium Node Not Connecting to Hub, Not Opening Port -