diff --git a/README.md b/README.md
index 9a8ea69..01cbe22 100644
--- a/README.md
+++ b/README.md
@@ -8,6 +8,7 @@
---
## 1、背景
+
[PDF.js](https://mozilla.github.io/pdf.js/) 已经提供了 [Viewer](https://mozilla.github.io/pdf.js/web/viewer.html) 用于PDF文件的在线预览,并且提供了一部分的批注功能(FREETEXT、HIGHLIGHT、STAMP、INK)。
在实际使用中,可能会需要各种形式的批注工具,逐产生在viewer上扩展做额外批注的想法。
@@ -18,43 +19,82 @@
+#### 多页盖章
+
+
+
+
+
+#### 移动端
+
+
+
+
+
对PDF Viewer来说,这是一个很有用的功能,如果需求只是简单的批注,项目中的现有功能已经可以直接满足。
如果有更特殊的需求或功能要求,可以在此基础上进一步开发。
-## 2、快速开始
+## 2、绘图工具,已支持移动端 📱
+
+1. 矩形
+2. 圆形
+3. 自由绘制,一段时间内的绘制会被归为一组
+4. 自由高亮,有自动修正
+5. 文字,所有输入文字会被转为图片,可能存在不清晰情况
+6. 签名
+7. 盖章,自由上传图片,支持多页设置
+8. 文字高亮
+9. 文字删除线
+10. 文字下划线
+11. 选择,选中对象 del 删除,或者双击删除
+
+
+## 3、快速开始
### 初始化
+
```bash
$ npm install 或 yarn
```
+
### 运行开发模式
+
```bash
$ npm run dev 或 yarn dev
```
+
### 查看效果pdfjs viewer 效果
+
仓库自带了一个 DEMO 示例(在examples文件夹中, 进入 ./examples/pdfjs-4.3.136-dist 目录
+
```bash
$ miniserve 或其他静态服务
```
+
打开地址:http://localhost:8080/web/viewer.html 即可看到效果
+## 4、使用方式
-## 3、使用方式
### 修改生成文件地址
+
配置在文件:/configuration/environment.js 中
默认为 examples/pdfjs-4.3.136-dist/web/pdfjs-annotation-extension
- 您可将它修改为您pdfjs dist地址,以方便开发
+ 您可将它修改为您pdfjs dist地址,以方便开发
```bash
output: path.resolve(__dirname, '../examples/pdfjs-4.3.136-dist/web/pdfjs-annotation-extension'),
```
+
### 打包
+
```bash
$ npm run build 或 yarn build
```
+
也可以直接下载发布版本
### pdfjs dist 引入扩展
+
修改文件:pdfjs-dist/web/viewer.html,只需增加一行代码,引入生成的文件即可
```html
@@ -66,11 +106,14 @@
```
-## 4、工作原理
+
+## 5、工作原理
+
利用pdfjs EventBus捕获页面事件,动态插入Konva绘图层,在Konva上绘制图形,并将图形数据转换为 pdfjs annotationStorage对应格式数据,存储至annotationStorage中。
批注类型虽然看上去多了,但实际支持与pdfjs一致,只是做了一些特殊的转换。
关于 pdfjs 批注类型的说明请看这里 👇
https://github.com/mozilla/pdf.js/wiki/Frequently-Asked-Questions#faq-annotations
- ## 5、兼容性
- 目前仅测试 pdfjs-4.3.136-dist, 不支持页面旋转后的绘制
\ No newline at end of file
+## 6、兼容性
+
+ 目前仅测试 pdfjs-4.3.136-dist, 不支持页面旋转后的绘制
diff --git a/examples/demo.gif b/examples/demo.gif
index 3e453dc..f76dd70 100644
Binary files a/examples/demo.gif and b/examples/demo.gif differ
diff --git a/examples/mobile.gif b/examples/mobile.gif
new file mode 100644
index 0000000..851656d
Binary files /dev/null and b/examples/mobile.gif differ
diff --git a/examples/stamp.gif b/examples/stamp.gif
new file mode 100644
index 0000000..fe1eb00
Binary files /dev/null and b/examples/stamp.gif differ