angular image crop自定义AngularJS图像裁剪指令

angular-image-crop是一个自包含的AngularJS指令，允许用户在上传图像到服务器之前进行裁剪。该指令具备以下特点：

• 触摸支持：支持触摸操作，允许在移动设备上进行图像裁剪。

• 滑动移动和拖动手柄缩放：用户可以通过滑动和拖动手柄来调整图像的裁剪区域。

• base64编码输出：裁剪后的图像会以base64编码的数据uri形式输出。

• HTML5 Canvas显示图像：利用HTML5 Canvas在灵活的上下文中显示图像，允许用户拖动和缩放。

注意：无论裁剪指南的形状如何，生成的图像始终为方形。例如，选择圆形（'circle'）作为参考线时，裁剪区域显示圆形，但生成的图像仍为方形，必须对其进行遮罩处理以显示为圆形。

浏览器支持：IE10及以上版本，Android 3+，iOS 6+，以及现代浏览器。

用法：

1. 添加依赖项：

angular.module('myApp', ['ImageCropper'])

1. 引入样式表。

2. 初始化指令，示例代码：

<image-cropper height="300px" width="300px">image-cropper>

参数说明：

• width（字符串）：裁剪器的宽度。

• height（字符串）：裁剪器的高度。