Как в SVG PATH установить фоновый рисунок?

Question

[Cheizer]

Друзья, совсем потерял надежду :(, очень нужно установить фоновый рисунок в SVG PATH?

Сделал такую заготовку https://codepen.io/Cheizer/pen/JZNvPE

Сейчас так:


А в итоге хочу хоть примерно так (что бы svg path выглядел как трос):


Как обычно установить через css не получается так

svg {
       height: 100%;
       width: 100%;
       stroke-width:5px;
  background-image:('https://www.wasatchsteel.com/wp-content/uploads/2017/03/Depositphotos_134165694_s-2015.jpg');
     }

Как можно установить фоновый рисунок в SVG PATH?????? ПАМАГИТИИИИИ!!!! :(

Answer 1

[tyzberd]

https://codepen.io/anon/pen/GGQqQe
css.yoksel.ru/svg-patterns

Comments

[Cheizer]

БЛАГОДАРЮ!!! Низкий поклон! Весь измучился, так же делал не получалось почему то :) Осталось подобрать паттерн!

Answer 2

[Ivan Bogachev]

1. Нарисуйте веревку как прямоугольник (не линию с толщиной, а именно замкнутый контур)
   
2. Сделайте внутри SVG pattern с нужной картинкой (image)
   
3. Используйте свойство fill, чтобы залить прямоугольник этим паттерном
   

При возникновении трудностей - гуглите упомянутые термины.

Comments

[Cheizer]

Спасибо дорогой человек, с рисунком то понятно, это как пример просто привел, дело в том что с паттерном тоже не получается, пробовал все примеры :( не могу понять почему не получается с fill и pattern, возможно что PATH мой это линия, поэтому не работает вариант с паттерном :(