# ImageCrop
**Repository Path**: Yun08/image-crop
## Basic Information
- **Project Name**: ImageCrop
- **Description**: ImageCrop，图片裁剪，图片处理工具，支持自定义裁剪宽度，支持放大缩小移动等，支持Vue 等其他框架；性能优越原生JavasScript写法兼容各类框架。
- **Primary Language**: JavaScript
- **License**: Artistic-2.0
- **Default Branch**: master
- **Homepage**: https://gitee.com/Yun08
- **GVP Project**: No
## Statistics
- **Stars**: 4
- **Forks**: 0
- **Created**: 2022-09-06
- **Last Updated**: 2023-02-27
## Categories & Tags
**Categories**: Uncategorized
**Tags**: 图片裁剪
## README
### 介绍
JavaScript原生裁剪工具，支持滚轮缩放；
### 软件架构
JavaScript
### 使用说明
> vue 需引入src目录的 image-crop文件
```
import ImageCrop 'js/image-crop.js';
import 'css/image-crop.css';
```
> 普通只需引入 dist 里的文件即可使用
```
ImageCrop v2.2
![]()
```
| 属性 | 类型 | 默认值 | 返回值 | 说明 |
| ------------ | ------- | ----------- | ------------ | ------------------------------- |
| el | element | | | element |
| cropWidth | number | 600 | | 裁剪框 宽度 |
| cropHeight | number | 300 | | 裁剪框 高度 |
| canvasWidth | number | 900 | | 画布 宽度 |
| canvasHeight | number | 450 | | 画布 高度 |
| cropBtn | element | #crop | | element，自定义后会隐藏默认按钮 |
| cropCloseBtn | element | #crop-close | | element，自定义后会隐藏默认按钮 |
| onComplete | fn | | | 图片加载完成回调 |
| onChange | fn | | base64 | 实时数据回调 |
| onCrop | fn | | base64, blob | 裁剪回调 |
| onCropReset | fn | | | 重置回调 |