- From: Paul LeBeau via GitHub <sysbot+gh@w3.org>
- Date: Thu, 09 Jun 2022 14:41:59 +0000
- To: public-svg-issues@w3.org
There is a way. Just use `feImage`.
You might be under the impression that `feImage` can only point to an external image. That's not the case.
```
<svg viewBox="0 0 250 250">
<defs>
<filter id="Image" x="0" y="0" width="250" height="250">
<feImage xlink:href="#smiley" />
</filter>
<g id="smiley">
<circle cx="125" cy="125" r="100" fill="yellow"/>
<circle cx="90" cy="100" r="10" fill="black"/>
<circle cx="160" cy="100" r="10" fill="black"/>
<circle cx="125" cy="110" r="70"
fill="none" stroke="black" stroke-width="4"
stroke-dasharray="130 1000" stroke-dashoffset="-40"/>
</g>
</defs>
<rect x="0" y="0" width="250" height="250" filter="url(#Image)"/>
</svg>
```
See: https://jsfiddle.net/r462w7eq/
--
GitHub Notification of comment by BigBadaboom
Please view or discuss this issue at https://github.com/w3c/svgwg/issues/887#issuecomment-1151210559 using your GitHub account
--
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config
Received on Thursday, 9 June 2022 14:42:00 UTC