5
У меня есть сайт, над которым я работаю, где мы разрешаем создание фигур, и мы делаем это с помощью встроенного svg, созданного с помощью javascript. У меня странная проблема, когда svg корректно отображается в Chrome, но в Firefox он отсекает часть SVG. Код ниже - звезда. В хром это проявляется отлично. В Firefox я вижу только верхние левые 25% изображения или так.Рендеринг встроенного SVG в firefox
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:svg="http://www.w3.org/2000/svg">
<head></head>
<body>
<svg shape-rendering="" preserveAspectRatio="none">
<polygon transform="rotate(0 100 100)" points="256.53212826312154,13.412653125,314.88080229627076,201.3216034012431,499.6516034012431,201.3216034012431,348.91752881560774,320.0009404178177,382.9542553349448,507.9098906940608,256.53212826312154,389.2305536774862,130.11000119129832,507.9098906940608,164.14672771063536,320.0009404178177,13.412653125,201.3216034012431,198.18345422997237,201.3216034012431,256.53212826312154,13.412653125" fill="rgb(49, 48, 255)" stroke="black" stroke-width="2.49125px" style="position: absolute; ">
</polygon>
</svg>
</body>
</html>
Я не уверен, что мы делаем что-то неправильно или если это проблема с Firefox. Интересно, если я сделаю звезду меньшей (например, 1/4 от размера этой), она отлично отобразится в Firefox.
Спасибо за помощь!
Спасибо за ваш ответ. Он работает как очарование в Firefox. Так круто. Спасибо за вашу помощь. – wookie924
Почему только Firefox нужен? Из того, что я вижу в спецификации, значения по умолчанию уже 100% ([источник] (http://www.w3.org/TR/SVG/struct.html#SVGElementWidthAttribute)). –
Per http://www.w3.org/TR/2011/PR-SVG11-20110609/coords.html#ViewportSpace Атрибут 'width' для внешнего элемента svg устанавливает ширину окна просмотра, если не выполняются следующие условия: все они встречаются, а это не так. –