Skip to content

Instantly share code, notes, and snippets.

@m4dz
Created June 21, 2012 12:16
Show Gist options
  • Save m4dz/2965442 to your computer and use it in GitHub Desktop.
Save m4dz/2965442 to your computer and use it in GitHub Desktop.
Use GET parameter "color" with an hex value to change the fill in an SVG file
Display the source blob
Display the rendered blob
Raw
<svg width="255px" height="170px" xmlns="http://www.w3.org/2000/svg">
<g>
<path d="M0,43 L42,0 L126,84 L211,0 L254,43 L169,127 L127,170 L84,127 L0,43 L0,43 Z"/>
</g>
<script type="application/ecmascript"> <![CDATA[
var href,
paramList,
arg,
color = '#000';
href = document.defaultView.location.href;
if ( -1 != href.indexOf("?") )
{
paramList = href.split("?")[1].split(/&|;/);
for ( p in paramList )
{
arg = paramList[ p ].split("=");
if( arg[0] = 'color' && arg[1].match(/^#[a-f0-9]{3}([a-f0-9]{3})?$/i))
{
document.getElementsByTagName( 'path' )[0].setAttribute('fill', arg[1]);
}
}
}
]]> </script>
</svg>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment