CN103020065B - 一种基于Web页面的签名板实现方法和一种Web系统 - Google Patents
一种基于Web页面的签名板实现方法和一种Web系统 Download PDFInfo
- Publication number
- CN103020065B CN103020065B CN201110282828.7A CN201110282828A CN103020065B CN 103020065 B CN103020065 B CN 103020065B CN 201110282828 A CN201110282828 A CN 201110282828A CN 103020065 B CN103020065 B CN 103020065B
- Authority
- CN
- China
- Prior art keywords
- signature
- web
- board
- user
- browser
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Active
Links
- 238000000034 method Methods 0.000 title claims abstract description 23
- 230000005540 biological transmission Effects 0.000 description 4
- 238000010586 diagram Methods 0.000 description 4
- 239000003086 colorant Substances 0.000 description 2
- 239000000284 extract Substances 0.000 description 2
- 238000012986 modification Methods 0.000 description 1
- 230000004048 modification Effects 0.000 description 1
Landscapes
- Information Transfer Between Computers (AREA)
Abstract
本发明公开了一种基于Web页面的签名板实现方法和一种Web系统。所述方法包括：服务器在Web页面上增加一个Web签名板，当用户浏览Web页面时，服务器通过浏览器将所述Web签名板显示在Web页面上输出给用户；浏览器获取用户输入的签名文件，并上传到服务器；服务器从所述签名文件中获取签名图片，利用图像叠加技术将所述签名图片添加到所述Web签名板上；服务器通过浏览器将所述添加签名图片后Web签名板显示在Web页面上输出给用户。本发明的技术方案，使得能够在Web页面上展示用户的个性签名。
Description
技术领域
本发明涉及互联网Web技术领域，特别是涉及一种基于Web页面的签名板实现方法和一种Web系统。
背景技术
随着互联网系统的高速发展，Web页面成为互联网最广泛的服务载体。基于个性展示或者相同特性兴趣爱好等，形成了博客、贴吧、论坛等各种各样的web服务平台，在这些聚合了大量人群的平台上，各参与者可以及时沟通、即时互动、共享信息等。但是目前还无法满足参与者更多的个性展示需求，尤其是无法复制的手写个性签名。
发明内容
本发明提供了一种基于Web页面的签名板实现方法，该方法使得能够在Web页面上展示用户的个性签名。
本发明还提供了一种Web系统，该Web系统能够在Web页面上展示用户的个性签名。
为达到上述目的，本发明的技术方案是这样实现的：
本发明公开了一种基于Web页面的签名板实现方法，其特征在于，该方法包括：
服务器在Web页面上增加一个Web签名板；
用户浏览Web页面时，服务器将所述Web签名板显示在Web页面上发送给浏览器，浏览器将所述Web签名板显示在Web页面上输出给用户；
浏览器获取用户输入的签名文件，并上传到服务器；
服务器从所述签名文件中获取签名图片，利用图像叠加技术将所述签名图片添加到所述Web签名板上；
服务器将所述添加签名图片后的Web签名板显示在Web页面上发送给浏览器，浏览器将所述添加签名图片后Web签名板显示在Web页面上输出给用户。
上述方法中，所述浏览器获取用户输入的签名文件包括：
浏览器获取用户已保存在计算机中的签名文件；所述已保存在计算机中的签名文件为：签名扫描件或签名照片；
或者，浏览器获取用户使用鼠标或手写笔在所述Web签名板上书写的签名文件。
上述方法中，所述浏览器获取用户已保存在计算机中的签名文件包括：
浏览器在所述Web签名板上向用户输出上传签名功能按钮；
当用户点击该上传签名功能按钮时弹出打开文件对话框，用户选择已保存在计算机中的签名文件。
上述方法中，所述浏览器获取用户使用鼠标或手写笔在所述Web签名板上书写的签名文件包括：
浏览器在所述Web签名板上向用户输出手写签名功能按钮；
当用户点击该手写签名功能按钮时在所述Web签名板上显示输出签名笔工具栏，用户选择签名笔使用鼠标或手写笔在Web签名板上书写签名。
上述方法中，所述服务器从所述签名文件中获取签名图片包括：
对签名文件做背景透明处理，利用签名文件中的签名图像与背景的色差，从签名文件中提取出签名图片。
上述方法中，所述利用图像叠加技术将所述签名图片添加到所述Web签名板上包括：
使用TransparentBlt透明处理函数或AlphaBlend透明处理函数将所述签名图片绘制到所述Web签名板上。
本发明还公开一种Web系统，该Web系统包括：浏览器和服务器，其中：
服务器，用于在Web页面上增加一个Web签名板，将所述Web签名板显示在Web页面上发送给浏览器，接收浏览器上传的签名文件，从所述签名文件中获取签名图片，利用图像叠加技术将所述签名图片添加到Web签名板上，将添加签名图片后的Web签名板显示在Web页面上发送给浏览器；
浏览器，用于根据服务器的发送，将Web签名板显示在Web页面上输出给用户，获取用户输入的签名文件并上传到服务器，根据服务器的发送，将添加签名图片后Web签名板显示在Web页面上输出给用户。
所述浏览器，用于获取用户已保存在计算机中的签名文件，或者，获取用户使用鼠标或手写笔在所述Web签名板上书写的签名文件；
所述已保存在计算机中的签名文件为：签名扫描件或签名照片。
浏览器，用于在所述Web签名板上向用户输出上传签名功能按钮，当用户点击该上传签名功能按钮时弹出打开文件对话框，用户选择已保存在计算机中的签名文件。
或者，
浏览器，用于在所述Web签名板上向用户输出手写签名功能按钮，当用户点击该手写签名功能按钮时在所述Web签名板上显示输出签名笔工具栏，用户选择签名笔使用鼠标或手写笔在Web签名板上书写签名。
所述服务器，用于对签名文件做背景透明处理，利用签名文件中的签名图像与背景的色差，从签名文件中提取出签名图片。
由上述可见，本发明这种，服务器在Web页面上增加一个Web签名板；用户浏览Web页面时，服务器将所述Web签名板显示在Web页面上发送给浏览器，浏览器将所述Web签名板显示在Web页面上输出给用户；浏览器获取用户输入的签名文件，并上传到服务器；服务器从所述签名文件中获取签名图片，利用图像叠加技术将所述签名图片添加到所述Web签名板上；服务器将所述添加签名图片后的Web签名板显示在Web页面上发送给浏览器，浏览器将所述添加签名图片后Web签名板显示在Web页面上输出给用户的技术方案，能够在Web页面上展示用户的个性签名。
附图说明
图1是本发明实施例中的一种基于Web页面的签名板实现方法的流程图；
图2是本发明实施例中的Web页面上的Web签名板的一个示意图；
图3是本发明实施例中的输出签名笔工具栏的Web签名板的示意图。
具体实施方式
为了使本发明的目的、技术方案和优点更加清楚，下面结合附图和具体实施例对本发明进行详细描述。
图1是本发明实施例中的一种基于Web页面的签名板实现方法的流程图，如图1所示，该方法包括：
101，服务器在Web页面上增加一个Web签名板。
102，用户浏览Web页面时，服务器将所述Web签名板显示在Web页面上发送给浏览器，浏览器将所述Web签名板显示在Web页面上输出给用户。
本步骤中，Web页面上的Web签名板上显示已签的个性化签名。
103，浏览器获取用户输入的签名文件，并上传到服务器。
本步骤中，浏览器即可以获取用户已保存在计算机中的签名文件，也可以获取用户使用鼠标或手写笔在所述Web签名板上书写的签名文件。在Web签名板上向用户输出“上传签名”功能按钮和“手写签名”功能按钮，以供用户选择输入签名文件的方式。后续对这两种方式详细说明。
104，服务器从所述签名文件中获取签名图片，利用图像叠加技术将所述签名图片添加到所述Web签名板上。
105，服务器将所述添加签名图片后的Web签名板显示在Web页面上发送给浏览器，浏览器将所述添加签名图片后Web签名板显示在Web页面上输出给用户。
图1所示的技术方案，能够在Web页面上展示用户的个性签名。
图2是本发明实施例中的Web页面上的Web签名板的一个示意图。在图2中，对与本发明无关的内容进行了模糊处理。
下面对上述步骤103中提到的两种获取用户签名图片的方式进行详细说明。
第一种方式：浏览器获取用户已保存在计算机中的签名文件
1.1浏览器在所述Web签名板上向用户输出“上传签名”功能按钮，用户点击该“上传签名”功能按钮；
1.2弹出打开文件对话框，用户选择已保存在计算机中的签名文件；该签名文件可以是签名扫描件，也可以是签名照片；
1.3浏览器上传用户的签名文件到服务器，服务器中的图片处理模块对用户的签名文件做背景透明处理，即将签名文件的背景修改为白色；
1.4服务器对签名文件中签名图像，利用签名图像与背景的色差，提取出边界尺寸，即保留签名的有效部分的最小图片，从而提取出签名图片；
1.5服务器将签名图片利用图像叠加技术，例如使用TransparentBlt、AlphaBlend等系统自带的透明处理函数或者类似功能函数，将签名图片绘制到Web签名板上返回给浏览器；
1.6浏览器更新页面上的签名图片。
第二种方式：浏览器获取用户使用鼠标或手写笔在所述群组签名板上书写的签名文件
2.1浏览器在所述Web签名板上向用户输出“手写签名”功能按钮，用户点击该“手写签名”功能按钮；
2.2在所述Web签名板上显示输出签名笔工具栏；
具体来说，在Web签名板上使用Flash或者ActiveX覆盖一个透明的无边框签名区域窗口，签名区域内显示Flash或者ActiveX创建的工具栏，在工具栏上用户可以选择不同的签名笔或者签名颜色；
图3是本发明实施例中的输出签名笔工具栏的Web签名板的示意图；图3中也对与本发明无关的内容进行了模糊处理。
2.3用户选择签名笔；
2.4用户使用鼠标或手写笔在Web签名板上书写签名，完成后点击完成按钮；
2.5浏览器将用户书写好的签名文件上传到服务器；
2.6服务器对签名文件中的签名图像，利用签名图像与背景的色差，提取出边界尺寸，即保留签名的有效部分的最小图片，从而提取出签名图片；
2.7服务器使用图像叠加技术，将签名图片绘制在用户书写的位置，然后将叠加后的签名图片发给浏览器；
2.8浏览器更新页面上的签名图片。
基于上述实施例给出本发明中的一种Web系统，该Web系统包括：浏览器和服务器，其中：
服务器，用于在Web页面上增加一个Web签名板，将所述Web签名板显示在Web页面上发送给浏览器，接收浏览器上传的签名文件，从所述签名文件中获取签名图片，利用图像叠加技术将所述签名图片添加到Web签名板上，将添加签名图片后的Web签名板显示在Web页面上发送给浏览器；
浏览器，用于根据服务器的发送，将Web签名板显示在Web页面上输出给用户，获取用户输入的签名文件并上传到服务器，根据服务器的发送，将添加签名图片后Web签名板显示在Web页面上输出给用户。
所述浏览器，用于获取用户已保存在计算机中的签名文件，或者，获取用户使用鼠标或手写笔在所述Web签名板上书写的签名文件；
所述已保存在计算机中的签名文件为：签名扫描件或签名照片。
浏览器，用于在所述Web签名板上向用户输出上传签名功能按钮，当用户点击该上传签名功能按钮时弹出打开文件对话框，用户选择已保存在计算机中的签名文件。
或者，
浏览器，用于在所述Web签名板上向用户输出手写签名功能按钮，当用户点击该手写签名功能按钮时在所述Web签名板上显示输出签名笔工具栏，用户选择签名笔使用鼠标或手写笔在Web签名板上书写签名。
所述服务器，用于对签名文件做背景透明处理，利用签名文件中的签名图像与背景的色差，从签名文件中提取出签名图片。
综上所述，在本发明中，在Web页面上增加一Web签名板，签名板内显示已有的签名图片，各参与者可以在Web签名板上添加或者书写自己的个性签名。添加签名可以选择个性签名的扫描件或者照片，上传提交签名到Web服务端后，由Web服务端程序进行签名内容提取，利用图像叠加技术，将个性签名添加到签名图片；书写个性签名，则使用Flash技术或者ActiveX创建一个绘图板，覆盖在web签名板的上层，选择不同的签名笔，使用不同的颜色，使用鼠标或者手写笔在签名板上直接书写个性签名，书写完毕后，将书写的签名上传提交到web服务端，由Web服务端程序进行签名内容提取，利用图像叠加技术将个性签名添加到签名板，使不同群成员的个性化签名集中体现在群组签名板上。
以上所述仅为本发明的较佳实施例而已，并不用以限制本发明，凡在本发明的精神和原则之内，所做的任何修改、等同替换、改进等，均应包含在本发明保护的范围之内。
Claims (9)
1.一种基于Web页面的签名板实现方法，其特征在于，该方法包括：
服务器在Web页面上增加一个Web签名板，签名板内显示已有的签名图片；
用户浏览Web页面时，服务器将所述Web签名板显示在Web页面上发送给浏览器，浏览器将所述Web签名板显示在Web页面上输出给用户；
浏览器获取用户输入的签名文件，并上传到服务器；
所述浏览器获取用户输入的签名文件包括：
浏览器获取用户使用鼠标或手写笔在所述Web签名板上书写的签名文件；
所述浏览器获取用户使用鼠标或手写笔在所述Web签名板上书写的签名文件包括：
浏览器在所述Web签名板上向用户输出手写签名功能按钮；
当用户点击该手写签名功能按钮时在所述Web签名板上显示输出签名笔工具栏，用户选择签名笔使用鼠标或手写笔在Web签名板上书写签名；
服务器从所述签名文件中获取签名图片，利用图像叠加技术将所述签名图片添加到所述Web签名板上；
服务器将所述添加签名图片后的Web签名板显示在Web页面上发送给浏览器，浏览器将所述添加签名图片后Web签名板显示在Web页面上输出给用户。
2.根据权利要求1所述的方法，其特征在于，所述浏览器获取用户输入的签名文件包括：
浏览器获取用户已保存在计算机中的签名文件；所述已保存在计算机中的签名文件为：签名扫描件或签名照片。
3.根据权利要求2所述的方法，其特征在于，所述浏览器获取用户已保存在计算机中的签名文件包括：
浏览器在所述Web签名板上向用户输出上传签名功能按钮；
当用户点击该上传签名功能按钮时弹出打开文件对话框，用户选择已保存在计算机中的签名文件。
4.根据权利要求1至3中任一项所述的方法，其特征在于，所述服务器从所述签名文件中获取签名图片包括：
对签名文件做背景透明处理，利用签名文件中的签名图像与背景的色差，从签名文件中提取出签名图片。
5.根据权利要求1至3中任一项所述的方法，其特征在于，所述利用图像叠加技术将所述签名图片添加到所述Web签名板上包括：
使用TransparentBlt透明处理函数或AlphaBlend透明处理函数将所述签名图片绘制到所述Web签名板上。
6.一种Web系统，其特征在于，该Web系统包括：浏览器和服务器，其中：
服务器，用于在Web页面上增加一个Web签名板，签名板内显示已有的签名图片，将所述Web签名板显示在Web页面上发送给浏览器，接收浏览器上传的签名文件，从所述签名文件中获取签名图片，利用图像叠加技术将所述签名图片添加到Web签名板上，将添加签名图片后的Web签名板显示在Web页面上发送给浏览器；
浏览器，用于根据服务器的发送，将Web签名板显示在Web页面上输出给用户，获取用户使用鼠标或手写笔在所述Web签名板上书写的签名文件并上传到服务器，根据服务器的发送，将添加签名图片后Web签名板显示在Web页面上输出给用户；
所述浏览器，获取用户使用鼠标或手写笔在所述Web签名板上书写的签名文件包括，浏览器在所述Web签名板上向用户输出手写签名功能按钮，当用户点击该手写签名功能按钮时在所述Web签名板上显示输出签名笔工具栏，用户选择签名笔使用鼠标或手写笔在Web签名板上书写签名。
7.根据权利要求6所述的Web系统，其特征在于，
所述浏览器，用于获取用户已保存在计算机中的签名文件；
所述已保存在计算机中的签名文件为：签名扫描件或签名照片。
8.根据权利要求7所述的Web系统，其特征在于，
浏览器，用于在所述Web签名板上向用户输出上传签名功能按钮，当用户点击该上传签名功能按钮时弹出打开文件对话框，用户选择已保存在计算机中的签名文件。
9.根据权利要求6至8中任一项所述的Web系统，其特征在于，
所述服务器，用于对签名文件做背景透明处理，利用签名文件中的签名图像与背景的色差，从签名文件中提取出签名图片。
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201110282828.7A CN103020065B (zh) | 2011-09-22 | 2011-09-22 | 一种基于Web页面的签名板实现方法和一种Web系统 |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201110282828.7A CN103020065B (zh) | 2011-09-22 | 2011-09-22 | 一种基于Web页面的签名板实现方法和一种Web系统 |
Publications (2)
| Publication Number | Publication Date |
|---|---|
| CN103020065A CN103020065A (zh) | 2013-04-03 |
| CN103020065B true CN103020065B (zh) | 2016-09-07 |
Family
ID=47968681
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN201110282828.7A Active CN103020065B (zh) | 2011-09-22 | 2011-09-22 | 一种基于Web页面的签名板实现方法和一种Web系统 |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN103020065B (zh) |
Families Citing this family (6)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN105635745B (zh) * | 2015-12-23 | 2019-10-22 | 广州华多网络科技有限公司 | 基于在线直播应用而生成签名照的方法及客户端 |
| CN107329681A (zh) * | 2017-05-11 | 2017-11-07 | 广东网金控股股份有限公司 | 一种基于web的原笔迹手写输入方法、装置及终端 |
| CN108932413B (zh) * | 2017-05-22 | 2021-04-30 | 腾讯科技（北京）有限公司 | 一种数字签名生成方法、装置及存储介质 |
| CN110446091A (zh) * | 2019-07-23 | 2019-11-12 | 天脉聚源(杭州)传媒科技有限公司 | 一种虚拟观众显示方法、系统、装置和存储介质 |
| CN112787989B (zh) * | 2020-06-08 | 2023-05-26 | 北京金山办公软件股份有限公司 | 一种签名方法及装置 |
| CN112000930A (zh) * | 2020-08-21 | 2020-11-27 | 深圳传音控股股份有限公司 | 文档的签名方法、终端设备及存储介质 |
Citations (2)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN1506907A (zh) * | 2002-12-13 | 2004-06-23 | 天瀚科技股份有限公司 | 可呈现亲笔笔迹的系统与方法 |
| CN101311893A (zh) * | 2007-05-23 | 2008-11-26 | 佳能株式会社 | 混合真实呈现设备及其控制方法 |
-
2011
- 2011-09-22 CN CN201110282828.7A patent/CN103020065B/zh active Active
Patent Citations (2)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN1506907A (zh) * | 2002-12-13 | 2004-06-23 | 天瀚科技股份有限公司 | 可呈现亲笔笔迹的系统与方法 |
| CN101311893A (zh) * | 2007-05-23 | 2008-11-26 | 佳能株式会社 | 混合真实呈现设备及其控制方法 |
Non-Patent Citations (1)
| Title |
|---|
| 签出你的个性 论坛签名最流行的三种样式;段永军;《中国电脑教育》;20030818;第1-2页 * |
Also Published As
| Publication number | Publication date |
|---|---|
| CN103020065A (zh) | 2013-04-03 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN103020065B (zh) | 一种基于Web页面的签名板实现方法和一种Web系统 | |
| US8358280B2 (en) | Electronic device capable of showing page flip effect and method thereof | |
| US10572779B2 (en) | Electronic information board apparatus, information processing method, and computer program product | |
| CN103492997B (zh) | 用于操作电子书中的用户注释的系统和方法 | |
| US8331677B2 (en) | Combined image and text document | |
| US20100045616A1 (en) | Electronic device capable of showing page flip effect and method thereof | |
| CN104408137B (zh) | 一种网络统计地图可视化数据制备方法 | |
| US20160077722A1 (en) | Rotatable Object System For Visual Communication And Analysis | |
| US20090222756A1 (en) | Electronic device capable of showing page flip effect and method thereof | |
| Kirschenbaum | “So the colors cover the wires”: Interface, aesthetics, and usability | |
| GB2493765A (en) | A method of producing a greetings card | |
| US20220027026A1 (en) | Ink annotation sharing method and system | |
| AU2009231671B2 (en) | Decoupled applications for printed materials | |
| CN106297477B (zh) | 一种生成数字化字帖的方法及装置 | |
| US20170315710A1 (en) | Methods and systems for creating and using electronic coloring pages | |
| Wood | Basics Interactive Design: Interface Design: An introduction to visual communication in UI design | |
| CN109584129A (zh) | 一种书法的临摹方法和装置 | |
| CN107452288B (zh) | 电子装置和电子广告的播放及互动方法 | |
| CN111027533A (zh) | 一种点读坐标的变换方法、系统、终端设备及存储介质 | |
| CN103023743B (zh) | 一种基于im群组的签名板实现方法和一种im系统 | |
| EP1695194A1 (en) | Creating responses for an electronic pen-computer multimedia interactive system | |
| CN114842115A (zh) | 生成商品主图的方法及电子设备 | |
| CN102111576B (zh) | 一种实现手工画线的字幕机 | |
| Rai et al. | MyOcrTool: visualization system for generating associative images of Chinese characters in smart devices | |
| Ouali et al. | Text recuperated using ontology with stable marriage optimization technique and text visualization using AR |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| C06 | Publication | ||
| PB01 | Publication | ||
| C10 | Entry into substantive examination | ||
| SE01 | Entry into force of request for substantive examination | ||
| C14 | Grant of patent or utility model | ||
| GR01 | Patent grant | ||
| CP02 | Change in the address of a patent holder |
Address after: Room 818, 8 / F, 34 Haidian Street, Haidian District, Beijing 100080 Patentee after: BEIJING ULTRAPOWER SOFTWARE Co.,Ltd. Address before: 100089 Beijing city Haidian District wanquanzhuang Road No. 28 Wanliu new building A block 5 layer Patentee before: BEIJING ULTRAPOWER SOFTWARE Co.,Ltd. |
|
| CP02 | Change in the address of a patent holder |