剪辑矩形区域旋转 raphael.js

Posted

技术标签:

【中文标题】剪辑矩形区域旋转 raphael.js【英文标题】:clip-rect area rotation raphael.js 【发布时间】:2011-08-04 15:18:20 【问题描述】:

我可以使用 raphael.js 中的 clip-rect 属性显示图像的矩形部分。

能否请您告诉我如何旋转该剪辑矩形区域(不是图像)。也许我应该使用 clipPath svg attr?但它必须是raphael.js的解决方案,这样IE的vml也能做到这一点?

【问题讨论】:

【参考方案1】:

你可以这样做:

r = Raphael('myid',600,400);
myimage = r.image('http://25.media.tumblr.com/032e7b64fbc53862cb4c53b6a564f216/tumblr_mnthd5m5y21sqq5odo3_1280.jpg',0,0,600,400)
myimage.attr('clip-rect':[100,100,200,200])
myrect  = r.rect(100,100,200,200).transform("r45")
myimage.clip.setAttribute("transform", myrect.node.getAttribute("transform"))

见小提琴:http://jsfiddle.net/arpitworld/ME2Gr/1/

【讨论】:

以上是关于剪辑矩形区域旋转 raphael.js的主要内容,如果未能解决你的问题,请参考以下文章

在保持区域的同时旋转位图(矩形)

剪辑小部件的paintEvent

查看剪辑路径的反向区域

为剪辑区域设置动画时清除画布时出现问题

GDI-ExtSelectClipRgn将指定区域与当前剪辑区域组合在一起

石英和剪裁区域