IE10 - Map Clips if Hidden

[cmbergin]

In IE10, any portions of the map that are offscreen or blocked (such as by a loading dialog) are clipped and do not render at all. This means if half the map is visible on page load and the user scrolls down, the markers will be present, but not the map itself.

The fix is pretty simple. IE10 requires the viewBox attribute to be set. I was able to do this outside of the plugin code, but thought you might be able to add the viewBox attribute to your rendering method without too much trouble:

    //IE10 FIX: SVG will clip when blocked (such as by the loading dialog) or offscreen unless viewBox is set.
    var mapSvgElement = $(".jvectormap-container").children("svg");
    //Using the underlying DOM node on purpose. jQuery forces attributes to all lowercase, but SVG attributes are case sensitive.
    mapSvgElement.get(0).setAttribute("viewBox", "0 0 " + mapSvgElement.attr("width") + " " + mapSvgElement.attr("height"));

[MrBjorn]

Sounds similar to my problem: I added a shadow on the map, added a box shadow filter from the outside, but the map clips the shadow outside the region specified. Since the map fills it up exactly either on x or y axis, somethings is clipped and it looks ugly.

The solution is to put the viewBox larger than the size. If I test it with just the SVG code, it works making the viewBox slightly larger.

This I can't do from the outside of the plugin, it has no effect. Seems like the plugin must do it at an earlier stage. Note: In my case I want to make the viewBox larger, say by a percentage, 20% or something.