5
Tôi có một trang web tôi đang làm việc trên nơi chúng tôi cho phép tạo ra các hình dạng và chúng tôi làm điều này bằng cách sử dụng nội tuyến svg được xây dựng thông qua javascript. Tôi đang gặp một vấn đề lạ, trong đó svg hiển thị chính xác trong Chrome, nhưng trong Firefox, nó cắt một phần của SVG. Mã dưới đây là một ngôi sao. Trong chrome, điều này hiển thị hoàn hảo. Trong Firefox tôi chỉ nhìn thấy trên cùng bên trái 25% của hình ảnh hoặc hơn.Rendering inline SVG trong 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>
Tôi không chắc chắn nếu chúng tôi đang làm điều gì đó sai hoặc nếu vấn đề với Firefox. Điều thú vị là nếu tôi sẽ làm cho ngôi sao nhỏ hơn (như 1/4 kích thước của cái này) nó sẽ hiển thị hoàn hảo trong Firefox.
Cảm ơn sự giúp đỡ!
Cảm ơn câu trả lời của bạn. Nó hoạt động như một nét duyên dáng trong Firefox. Rất tuyệt vời. Cảm ơn bạn đã giúp đỡ. – wookie924
Tại sao Firefox chỉ cần điều này? Từ những gì tôi thấy trong spec, các giá trị mặc định đã là 100% ([source] (http://www.w3.org/TR/SVG/struct.html#SVGElementWidthAttribute)). –
Mỗi http://www.w3.org/TR/2011/PR-SVG11-20110609/coords.html#ViewportSpace Thuộc tính 'chiều rộng' trên phần tử svg ngoài cùng thiết lập chiều rộng của khung nhìn, trừ khi các điều kiện sau được đáp ứng và chúng tất cả đều được đáp ứng nên không. –