阅读说明：本技术 一种在网页上对pdf文件缩略图的易操作方法 (Easy operation method for PDF (Portable document Format) file thumbnail on webpage ) 是由 郑侃炜 吴德有 李洋溢 于 2018-08-10 设计创作，主要内容包括：本发明公开了一种在网页上对PDF文件缩略图的易操作方法,包含以下步骤：A、用户在网页中导入PDF文件；B、把引入的数据流转为PDF缩略图；C、对当前的PDF缩略进行排序及重命名处理；D、对操作之后的PDF缩略图选中某几个缩略图生成字符串。本发明可以对PDF的页面缩略图在保存之前就把想要的页面顺序以图形方式显示出来,易于用户直观判断。同时又增加了删除PDF页面功能,方便了用户快速剔除不需要的PDF页面。在整理完成之后,还可以根据鼠标再次选中的几个缩略图,重新生成一串字符组合,便于程序人员再次编码。在操作上,直接使用鼠标拖动操作,避免了只是输入数字造成对具体操作的PDF页面误输入。从而具有易用性和可操作性,并且大大提高了工作效率。(The invention discloses an easy operation method for a PDF (Portable document Format) file thumbnail on a webpage, which comprises the following steps of: A. a user imports a PDF file in a webpage; B. converting the introduced data stream into a PDF thumbnail; C. sorting and renaming the current PDF thumbnails; D. selecting some thumbnails from the PDF thumbnails after the operation to generate character strings. The invention can display the page sequence of PDF in a graphic mode before saving the page thumbnail, and is easy for users to judge visually. Meanwhile, the PDF page deleting function is added, so that the user can conveniently and quickly remove the unnecessary PDF pages. After finishing the sorting, a string of character combinations can be regenerated according to a plurality of thumbnails selected by the mouse again, so that the programmer can encode the character combinations again conveniently. In operation, the mouse is directly used for dragging operation, so that the error input of the PDF page of specific operation caused by only inputting numbers is avoided. Thereby having easy-to-use and operability, and greatly improving the working efficiency.)

一种在网页上对PDF文件缩略图的易操作方法

技术领域

本发明涉及一种文件处理技术，具体是一种在网页上对PDF文件缩略图的易操作方法。

背景技术

现有技术对于PDF文件引入后的网页显示，无非就是三种：

1）只是显示一个PDF的小图标，并不显示缩略图。

2）引入PDF文件后，只显示每个PDF文件的第一页缩略图。

3）引入PDF文件后，按照每个文档的先后顺序显示所有页面的缩略图，不能移动，不能删除，仅作为显示用。

以下为详细步骤：

方法一：

1）打开网页，使用JS引入PDF文件。

2）使用其它小图片作为图像缩略图。

方法二：

1）打开网页，使用JS引入PDF文件。

2）打开PDF文件，对PDF的第一页另存为图片。

3）网页对另存后的图片进行显示。

方法三：

1）打开网页，使用JS引入PDF文件。

2）打开PDF文件，对PDF每一页另存为图片。

3）网页对所有文件的PDF图片顺序显示。

传统的PDF缩略图显示方法，不能对缩略图进行移动，也不能删除。在实际工作中对于想对某页PDF进行操作，比如删除它，或者把它移动到其它PDF页面之后或之前，就不能实现了。

发明内容

本发明的目的在于提供一种在网页上对PDF文件缩略图的易操作方法，以解决上述背景技术中提出的问题。

为实现上述目的，本发明提供如下技术方案：

一种在网页上对PDF文件缩略图的易操作方法，包含以下步骤：

A、用户在网页中导入PDF文件；

B、把引入的数据流转为PDF缩略图；

C、对当前的PDF缩略进行排序及重命名处理；

D、对操作之后的PDF缩略图选中某几个缩略图生成字符串。

作为本发明的进一步技术方案：所述步骤B包括2个方法：方法一、把当前数据流JS转为PDF对象，再由PDF对象转换为缩略图，方法二、根据html5浏览器的canvas功能，把已经处理好的缩略图显示在网页上面。

