Блог

Не стесняйтесь запрашивать больше контекста, если вам интересно, зачем это необходимо, или хотите предложить лучший способ решения более масштабной проблемы. (Это включает в себя нанесение множества поэтажных планов зданий на карту кампуса и нахождение абсолютного местоположения определенных объектов, которые находятся на этих картах зданий; более подробная информация затягивала вопрос.)

Короткая версия заключается в том, что я хочу взять SVG-файл, содержащий ссылки <image xlink:href= «something.svg» />, и объединить его в один большой файл, в каждый SVG-файл, на который ссылается ссылка, встроен <svg> и встроенное содержимое SVG XML.

Итак, мой исходный файл верхнего уровня (составленный в Inkscape) выглядит следующим образом:

 <image xlink:href="floorplans/bldg1.svg"
width="165.52684" height="107.10559" y="-1937.7657"
x="2507.1565" transform="matrix(0,1,-1,0,0,0)" />
  

И моя попытка создать объединенную версию, чтобы встроить все векторные данные:

 <svg x="2507.1565" y="-1937.7657" width="165.52684" height="107.10559"
transform="matrix(0,1,-1,0,0,0)" viewBox="0 0 1224 792">
<g id="surface0">
<path style="fill:none;stroke-width:0.72;stroke-linecap:round;stroke-linejoin:round;stroke:rgb(0%,0%,0%);...
  

Итак, в основном я использую скрипт для замены <image> на <svg> и вставки содержимого корневого <svg> файла «floorplans /bldg1.svg». (Копирование атрибутов из <image> в <svg> и копирование атрибута viewBox из исходного <svg> в новый.)

Этот метод работал для объектов, которые не поворачиваются, но Chrome, похоже, говорит, что этот конкретный элемент находится не в верхней части окна просмотра. Я новичок в SVG, но я думаю, что порядок преобразований в <svg> отличается от порядка в <image>. Я допустил глупую ошибку, которую я не замечаю, или есть что-то еще, связанное с преобразованием <xlink на изображение:href=»something.svg» transform = … /> в <svg> со встроенным XML?

Спасибо.

Атрибут transform не применяется к элементу <svg> в соответствии со спецификацией SVG. Вместо этого вы можете поместить преобразование, которое было в элементе <image>, в элемент <g> либо снаружи, либо внутри <svg> .

Причина такого поведения transform заключается в том, что элемент <svg> задает систему координат, и преобразование зависит от этого (вопрос, который возник бы, если бы он действительно применялся, «следует ли интерпретировать преобразование в координатном пространстве до или после настройки системы координат svg?»).