Ошибка масштабирования SVG в IE9

Question

Проблемы с использованием небольшого svg в IE9. Это добраться-х сколов на правом/не по центру:

(Полагал быть "X")

My SVG:

<?xml version="1.0" encoding="utf-8"?> 
<!-- Generator: Adobe Illustrator 16.0.4, SVG Export Plug-In . SVG Version: 6.00 Build 0) --> 
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> 
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" 
    viewBox="0 0 364.786 364.786" enable-background="new 0 0 364.786 364.786" 
    xml:space="preserve" preserveAspectRatio="xMinYMin none"> 
<polygon fill="#999999" points="300.988,0 182.388,118.618 63.768,0.015 0,63.745 118.639,182.376 0.015,301.018 63.745,364.786 
    182.395,246.127 301.045,364.771 364.786,300.988 246.15,182.371 364.771,63.742 "/> 
</svg> 

я извлекал ширина и высота и есть viewbox и preserveAspectRatio = "xMinYMin none", хотя ...

http://jsfiddle.net/dzCL2/12/

Answer 1

Ваше значение preserveAspectRatio является недействительным, и должно быть проигнорировано браузером:

preserveAspectRatio="xMinYMin none" 

Значение по умолчанию xMidYMid meet будет использоваться при визуализации в этом случае.

Для получения подробных сведений о синтаксисе обратитесь к SVG 1.1 spec. Возможно, что IE рассматривает значение как частично действительное, применяя только часть xMinYMin, что приведет к выровненному по левому краю изображению. Использование правильного синтаксиса, надеюсь, устранит проблему.

Answer 2

Правильная установка, которая работала для меня в Safari, чтобы избежать пропорционального масштабирования:

<svg ... preserveAspectRatio="none"> 

</svg>