3

在问我的问题之前，我有一个测试页面，让每个人都能更好地理解我的问题。网址是http://iamthemoon.com/crop/

您可以移动红色选择。

我喜欢只裁剪红色选择区域。我认为它可以在 HTML5 画布中轻松完成，但这是我的错误。首先我用谷歌搜索了 2 天，但我找不到解决方案。有许多基于 HTML5 的裁剪工具，但它们只有方形选择。

然后我研究了 PHP GD 和 imagemagick，但我也找不到解决方案。

我查看了 adobe 在线 Photoshop，但它们也缺少自由形式的套索工具或自由形式的选择工具。

有没有人看到类似的 javascript/php/ruby/ 或任何其他基于 Web 的技术？或者这甚至可能吗？

4

3 回答 3

6

只是为了回答这个问题，如果这是可能的。我不得不处理同样的问题，并花了我一个（完整的）周末来使用 HTML5 解决它。

看看这里的演示。

希望能帮助到你。

编辑：只是一点伪代码：

1.在画布上绘制图片。2.记录鼠标在画布上的点击。3.使用鼠标点击坐标绘制图案 4.用原始图像填充图案。5.用图案替换原始图像。

编辑：源代码发布https://github.com/netplayer/crop

于 2012-07-30T02:05:41.197 回答
1

我正在研究同一主题。我现在的想法是绘制相反的多边形并使用 imagecolorallocatealpha 使它们透明。然后使用 imagefilledpolygon 绘制多边形。对于客户端，我们将使用预定义的图像（因此在 php 中预定义多边形）。我也遇到过这个：http ://brittonkerin.com/image_region_selector/irs_demo.html 。希望这会有所帮助。

于 2012-03-08T10:31:25.787 回答
0

http://shedlimited.debrucellc.com/

使用 html5 绘制线条/坐标，

不仅仅是使用 clip() 而不是 stroke

于 2013-01-17T16:48:23.490 回答