View source for Widget:SVG

<noinclude>__NOTOC__
This widget allows you to embed a '''[https://www.w3.org/TR/SVG11/ Scalable Vector Graphics]''' image (img tag using inline markup encoded for data url scheme) on your wiki page.

Written by [[User:DSquirrelGM|DSquirrelGM]].

==Copy to your site==
To use this widget on your site, install [https://www.mediawiki.org/wiki/Extension:Widgets MediaWiki Widgets extension] and copy the [{{fullurl:{{FULLPAGENAME}}|action=edit}} full source code] of this page to your wiki as page '''{{FULLPAGENAME}}'''.

=Usage=
Refer to the SVG specification for the use of these attributes: width, height, viewBox, preserveAspectRatio, x, y, version

{|
|-
| ''width'' || &nbsp; || horizontal image size || &nbsp; || 100%
|-
| ''height'' || &nbsp; || vertical image size || &nbsp; || 100%
|-
| ''version'' || &nbsp; || specification version || &nbsp; || 1.1
|-
| ''x'' || &nbsp; || horizontal origin (ignored on top level element) || &nbsp; || 0
|-
| ''y'' || &nbsp; || vertical origin (ignored on top level element) || &nbsp; || 0
|-
| ''preserveAspectRatio'' || &nbsp; || Aspect ratio adjustment || &nbsp; || xMidYMid meet
|-
| ''viewBox'' || &nbsp; || viewport extents || &nbsp; || 0 0 100% 100%
|-
| ''content'' || &nbsp; || SVG markup to be embedded
|-
| ''url'' || &nbsp; || (set a value to use url() scheme instead of img tag)
|}
</noinclude><includeonly><!--{if (empty($url))}--><!--{'<img src="data:image/svg+xml,'|cat:(('<svg xmlns="https://www.w3.org/2000/svg" version="'|cat:($version|strip_tags|regex_replace:"/\x22/":""|default:'1.1')|cat:'" viewBox="'|cat:($viewBox|strip_tags|regex_replace:"/\x22/":""|default:'0 0 100% 100%')|cat:'" preserveAspectRatio="'|cat:($preserveAspectRatio|strip_tags|regex_replace:"/\x22+/":""|default:'xMidYMid meet')|cat:'" x="'|cat:($x|strip_tags|regex_replace:"/\x22+/":""|default:'0')|cat:'" y="'|cat:($y|strip_tags|regex_replace:"/\x22+/":""|default:'0')|cat:'" width="'|cat:($width|strip_tags|regex_replace:"/\x22+/":""|default:'100%')|cat:'" height="'|cat:($height|strip_tags|regex_replace:'/\x22/':""|default:'100%')|cat:'"'|cat:'>'|cat:($content|regex_replace:"/<SCRIPT/i":"<text"|regex_replace:"/<\/SCRIPT/i":"</text"|regex_replace:"/<SVG/i":"<g"|regex_replace:"/<\/SVG/i":"</g"|replace:'load=':'='|default:'')|cat:'</svg>')|escape:'url')|cat:'" />'}--><!--{else}--><!--{'url(data:image/svg+xml,'|cat:(('<svg xmlns="https://www.w3.org/2000/svg" '|cat:' version="'|cat:($version|strip_tags|regex_replace:"/\x22+/":""|default:'1.1')|cat:'" viewBox="'|cat:($viewBox|strip_tags|regex_replace:"/\x22+/":""|default:'0 0 100% 100%')|cat:'" preserveAspectRatio="'|cat:($preserveAspectRatio|strip_tags|regex_replace:"/\x22+/":""|default:'xMidYMid meet')|cat:'" x="'|cat:($x|strip_tags|regex_replace:"/\x22+/":""|default:'0')|cat:'" y="'|cat:($y|strip_tags|regex_replace:"/\x22+/":""|default:'0')|cat:'" width="'|cat:($width|strip_tags|regex_replace:"/\x22+/":""|default:'100%')|cat:'" height="'|cat:($height|strip_tags|regex_replace:"/\x22+/":""|default:'100%')|cat:'"'|cat:'>'|cat:($content|regex_replace:"/<SCRIPT/i":"<text"|regex_replace:"/<\/SCRIPT/i":"</text"|regex_replace:"/<SVG/i":"<g"|replace:"/<\/SVG/i":"</g"|replace:'load=':'='|default:'')|cat:'</svg>')|escape:'url')|cat:')'}--><!--{/if}-->
</includeonly>