Как в Raphaël сделать из обычной прямоугольной картинки многоугольную?

Question

[Karen Kratyan]

Привет всем. Есть какой-нибудь способ в Raphael сделать из
в =>  ?

Пытался через Paper.path c атрибутой fill: 'some_image.png', но не рисует изображение.

Или может другой способ есть кроме Raphael?

Comments

[Макс]

CSS-вариант рассматриваете?

[Karen Kratyan]

Какой CSS вариант?

[Макс]

Решение уже найдено, но может кому потом пригодится
www.queness.com/resources/html/css3-hexagon/index.html
css-tricks.com/examples/ShapesOfCSS/

[Karen Kratyan]

Спасибо. Интересные решения.

Answer 1

[Makito]

Вот вам решение. Красивую маску накидаете в инкскейпе.

Comments

[Karen Kratyan]

Так же делал, но не отображалась картинка. Хм. Буду искать ошибку в коде. Спасибо.)

[Makito]

наверное без url() прописывали адрес

[Karen Kratyan]

И с url и без)

[Karen Kratyan]

Вся проблема была в теге base)
А не в курсе как можно получить доступ к этому изображению, как к Element, чтобы запустить animate?
Цель — надо увеличить этот многоугольник с изображением. С увеличением многоугольника разобрался)

[Makito]

Так в примере манипуляции с многоугольником как раз так и уместны — изображение то ложится фоном в нем а не является отдельной сущностью.

[Karen Kratyan]

Изображение ложится как ссылка на image в теге defs

[Makito]

Вот пример увеличения, мы не смотрите на то что сгенерировал raphael, в любом случае с полученным svg вам нужно работать с помощью api raphael.

[Karen Kratyan]

Не увеличивает изображение — только границы. А мне-то нужно увеличить изображение. Вернее, сначала уменьшить, а потом увеличить до реального размера увеличить.

Answer 2

[Makito]

Если фон за картинкой однородный, не проще ли сверху положить картинку-маску?

Comments

[Karen Kratyan]

Спасибо, но это план Б)