Как заставить заливку рисунка SVG двигаться с объектом?
У меня есть несколько объектов SVG с мозаичным фоном изображения, используяfill="url(#background)
, где я'м определяющий#background
какpattern
содержащий толькоimage
Однако, когда объект перемещается в настройках, его /x
y
атрибуты (или /cx
cy
или что-либо еще, определяющее смещение), фон не перемещается вместе с ним.
Как мне сделать фон движением? ОтКак бы я переместить шаблон SVG с элементом Я пытался установитьpatternContentUnits='objectBoundingBox'
но это просто превращает изображение в сплошной цветовой шарик (как ни странно, окрашенный в соответствии с изображением, как если бы это был только первый пиксель или что-то подобное).
Вот jsfiddle, иллюстрирующий все это - верхrect
был превращен в сплошной цвет, а затем снизуrect
имеет фоновое изображение, но это не такдвигаться с:rect
Я знаю, что если бы вы использовалиtransform="translate(...)"
вместо установки /x
y
атрибуты, фонделает получить перевод, но существующая кодовая база I 'я работаю в неt использовать translate для позиционирования (и это будет иметь другие непредвиденные последствия для остальной части приложения).
Заранее благодарю за любую помощь.