@2080code/pic-processer 0.0.1 → 0.0.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +27 -8
- package/package.json +2 -2
package/README.md
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
# pic-processer
|
|
2
|
-
图片压缩、改变图片尺寸、File和
|
|
2
|
+
图片压缩、改变图片尺寸、File 和 dataURL 互转
|
|
3
3
|
|
|
4
4
|
## 安装
|
|
5
5
|
```bash
|
|
@@ -8,22 +8,31 @@ npm install @2080code/pic-processer
|
|
|
8
8
|
|
|
9
9
|
## 使用
|
|
10
10
|
```javascript
|
|
11
|
-
import
|
|
11
|
+
import picProcesser from '@2080code/pic-processer'
|
|
12
12
|
```
|
|
13
13
|
或
|
|
14
14
|
```html
|
|
15
15
|
<script src="lib/pic-processer.min.js"></script>
|
|
16
16
|
```
|
|
17
|
+
|
|
18
|
+
例子：
|
|
17
19
|
```javascript
|
|
18
|
-
|
|
20
|
+
// 使用前先实例化一个对象：
|
|
21
|
+
const picProcesser = new PicProcesser()
|
|
22
|
+
// 应用：
|
|
23
|
+
picProcesser.getDataURL(file)
|
|
24
|
+
picProcesser.compress(file, 0.2)
|
|
25
|
+
picProcesser.getDataURL(file)
|
|
19
26
|
```
|
|
20
27
|
|
|
21
28
|
## 方法
|
|
22
|
-
###
|
|
29
|
+
### compress
|
|
30
|
+
压缩图片质量、改变图片尺寸，输出 dataURL
|
|
23
31
|
|
|
24
32
|
```javascript
|
|
25
|
-
picProcesser.compress(file,0.2,1000,'image/png')
|
|
33
|
+
picProcesser.compress(file, 0.2, 1000, 'image/png')
|
|
26
34
|
```
|
|
35
|
+
#### 参数
|
|
27
36
|
参数|类型|默认值|说明
|
|
28
37
|
---|---|---|---
|
|
29
38
|
`file` | File | `null` | 图片文件
|
|
@@ -31,33 +40,43 @@ picProcesser.compress(file,0.2,1000,'image/png')
|
|
|
31
40
|
`maxWidth` | number | `null` | 图片宽度上限，>1的整数，单位px，`0` 或 `null` 表示不限制，输出图片的高度会等比例缩放
|
|
32
41
|
`mime` | string | `image/jpeg` | 输出图片类型
|
|
33
42
|
|
|
43
|
+
#### 返回
|
|
34
44
|
返回值|类型|说明
|
|
35
45
|
---|---|---
|
|
36
46
|
`Promise<string>` | `Promise<string>` | 压缩后的图片 dataURL 编码
|
|
37
47
|
|
|
38
48
|
*注意：因为是借助 canvas 渲染输出，几乎是重绘了图片，所以如果压缩比率（`ratio`）设置得太高，最终文件字节可能会比原图更大*
|
|
39
49
|
|
|
40
|
-
###
|
|
50
|
+
### getDataURL
|
|
51
|
+
File 转 dataURL
|
|
52
|
+
|
|
41
53
|
```javascript
|
|
42
54
|
picProcesser.getDataURL(file)
|
|
43
55
|
```
|
|
56
|
+
#### 参数
|
|
44
57
|
参数|类型|默认值|说明
|
|
45
58
|
---|---|---|---
|
|
46
59
|
`file` | File|Blob | `null` | 图片文件
|
|
47
60
|
|
|
61
|
+
#### 返回
|
|
48
62
|
返回值|类型|说明
|
|
49
63
|
---|---|---
|
|
50
64
|
`Promise<FileReader>` | `Promise<FileReader>` | 完整的 FileReader 对象，通过`result`属性获取 base64 编码
|
|
51
65
|
|
|
52
|
-
###
|
|
66
|
+
### dataURLtoFile
|
|
67
|
+
dataURL 转 File 对象
|
|
68
|
+
|
|
53
69
|
```javascript
|
|
54
|
-
picProcesser.dataURLtoFile('export.jpg',dataURL)
|
|
70
|
+
picProcesser.dataURLtoFile('export.jpg', dataURL)
|
|
55
71
|
```
|
|
72
|
+
|
|
73
|
+
#### 参数
|
|
56
74
|
参数|类型|默认值|说明
|
|
57
75
|
---|---|---|---
|
|
58
76
|
`fileName` | string | `null` | 输出文件名
|
|
59
77
|
`dataURL` | string | `null` | base64编码
|
|
60
78
|
|
|
79
|
+
#### 返回
|
|
61
80
|
返回值|类型|说明
|
|
62
81
|
---|---|---
|
|
63
82
|
`Promise<File>` | `Promise<File>` | File 对象
|
package/package.json
CHANGED