@sbs-plugin/vue2-image-process 0.0.1 → 0.0.3
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 +64 -0
- package/dist/demo.html +1 -0
- package/dist/vue2ImageProcess.common.js +9454 -0
- package/dist/vue2ImageProcess.common.js.map +1 -0
- package/dist/vue2ImageProcess.css +1 -0
- package/dist/vue2ImageProcess.umd.js +9465 -0
- package/dist/vue2ImageProcess.umd.js.map +1 -0
- package/dist/vue2ImageProcess.umd.min.js +2 -0
- package/dist/vue2ImageProcess.umd.min.js.map +1 -0
- package/package.json +55 -8
- package/demo.html +0 -1
- package/vue2-image-process.common.js +0 -272
- package/vue2-image-process.common.js.map +0 -1
- package/vue2-image-process.umd.js +0 -283
- package/vue2-image-process.umd.js.map +0 -1
- package/vue2-image-process.umd.min.js +0 -2
- package/vue2-image-process.umd.min.js.map +0 -1
package/README.md
ADDED
|
@@ -0,0 +1,64 @@
|
|
|
1
|
+
# Features Overview
|
|
2
|
+
1. Image Super-Resolution
|
|
3
|
+
|
|
4
|
+
将低分辨率图片智能放大，提升清晰度和细节表现
|
|
5
|
+
|
|
6
|
+
2. Image Expansion
|
|
7
|
+
|
|
8
|
+
在不破坏原图风格的前提下，自动扩展图像边界或指定区域，实现画面延伸。
|
|
9
|
+
|
|
10
|
+
3. AI Matting
|
|
11
|
+
|
|
12
|
+
智能识别图片内容并抠图
|
|
13
|
+
|
|
14
|
+
4. AI Object Removal
|
|
15
|
+
|
|
16
|
+
轻松擦除图片中不需要的元素
|
|
17
|
+
|
|
18
|
+
# Install and Use
|
|
19
|
+
|
|
20
|
+
1. Install dependencies
|
|
21
|
+
|
|
22
|
+
```bash
|
|
23
|
+
pnpm i @sbs-plugin/vue2-image-process
|
|
24
|
+
```
|
|
25
|
+
|
|
26
|
+
2. Getting Started
|
|
27
|
+
|
|
28
|
+
Import the plugin and register it in your project's entry file (e.g., main.js or main.ts)
|
|
29
|
+
|
|
30
|
+
```bash
|
|
31
|
+
import ImageProcessing from '@sbs-plugin/vue2-image-process';
|
|
32
|
+
import '@sbs-plugin/vue2-image-process/dist/index.css';
|
|
33
|
+
|
|
34
|
+
app.use(ImageProcessing, {
|
|
35
|
+
theme: {
|
|
36
|
+
primaryColor: '#625ae1', // Customize default theme color
|
|
37
|
+
},
|
|
38
|
+
token: 'xxxx' // Example configuration item, adjust according to actual needs
|
|
39
|
+
});
|
|
40
|
+
```
|
|
41
|
+
3. Usage in Components
|
|
42
|
+
|
|
43
|
+
```bash
|
|
44
|
+
<ExpandResolution
|
|
45
|
+
:visible="xxxxx"
|
|
46
|
+
:src="xxxxx"
|
|
47
|
+
@update:visible="xxxxxx"
|
|
48
|
+
/>
|
|
49
|
+
<[[隐私内容 - 已加密]]
|
|
50
|
+
:visible="xxxxxx"
|
|
51
|
+
:src="xxxxxxx"
|
|
52
|
+
@update:visible="xxxxxxxx"
|
|
53
|
+
/>
|
|
54
|
+
<EraserObject
|
|
55
|
+
:visible="xxxxxx"
|
|
56
|
+
:src="xxxxxxx"
|
|
57
|
+
@update:visible="xxxxxxxx"
|
|
58
|
+
/>
|
|
59
|
+
<ExpandImg
|
|
60
|
+
:visible="xxxxxx"
|
|
61
|
+
:src="xxxxxxx"
|
|
62
|
+
@update:visible="xxxxxxxx"
|
|
63
|
+
/>
|
|
64
|
+
```
|
package/dist/demo.html
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
<!doctype html><meta charset="utf-8"><title>vue2ImageProcess demo</title><script src="./vue2ImageProcess.umd.js"></script><link rel="stylesheet" href="./vue2ImageProcess.css"><script>console.log(vue2ImageProcess)</script>
|