Искажение, подобное контурной ткани

-1

Может ли кто-нибудь подумать о способе в SVG, чтобы исказить узор, как будто это кусок ткани со складками и морщинами?Искажение, подобное контурной ткани

Например, если у меня полосатое пляжное полотенце, лежащее на неровном пляже, полосы не будут проходить по прямым линиям, а будут волноваться и складываться и обычно искажаться, когда они пересекают контуры пляжа.

Я знаю, что существуют различные преобразования, которые могут быть применены в SVG, но есть ли какие-либо преобразования, которые могут применять такие искажения?

источник

2013-08-21 brianmearns

Используйте SVG-фильтр: feDisplacementMap + feTurbulence. Пример:

<feTurbulence type="turbulence" baseFrequency=".02" numOctaves="4" result="turb"/> 
    <feDisplacementMap in="SourceGraphic" in2="turb" scale="0" result="displace" xChannelSelector="B"/>

Longer пример: http://codepen.io/mullany/pen/nLtla

источник

2013-08-21 21:48:31

Я попробовал ваш codepen ссылку, и я не вижу никакого выхода. Может быть, Firefox не поддерживает его? – brianmearns

Firefox поддерживает функции feDisplacementMap и feTurbulence. Это проблема, связанная с тем, что Firefox поддерживает только полные изображения, а не фрагменты SVG в качестве примера. –

Искажение, подобное контурной ткани

ответ

Смежные вопросы