shape-rendering

Атрибут shape-rendering предоставляет подсказки рендереру о том, какие компромиссы следует сделать при рендеринге фигур, таких как пути, окружности или прямоугольники.

Примечание: В качестве атрибута отображения shape-rendering может использоваться как свойство CSS. Более подробная информация находится в shape-rendering.

Вы можете использовать этот атрибут со следующими элементами 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

Совместимость с браузерами

	Рабочий стол					Мобильные
	Chrome	Edge	Firefox	Opera	Safari	Chrome Android	Firefox for Android	Opera Android	Safari on IOS	Samsung Internet	WebView Android
`shape-rendering`	≤80	≤80	≤72	67	≤13.1	80	79	57	≤13.4	13.0	80

См. также

Свойство CSS shape-rendering

© 2005–2024 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/shape-rendering