作为本发明的进一步技术方案：所述方法一包含以下步骤：①通过JS插件pdf.js获取到缩略图对象，②设置缩略图的宽、高，③使用HTML超文本标记语言在画布canvas上面显示此缩略图，④重置画布canvas的宽高，同时设置画布的页面计数属性，⑤增加其它缩略图，⑥使用html超文本标记语言设置画布的序号。

作为本发明的进一步技术方案：根据权利要求3所述的一种在网页上对PDF文件缩略图的易操作方法，其特征在于，所述方法二包含以下步骤：①通过JS插件pdf.js获取到缩略图对象，②设置缩略图的宽、高，③使用HTML超文本标记语言在画布canvas上面显示此缩略图，④重置画布canvas的宽高，同时设置画布的页面计数属性，⑤增加其它缩略图，⑥使用html超文本标记语言设置画布的序号。

作为本发明的进一步技术方案：所述步骤B具体是：①通过JS插件pdf.js获取到缩略图对象，②设置缩略图的宽、高，③使用HTML超文本标记语言在画布canvas上面显示此缩略图，④重置画布canvas的宽高，同时设置画布的页面计数属性，⑤增加其它缩略图，⑥使用html超文本标记语言设置画布的序号。

作为本发明的进一步技术方案：所述步骤C具体包括：①设置排序函数参数：延时变量，列表类型，画布的不透明度，是否更新等，②通过JS插件pdftool.js得到已经被鼠标选中的画布信息，③移动鼠标得到新的画布位置，重置画布序号,④通过HTML超文本标记语言得到被选中的画布信息，⑤依次对选中画布里面的PDF页码序号重新命名。

作为本发明的进一步技术方案：所述步骤D具体包括：①获取“鼠标已经选择”的画布canvas信息，送入临时变量，②提取画布canvas信息中的文件序号信息、页码信息，③以“文件引入序列号-PDF页面所在当前文件的页码序号”方式，从前至后排列字符串，中间使用逗号分隔，放入HTML超文本标记语言的text1控件中，便于再次编程使用，④提取“所有”画布从前至后信息，提取画布canvas信息中的文件序号信息、页码信息，⑤字符串组合方法类似上面的③，放入HTML超文本标记语言的text2控件中，便于再次编程使用。

与现有技术相比，本发明的有益效果是：本发明可以对PDF的页面缩略图在保存之前就把想要的页面顺序以图形方式显示出来，易于用户直观判断。同时又增加了删除PDF页面功能，方便了用户快速剔除不需要的PDF页面。在整理完成之后，还可以根据鼠标再次选中的几个缩略图，重新生成一串字符组合，便于程序人员再次编码。在操作上，直接使用鼠标拖动操作，避免了只是输入数字造成对具体操作的PDF页面误输入。从而具有易用性和可操作性，并且大大提高了工作效率。

附图说明

图1为本发明的流程图。

具体实施方式

下面将结合本发明实施例中的附图，对本发明实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅仅是本发明一部分实施例，而不是全部的实施例。基于本发明中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例，都属于本发明保护的范围。

请参阅图1，一种在网页上对PDF文件缩略图的易操作方法，包含以下步骤：

A、用户在网页中导入PDF文件

使用任何网页设计工具设计出网页。网页主要需要显示的信息为：功能按钮“引入文件”，附属其它说明文字。此部分要求浏览器支持超文本标记语言html5的canvas功能.详细的编程结构为：

①为支持IE浏览器，需要引入javascript插件excanvas.js

②用户使用鼠标点击“引入文件”由JS代码从网页端把PDF文件导入至浏览器，其中主要使用插件webuploader.js把当前文件转为数据流。

③设置一个变量，对当前引入的文件个数进行计数。

④分别对每个引入的文件使用样式定义。同时记录每个文件的标志码及其大小。

⑤其它功能部分代码。

