image - raphael.js 裁剪图像

标签 image svg raphael crop

我是 raphael.js 和 svg 的新手。我有一个图像元素,我可以在任何区域使用拖放来选择矩形。问题是图像必须是透明的,但选定的矩形不是。

如果我使用 css,我会为矩形和背景位置设置背景图像,但我还没有发现 svg 的这种可能性(可能是 ie 的 vml)。

如何裁剪图像并将其放在透明图像上或将背景位置设置为矩形?

UPD:实际上我找到了解决方案:对于每个新创建的矩形,我都可以复制图像并使用 clip-rect 属性。但是这个解决方案不符合我的需求。我无法旋转剪辑矩形区域,仅图像。

最佳答案

raphaël 提供的矩形 clip-rect 是您可以在 svg 中执行的操作的子集。

这是一个旋转剪裁的例子:masking-path-02-b

这里有一些更高级的东西:masking-path-07-b

关于image - raphael.js 裁剪图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5632548/

相关文章:

php - 在 SVG 中操作/翻译 <text>(添加边界框)

javascript - 显示低分辨率图像,几秒钟后显示高分辨率图像 (HTML)

java - 图像透明度 - 重叠时丢失 alpha

angular - 使用 svg 文件作为 Angular 应用程序的背景

javascript - 如何使用鼠标坐标在拖动时画线

javascript - 如何为 'Raphael' Canvas 设置动画?

image - Matlab `imagesc` : how to display with smooth colors?

c# - 如何通过矩形以外的形状裁剪图像?

css - 如何在 SVG 中将一个圆圈附加到另一个圆圈之上?

javascript - 使用类名选择器识别元素,但使用此关键字时不识别元素