I want to replace a flash object that uses a single swf file (map of USA) and uses flash vars identified in the html to dynamically change colors of different states. Using a single file for multiple pages.
I’ve created an SVG file with each state having an ID name of it’s two letter state abbreviation. What I’d like to do is import this using or , then using inline CSS on the HTML page manipulate the SVG image and adjust the fill of certain items.
Inline CSS within the SVG file (or referencing an external CSS file from within the SVG file) will not meet my desire of having one image file to be used on many pages – like the original swf.
Beaten my head against the monitor for a few days now trying a bunch of jQuery and javascript stuff, but sadly I am not proficient enough in js to make this work on my own.
Thanks for any advise or help!
I don’t feel browser support is yet where I need for this question to be answered. What I ended up doing is creating the flash version http://ryanhollingsworth.com/test/map.html
How it works, you embed the swf and use flashvars to assign values to two arrays, color array and state array. Result is I can use the same swf on multiple pages, with different colors and have different states colored differently.
SVG will catch up, soon i hope 🙂