I have three (3) small interactive Flash maps that I need to gave converted to SVG.
The current Flash maps can be seen at [url removed, login to view] You can flip between the three maps by clicking the highlighted toolbar above the maps.
The converted SVG maps must be delivered according to the following specifications:
- The width and height must be identical to the existing Flash maps, and the maps should generally be the same as the maps as currently displayed -- including borders, labels, and call-outs for states that are too small to consistently click.
- The Canada map requires grouping of multiple provinces, so the ability to group multiple jurisdictions and interact with them as one entity is a requirement.
- The maps should be selectable with any pointer device: both mouse and touch screen.
- Mouse support should include the same hover effects as the current maps, and both mouse and touch screen should flash the color to indicate a click has taken place.
- Individual states and countries within the maps allow enable/disable support (like the current maps).
- Colors should be global and easy to reconfigure without changing each individual jurisdiction.
- The opening animation in the current Flash maps can be discarded.
- The sound effect that currently plays when an item is clicked can be discarded.
- I would like to have the background converted from the current maps, and I would also like the ability to later change out the background if I wish.
- All three maps should be able to be swapped in and out of display without resorting to embedded iframes, if possible. (Just like the current Flash maps.)
- The SVG code must be delivered in a readable manner that can be easily modified. Reasonable steps should be made to ensure the SVG code and paths are not too complex, so that code size is reasonable and performance does not suffer, even on slower phones, tablets, or computers.
I can supply the original Flash files for the current maps, which should provide a very big leg-up on the conversion.
The SVG must be compatible and work properly in IE9 and up, as well as all the other popular modern browsers (Edge, Chrome, Firefox, Safari, and Opera).
Although the delivered code should display the SVG maps in exactly the same dimensions as the current Flash maps, the code should also be shown to be properly scalable to different dimensions using the same height/width ratio. i.e., it must be shown to be resizable even in IE9, which according to [url removed, login to view] will require height, width, viewBox, and CSS rules to work around some limitations in that browser.