⑥设置系统状态为等待。

B、把引入的数据流转为PDF缩略图

㈠把当前数据流JS转为PDF对象，再由PDF对象转换为缩略图：

①使用JS页面渲染方法renderView，引入参数包括：文件名，文件个数，PDF临时变量，PDF计数变量，视图模式等。

②设置维度变量：130/PDF页面文件的宽度，130/PDF页面文件的高度

③生成PDF文件的canvas(画布)。

④如果视图模式为页面模式，则累加页面计数参数。

⑤其它功能部分代码。

⑥使用html超文本标记语言展示页面个数，页面索引，同时增加一个是否删除的按钮。

㈡根据html5浏览器的canvas功能（支持此功能的浏览器，目前的主流新版本浏览器如IE9及Google最新版本浏览器），把已经处理好的缩略图显示在网页上面：

①通过JS插件pdf.js获取到缩略图对象。

②设置缩略图的宽、高。

③使用HTML超文本标记语言在画布canvas上面显示此缩略图。

④重置画布canvas的宽高，同时设置画布的页面计数属性。

⑤增加其它缩略图。

⑥使用html超文本标记语言设置画布的序号。

C、对当前的PDF缩略进行排序及重命名处理

㈠对当前的PDF缩略图进行排序处理，同时支持鼠标操作：

①设置排序函数参数：延时变量，列表类型，画布的不透明度，是否更新等。

②通过JS插件pdftool.js得到已经被鼠标选中的画布信息。

③移动鼠标得到新的画布位置，重置画布序号。

㈡重命名部分：

①通过HTML超文本标记语言得到被选中的画布信息。

②依次对选中画布里面的PDF页码序号重新命名。

D、对操作之后的PDF缩略图选中某几个缩略图生成字符串

对上面显示好的PDF缩略图，也可以通过鼠标重新点击后再形成一个新的字符串，便于编程人员再次对其开发：

①获取“鼠标已经选择”的画布canvas信息，送入临时变量。

②提取画布canvas信息中的文件序号信息、页码信息。

③以“文件引入序列号-PDF页面所在当前文件的页码序号”方式，从前至后排列字符串，中间使用逗号分隔，放入HTML超文本标记语言的text1控件中，便于再次编程使用。

④提取“所有”画布从前至后信息，提取画布canvas信息中的文件序号信息、页码信息。

⑤字符串组合方法类似上面的③，放入HTML超文本标记语言的text2控件中，便于再次编程使用。

本发明的工作原理是：本设计提供一种不需要把PDF页面另存为图片，直接在网页上面显示为缩略图，同时可以对多个文件的不同页PDF进行移动，删除，鼠标按住拖动等操作。这样既提高了用户打开PDF文件的快速操作判断，同时又由于不需要另存为图片再重新引入，提高了系统的工作效率。不同文件的PDF缩略图之间可以移动，可以组合成为新的PDF文件，或者删除某个PDF页面，提供了更多实用性操作。这样既提高了计算机系统的工作效率，又对用户再次处理多个PDF文件或单个PDF文件提供了更多的操作可能，从而提高了PDF文件的再次整理效率。

对于本领域技术人员而言，显然本发明不限于上述示范性实施例的细节，而且在不背离本发明的精神或基本特征的情况下，能够以其他的具体形式实现本发明。因此，无论从哪一点来看，均应将实施例看作是示范性的，而且是非限制性的，本发明的范围由所附权利要求而不是上述说明限定，因此旨在将落在权利要求的等同要件的含义和范围内的所有变化囊括在本发明内。不应将权利要求中的任何附图标记视为限制所涉及的权利要求。

此外，应当理解，虽然本说明书按照实施方式加以描述，但并非每个实施方式仅包含一个独立的技术方案，说明书的这种叙述方式仅仅是为清楚起见，本领域技术人员应当将说明书作为一个整体，各实施例中的技术方案也可以经适当组合，形成本领域技术人员可以理解的其他实施方式。