pathLength
Атрибут pathLength позволяет авторам указать общую длину пути в единицах пользователя. Это значение используется для калибровки вычислений расстояния браузера с вычислениями автора путём масштабирования всех вычислений расстояний, используя отношение pathLength / (вычисленное значение длины пути).
Это может повлиять на фактические рендерные длины путей; включая пути текста, пути анимации и различные операции с обводкой. В основном, все вычисления, которые требуют длины пути. stroke-dasharray, например, будут предполагать, что начало пути равно 0, а конечная точка — значение, определённое в атрибуте pathLength.
Вы можете использовать этот атрибут со следующими элементами SVG:
Пример
<svg viewBox="0 0 100 60" xmlns="http://www.w3.org/2000/svg"> <style> path { fill: none; stroke: black; stroke-width: 2; stroke-dasharray: 10; } </style> <!-- No pathLength, the real length of the path is used. In that case, 100 user units --> <path d="M 0,10 h100" /> <!-- compute everything like if the path length was 90 user units long --> <path d="M 0,20 h100" pathLength="90" /> <!-- compute everything like if the path length was 50 user units long --> <path d="M 0,30 h100" pathLength="50" /> <!-- compute everything like if the path length was 30 user units long --> <path d="M 0,40 h100" pathLength="30" /> <!-- compute everything like if the path length was 10 user units long --> <path d="M 0,50 h100" pathLength="10" /> </svg>
circle
ellipse
line
path
polygon
polyline
Для <polyline>, атрибут pathLength позволяет авторам указать общую длину фигуры в единицах пользователя.
| Значение | <число> |
|---|---|
| Значение по умолчанию | нет |
| Анимируемо | Да |
rect
Спецификации
© 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/pathLength
