shape-rendering
shape-rendering 屬性為渲染器提供了有關在渲染路徑、圓形或矩形等形狀時應如何權衡的提示。
注意： 作為一個呈現屬性，shape-rendering 還有一個對應的 CSS 屬性：shape-rendering。當兩者都被指定時，CSS 屬性具有更高的優先順序。
你可以將此屬性與以下 SVG 元素一起使用
示例
html
<svg viewBox="0 0 420 200" xmlns="http://www.w3.org/2000/svg">
<circle cx="100" cy="100" r="100" shape-rendering="geometricPrecision" />
<circle cx="320" cy="100" r="100" shape-rendering="crispEdges" />
</svg>
用法說明
| 值 |
auto | optimizeSpeed | crispEdges | geometricPrecision |
|---|---|
| 預設值 | auto |
| 可動畫的 | 離散 |
auto-
此值表示使用者代理應進行適當的權衡，以平衡速度、清晰的邊緣和幾何精度，但幾何精度比速度和清晰的邊緣更受重視。
optimizeSpeed-
此值表示使用者代理應優先考慮渲染速度而非幾何精度和清晰的邊緣。此選項有時會導致使用者代理關閉形狀抗鋸齒。
crispEdges-
此值表示使用者代理應嘗試強調藝術作品清晰邊緣的對比度，而不是渲染速度和幾何精度。為了實現清晰的邊緣，使用者代理可能會關閉所有線段和曲線的抗鋸齒，或者可能僅關閉接近垂直或水平的直線段的抗鋸齒。此外，使用者代理可能會調整線段的位置和線寬，以使邊緣與裝置畫素對齊。
geometricPrecision-
表示使用者代理應優先考慮幾何精度而非速度和清晰的邊緣。
規範
| 規範 |
|---|
| Scalable Vector Graphics (SVG) 2 # ShapeRendering |
瀏覽器相容性
載入中…
另見
- CSS
shape-rendering屬性