Безопасно ли обернуть всех непосредственных потомков svg-документа в <g>для масштабирования?

Question

В моем приложении я загружаю разные файлы SVG и мне нужно их масштабировать. На мой взгляд, мне нужно применить матрицу преобразования к элементу, чтобы увеличить его, но это не работает с SVG-элементом, поэтому мне нужно обернуть все в <g> и преобразовать его.

Итак, мой вопрос: безопасно ли это делать? Разрешено ли, чтобы элементы типа <defs> не были непосредственными потомками <svg>? Будет ли преобразование на внешней стороне <g> влиять на элементы внутри <defs> в этом случае? Какие еще проблемы могут возникнуть, если я заверну все в <g>?

Answer 1

Да, вы можете использовать <defs> там, где вам это нужно, хотя желательно сохранить его как прямой дочерний элемент корневого элемента.Спросите себя, действительно ли вам нужно наследовать стиль в контенте <defs>.Обычно на содержимое внутри <defs> ссылаются другие элементы, например, <use>, поэтому в большинстве случаев не имеет значения, где находится <defs>.

Преобразование <g>элемент не повлияет на дочерний элемент <defs> напрямую, поскольку преобразование не наследуется.Однако это может повлиять на возвращаемые значения из некоторых вызовов SVG DOM, но в целом, если вы запрашиваете подробности об элементах внутри <defs>, вам все равно нужно быть осторожным, так как обычно требуется больше контекста для правильного вычисления результата, например, процентовЕдиницы и objectBoundingBox зависят соответственно от области просмотра и ссылочного элемента.

Вы можете столкнуться с проблемами, если включенный фрагмент SVG имеет правила стиля css, которые выбирают, например, корневой элемент или дочерние элементы элемента svg.