CN112001157B - 一种网页数据表格在线设计方法及装置 - Google Patents
一种网页数据表格在线设计方法及装置 Download PDFInfo
- Publication number
- CN112001157B CN112001157B CN202010870603.2A CN202010870603A CN112001157B CN 112001157 B CN112001157 B CN 112001157B CN 202010870603 A CN202010870603 A CN 202010870603A CN 112001157 B CN112001157 B CN 112001157B
- Authority
- CN
- China
- Prior art keywords
- cell
- editing
- state
- data
- current cell
- 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
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F40/00—Handling natural language data
- G06F40/10—Text processing
- G06F40/166—Editing, e.g. inserting or deleting
- G06F40/177—Editing, e.g. inserting or deleting of tables; using ruled lines
Landscapes
- Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- Health & Medical Sciences (AREA)
- Artificial Intelligence (AREA)
- Audiology, Speech & Language Pathology (AREA)
- Computational Linguistics (AREA)
- General Health & Medical Sciences (AREA)
- Physics & Mathematics (AREA)
- General Engineering & Computer Science (AREA)
- General Physics & Mathematics (AREA)
- User Interface Of Digital Computer (AREA)
- Information Transfer Between Computers (AREA)
Abstract
本发明提出了一种网页数据表格在线设计方法及装置。包括:获取当前单元格的运行状态,并对当前单元格的运行状态进行检测,当检测到当前单元格的运行状态为编辑状态时,获取原始鼠标事件;从该原始鼠标事件中提取鼠标点值,并通过该鼠标点值计算出当前单元格位置区域信息,根据该当前单元格位置区域信息生成input编辑框,并将该当前单元格的数据复制存放入input编辑框中;获取第一鼠标事件,从该第一鼠标事件中提取第一鼠标点值,并计算出对应的第一单元格位置区域信息,将input编辑框中存储的数据存入第一单元格中,并隐藏input编辑框。本发明通过利用webassembly技术,能够实现网页数据表格的在线编辑,操作简单方便,提升了用户体验,同时提高了表格编辑速度。
Description
技术领域
本发明涉及网页表格在线设计技术领域,尤其涉及一种网页数据表格在线设计方法及装置。
背景技术
数据分析是指用适当的统计分析方法对收集来的大量数据进行分析,将它们加以汇总和理解并消化,以求最大化地开发数据的功能,发挥数据的作用。数据分析是为了提取有用信息和形成结论而对数据加以详细研究和概括总结的过程。
为了更好对数据进行分析,市面上出现了很多用于数据分析的表格,但是现有的表格设计器不是一个独立的软件就是一个插件,软件如果要应用到多台电脑需要重复进行安装,并且需要人为对数据进行上传,操作繁琐,而插件容易出现版权问题,并且不能完全实现用户需求,所以亟需一种网页数据表格在线设计方法,能够满足用户需求的同时简化操作。
上述内容仅用于辅助理解本发明的技术方案,并不代表承认上述内容是现有技术。
发明内容
有鉴于此,本发明提出了一种网页数据表格在线设计方法及装置,旨在解决现有技术无法通过webassembly实现网页表格在线汇编功能的技术问题。
本发明的技术方案是这样实现的:
一方面,本发明提供了一种网页数据表格在线设计方法,所述网页数据表格在线设计方法包括以下步骤:
S1,获取当前单元格的运行状态,并对当前单元格的运行状态进行检测,当检测到当前单元格的运行状态为编辑状态时,获取原始鼠标事件;
S2,从该原始鼠标事件中提取鼠标点值,并通过该鼠标点值计算出当前单元格位置区域信息,根据该当前单元格位置区域信息生成input编辑框,并将该当前单元格的数据复制存放入input编辑框中;
S3,获取第一鼠标事件,从该第一鼠标事件中提取第一鼠标点值,并计算出对应的第一单元格位置区域信息,将input编辑框中存储的数据存入第一单元格中,并隐藏input编辑框。
在以上技术方案的基础上,优选的,步骤S1中,获取当前单元格的运行状态,并对当前单元格的运行状态进行检测,当检测到当前单元格的运行状态为编辑状态时,获取原始鼠标事件,还包括以下步骤,获取当前单元格的运行状态,所述运行状态包括:编辑状态以及待机状态,对当前单元格的运行状态进行检测,当检测到当前单元格的运行状态为编辑状态时,获取原始鼠标事件;当检测到当前单元格的运行状态为待机状态时,接收字符数据,并对该字符数据进行判断,根据判断结果将当前单元格的运行状态变更为编辑状态。
在以上技术方案的基础上,优选的,还包括以下步骤,当当前单元格的运行状态为编辑状态时,从后台字体数据库中提取字体文件对应的字节流,并对该字节流进行加载,获取该字节流对应的字体文件,通过该字体文件对单元格进行辅助编辑。
在以上技术方案的基础上,优选的,当检测到当前单元格的运行状态为待机状态时,接收字符数据,并对该字符数据进行判断,根据判断结果将当前单元格的运行状态变更为编辑状态,还包括以下步骤,当检测到当前单元格的运行状态为待机状态时,设定字符数据判断表,所述字符数据包括:字符A-Z、a-z、0-9以及标点符号,接收字符数据,通过字符数据判断表对该字符数据判断,当字符数据满足字符数据判断表时,将当前单元格的运行状态变更为编辑状态;当字符数据不满足字符数据判断表时,重新接受字符数据。
在以上技术方案的基础上,优选的,当字符数据满足字符数据判断表时,将当前单元格的运行状态变更为编辑状态之后,还包括以下步骤,获取当前选中框所在单元格位置信息,并根据该单元格位置信息生成input编辑框,所述单元格位置信息与input编辑框关联,复制该单元格对应的单元格数据,并存入input编辑框中,将接收的字符数据与input编辑框进行绑定。
在以上技术方案的基础上,优选的,步骤S2中,从该原始鼠标事件中提取鼠标点值,并通过该鼠标点值计算出当前单元格位置区域信息,根据该当前单元格位置区域信息生成input编辑框,并将该当前单元格的数据复制存放入input编辑框中,还包括以下步骤,从该原始鼠标事件中提取鼠标点值,所述鼠标点值包括:表格数据X值以及Y值,通过该鼠标点值计算出当前单元格位置区域信息,根据该当前单元格位置区域信息生成input编辑框,并将该单元格位置信息与input编辑框关联,将该当前单元格的数据复制存放入input编辑框中。
在以上技术方案的基础上,优选的,步骤S3中,获取第一鼠标事件,从该第一鼠标事件中提取第一鼠标点值,并计算出对应的第一单元格位置区域信息,将input编辑框中存储的数据存入第一单元格中,并隐藏input编辑框,还包括以下步骤,获取第一鼠标事件,从该第一鼠标事件中提取第一鼠标点值,并计算出对应的第一单元格位置区域信息,将input编辑框中存储的数据存入第一单元格位置区域信息对应的第一单元格中,当存储完成之后,隐藏该input编辑框。
更进一步优选的,所述网页数据表格在线设计装置包括:
获取判断模块,用于获取当前单元格的运行状态,并对当前单元格的运行状态进行检测,当检测到当前单元格的运行状态为编辑状态时,获取原始鼠标事件;
复制模块,用于从该原始鼠标事件中提取鼠标点值,并通过该鼠标点值计算出当前单元格位置区域信息,根据该当前单元格位置区域信息生成input编辑框,并将该当前单元格的数据复制存放入input编辑框中;
编辑模块,用于获取第一鼠标事件,从该第一鼠标事件中提取第一鼠标点值,并计算出对应的第一单元格位置区域信息,将input编辑框中存储的数据存入第一单元格中,并隐藏input编辑框。
第二方面,所述网页数据表格在线设计方法还包括一种终端设备,所述终端设备包括:存储器、处理器以及存储在所述存储器上并可在所述处理器上运行的网页数据表格在线设计方法程序,所述网页数据表格在线设计方法程序配置为实现如上文所述的网页数据表格在线设计方法的步骤。
第三方面,所述网页数据表格在线设计方法还包括一种存储介质,所述存储介质为计算机存储介质,所述计算机存储介质上存储有网页数据表格在线设计方法程序,所述网页数据表格在线设计方法程序被处理器执行时实现如上文所述的网页数据表格在线设计方法的步骤。
本发明的一种网页数据表格在线设计方法相对于现有技术具有以下有益效果:
(1)通过利用webassembly技术,能够在网页在线编辑表格,简化了操作,同时能够即时对表格数据进行上传保存,提高了数据安全性。
(2)通过利用input编辑框对表格进行编辑,能够实现对网页表格的快速编辑,提高系统运行速度,提升用户体验。
附图说明
为了更清楚地说明本发明实施例或现有技术中的技术方案,下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍,显而易见地,下面描述中的附图仅仅是本发明的一些实施例,对于本领域普通技术人员来讲,在不付出创造性劳动的前提下,还可以根据这些附图获得其他的附图。
图1是本发明实施例方案涉及的硬件运行环境的设备的结构示意图;
图2为本发明网页数据表格在线设计方法第一实施例的流程示意图;
图3为本发明网页数据表格在线设计方法的显示界面示意图;
图4为本发明网页数据表格在线设计方法第一实施例的功能模块示意图。
具体实施方式
下面将结合本发明实施方式,对本发明实施方式中的技术方案进行清楚、完整地描述,显然,所描述的实施方式仅仅是本发明一部分实施方式,而不是全部的实施方式。基于本发明中的实施方式,本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施方式,都属于本发明保护的范围。
如图1所示,该设备可以包括:处理器1001,例如中央处理器(Central ProcessingUnit,CPU),通信总线1002、用户接口1003,网络接口1004,存储器1005。其中,通信总线1002用于实现这些组件之间的连接通信。用户接口1003可以包括显示屏(Display)、输入单元比如键盘(Keyboard),可选用户接口1003还可以包括标准的有线接口、无线接口。网络接口1004可选的可以包括标准的有线接口、无线接口(如无线保真(WIreless-FIdelity,WI-FI)接口)。存储器1005可以是高速的随机存取存储器(Random Access Memory,RAM)存储器,也可以是稳定的非易失性存储器(Non-Volatile Memory,NVM),例如磁盘存储器。存储器1005可选的还可以是独立于前述处理器1001的存储装置。
本领域技术人员可以理解,图1中示出的结构并不构成对设备的限定,在实际应用中设备可以包括比图示更多或更少的部件,或者组合某些部件,或者不同的部件布置。
如图1所示,作为一种介质的存储器1005中可以包括操作系统、网络通信模块、用户接口模块以及网页数据表格在线设计方法程序。
在图1所示的设备中,网络接口1004主要用于建立设备与存储网页数据表格在线设计方法系统中所需的所有数据的服务器的通信连接;用户接口1003主要用于与用户进行数据交互;本发明网页数据表格在线设计方法设备中的处理器1001、存储器1005可以设置在网页数据表格在线设计方法设备中,所述网页数据表格在线设计方法设备通过处理器1001调用存储器1005中存储的网页数据表格在线设计方法程序,并执行本发明实施提供的网页数据表格在线设计方法。
结合图2,图2为本发明网页数据表格在线设计方法第一实施例的流程示意图。
本实施例中,所述网页数据表格在线设计方法包括以下步骤:
S10:获取当前单元格的运行状态,并对当前单元格的运行状态进行检测,当检测到当前单元格的运行状态为编辑状态时,获取原始鼠标事件。
应当理解的是,webassembly在网页上所表现的功能以显示为主,编辑并不是此标准的专长,因此要在单元格上进行编辑内容,需要借助于网页原生html元素编辑框(input),完成编辑功能,本实施例中将网页数据表格作为数据模板进行描述。
应当理解的是,WebAssembly有一个正式推荐标准,其正式推荐标准包括:
WebAssembly Core Specification定义了一个低级虚拟机,模拟运行该虚拟机的许多微处理器的功能。通过即时编译或解析,WebAssembly引擎使编写的代码可以以接近本地平台的速度运行.wasm资源类似于Java.class文件,它包含静态数据和对该静态数据进行操作的代码段。与Java不同,WebAssembly为其他编程语言(如C/C++和Rust)提供了一个高效的编译目标以便它们能够在网络上运行。
WebAssembly Web API定义了一个基于Promise的接口,用于请求和执行.wasm资源。.wasm资源的结构经过优化,允许在检索整个资源之前开始执行,这进一步增强了WebAssembly应用程序的响应能力。
WebAssembly JavaScript Interface提供了一个JavaScript接口,用于调用并将参数传递给WebAssembly函数。在Web浏览器中,WebAssembly与主机环境的交互都通过JavaScript进行管理,这意味着WebAssembly依托JavaScript高度精心设计的安全模型。
WebAssembly是为高效执行和紧凑表示而设计的运行在现代处理器(包括浏览器)中的一种快速、安全、可移植的低级代码格式。该技术使Web平台能够更有效地执行计算密集型算法,这使全新的用户体验类别变得切实可行。由于WebAssenbly是与平台无关的执行环境,因此它也可以用于任何其他计算机平台。
应当理解的是,本实施例中,系统会获取当前单元格的运行状态,并对当前单元格的运行状态进行检测,以此来判断当前单元格的运行状态是否为编辑状态,然后根据当前单元格的状态来进行后续步骤。
应当理解的是,目前webassembly标准是以虚拟环境运行在网页环境中的,默认还不支持中文,日常的数据分析模板的制作是离不开中文的,如何在使用webassembly时使用中文是必须要解决的问题。
所以,系统会在服务器上单独一个目录中存放所需要的字体文件,待webassembly及编辑模块js文件在前端加载完成后(即对当前单元表格状态是编辑状态时),将后台目录的字体文件以字节流形式发送到前端,webassembly在收到字体字节流后,将其加入到虚拟环境的字体全局环境中,此时webassembly就拥有了中文字体资源,显示中文时就不会再出现乱码了。如果需要使用多种字体,以此方式,多次从后台传送到前端予以加载即可。其它形式资源文件也可以使用此种方式来进行加载到前端。
应当理解的是,因为后端发送时就只会发送字体字节流,字节流的正确性由http协议自行判断,所以不需要对发送的字节流进行验证,这样不仅能够保证字体文件加载的安全性,同时提高了加载速度。
S20:从该原始鼠标事件中提取鼠标点值,并通过该鼠标点值计算出当前单元格位置区域信息,根据该当前单元格位置区域信息生成input编辑框,并将该当前单元格的数据复制存放入input编辑框中。
应当理解的是,编辑框有两种工作方式。第一种,当检测到当前单元格的运行状态为编辑状态时,Webassembly在网页中是以html原生元素画布(canvas)做为显示载体,在画布收到鼠标事件后,通过鼠标点x、y值计算得出点中的是哪个单元格并取得单元格位置区域信息,同时获取当前选中框所在单元格位置信息,并根据该单元格位置信息生成input编辑框,所述单元格位置信息与input编辑框关联,复制该单元格对应的单元格数据,并存入input编辑框中,将接收的字符数据与input编辑框进行绑定。
应当理解的是,第二种,即当检测到当前单元格的运行状态为待机状态时,是以键盘操作来编辑单元格。在整体单元格不在编辑状态时,按下键盘的可见字符时(A-Z、a-z、0-9及标点符号),触发当前选中框位置的单元格处于编辑状态。Html原生元素画布不具备接收键盘消息,此时,隐藏的编辑框就可以充当接收键盘消息的对象。
S30:获取第一鼠标事件,从该第一鼠标事件中提取第一鼠标点值,并计算出对应的第一单元格位置区域信息,将input编辑框中存储的数据存入第一单元格中,并隐藏input编辑框。
应当理解的是,对于第一种,后续编辑过程则是将编辑框显示在刚被鼠标点中单元格的区域上方,将单元格原有内容复制给编辑框,形成单元格正在被编辑的操作。当编辑完成后,鼠标再点击其它位置的单元格,将编辑框中的内容复制到当前单元格中,完成后将input隐藏。这种操作方式是以鼠标操作来编辑单元格。
应当理解的是,对于第二种,当接收到可见字符键盘消息时,将编辑框显示在当前选中框所在单元格位置上,复制单元格数据到编辑框上,并将刚接收到的可见字符追加到编辑框的内容之后,此时,达到以键盘消息触发单元格编辑的操作。
应当理解的是,在制作完成数据模板后,通过webassembly将模板中的内容,如行列对象数据、普通单元格数据、组合单元格数据、模板属性、页面设置等数据形成json格式,发送到后端进行保存。之后需要再次使用时,可由后台以字节流形式发送到前端,供webassembly打开后在原有数据基础上再次进行编辑或查看。通过这样的方式,大大提高了整个设计过程的速度。
应当理解的是,本实施例还包括显示模块,如图3所示:
本实施例技术方案,是以单元格为基本形式的在线设计器。显示首先需要以实现行列交叉形成单元格,行列以对象数组形式保存在内存中,每个行列对象中保存列宽、行高及行列其它信息;
单元格数据的显示。单元格数据的内存中的表现形式,是以行列位置坐标为索引,保存单元格内容的数组结构。每次界面刷新后,以先行后列的顺序查找,有哪些位置有单元格数据,并将其显示在指定位置;
组合单元格的显示。组合单元格顾名思义由相邻多个单元格形式的一个矩形区域,组合成一个大的单元格,组合后的单元格称为组合单元格。与普通单元格相似,以组合单元格左上角位置为索引,保存单元格内容的数组结构。每次界面刷新后,以先行后列的顺序查找,哪些位置有组合单元格数据,先对该区域进行背景填充,再将其数据内容显示在组合单元格的位置上;
选中框的显示。单元格中的内容可以显示了,为了给单元格的编辑做准备,需要明确是哪一个单元格是当前选中单元格。初始化时,默认选中单元格为所有单元格左上角的单元格,即位置是A1单元格。当鼠标单击其它单元格时,选中框的位置随即改变为鼠标点击位置的单元格。
应当理解的是,通过图3,本实施左侧为建立的各种表格模板,用户可以通过左侧自行选择模板或者建立模板,中间则是建立的网络表格,本实施例建立的是一个订单单明细表,里面包含一些订单基本信息,右侧则是对单元格的基本控制项,这样可以快速对单元格进行编辑控制,提高用户使用效率以及用户体验。
需要说明的是,以上仅为举例说明,并不对本申请的技术方案构成任何限定。
通过上述描述不难发现,本实施例通过获取当前单元格的运行状态,并对当前单元格的运行状态进行检测,当检测到当前单元格的运行状态为编辑状态时,获取原始鼠标事件;从该原始鼠标事件中提取鼠标点值,并通过该鼠标点值计算出当前单元格位置区域信息,根据该当前单元格位置区域信息生成input编辑框,并将该当前单元格的数据复制存放入input编辑框中;获取第一鼠标事件,从该第一鼠标事件中提取第一鼠标点值,并计算出对应的第一单元格位置区域信息,将input编辑框中存储的数据存入第一单元格中,并隐藏input编辑框。本实施例通过利用webassembly技术,能够实现网页数据表格的在线编辑,操作简单方便,提升了用户体验,同时提高了表格编辑速度。
此外,本发明实施例还提出一种网页数据表格在线设计装置。如图4所示,该网页数据表格在线设计装置包括:获取判断模块10、复制模块20、数据编辑模块30。
获取判断模块10,用于获取当前单元格的运行状态,并对当前单元格的运行状态进行检测,当检测到当前单元格的运行状态为编辑状态时,获取原始鼠标事件;
复制模块20,用于从该原始鼠标事件中提取鼠标点值,并通过该鼠标点值计算出当前单元格位置区域信息,根据该当前单元格位置区域信息生成input编辑框,并将该当前单元格的数据复制存放入input编辑框中;
编辑模块30,用于获取第一鼠标事件,从该第一鼠标事件中提取第一鼠标点值,并计算出对应的第一单元格位置区域信息,将input编辑框中存储的数据存入第一单元格中,并隐藏input编辑框。
此外,需要说明的是,以上所描述的装置实施例仅仅是示意性的,并不对本发明的保护范围构成限定,在实际应用中,本领域的技术人员可以根据实际的需要选择其中的部分或者全部模块来实现本实施例方案的目的,此处不做限制。
另外,未在本实施例中详尽描述的技术细节,可参见本发明任意实施例所提供的网页数据表格在线设计方法,此处不再赘述。
此外,本发明实施例还提出一种存储介质,所述存储介质为计算机存储介质,所述计算机存储介质上存储有网页数据表格在线设计方法程序,所述网页数据表格在线设计方法程序被处理器执行时实现如下操作:
S1,获取当前单元格的运行状态,并对当前单元格的运行状态进行检测,当检测到当前单元格的运行状态为编辑状态时,获取原始鼠标事件;
S2,从该原始鼠标事件中提取鼠标点值,并通过该鼠标点值计算出当前单元格位置区域信息,根据该当前单元格位置区域信息生成input编辑框,并将该当前单元格的数据复制存放入input编辑框中;
S3,获取第一鼠标事件,从该第一鼠标事件中提取第一鼠标点值,并计算出对应的第一单元格位置区域信息,将input编辑框中存储的数据存入第一单元格中,并隐藏input编辑框。
进一步地,所述网页数据表格在线设计方法程序被处理器执行时还实现如下操作:
获取当前单元格的运行状态,所述运行状态包括:编辑状态以及待机状态,对当前单元格的运行状态进行检测,当检测到当前单元格的运行状态为编辑状态时,获取原始鼠标事件;当检测到当前单元格的运行状态为待机状态时,接收字符数据,并对该字符数据进行判断,根据判断结果将当前单元格的运行状态变更为编辑状态。
进一步地,所述网页数据表格在线设计方法程序被处理器执行时还实现如下操作:
当当前单元格的运行状态为编辑状态时,从后台字体数据库中提取字体文件对应的字节流,并对该字节流进行加载,获取该字节流对应的字体文件,通过该字体文件对单元格进行辅助编辑。
进一步地,所述网页数据表格在线设计方法程序被处理器执行时还实现如下操作:
当检测到当前单元格的运行状态为待机状态时,设定字符数据判断表,所述字符数据包括:字符A-Z、a-z、0-9以及标点符号,接收字符数据,通过字符数据判断表对该字符数据判断,当字符数据满足字符数据判断表时,将当前单元格的运行状态变更为编辑状态;当字符数据不满足字符数据判断表时,重新接受字符数据。
进一步地,所述网页数据表格在线设计方法程序被处理器执行时还实现如下操作:
获取当前选中框所在单元格位置信息,并根据该单元格位置信息生成input编辑框,所述单元格位置信息与input编辑框关联,复制该单元格对应的单元格数据,并存入input编辑框中,将接收的字符数据与input编辑框进行绑定。
进一步地,所述网页数据表格在线设计方法程序被处理器执行时还实现如下操作:
从该原始鼠标事件中提取鼠标点值,所述鼠标点值包括:表格数据X值以及Y值,通过该鼠标点值计算出当前单元格位置区域信息,根据该当前单元格位置区域信息生成input编辑框,并将该单元格位置信息与input编辑框关联,将该当前单元格的数据复制存放入input编辑框中。
进一步地,所述网页数据表格在线设计方法程序被处理器执行时还实现如下操作:
获取第一鼠标事件,从该第一鼠标事件中提取第一鼠标点值,并计算出对应的第一单元格位置区域信息,将input编辑框中存储的数据存入第一单元格位置区域信息对应的第一单元格中,当存储完成之后,隐藏该input编辑框。
以上所述仅为本发明的较佳实施方式而已,并不用以限制本发明,凡在本发明的精神和原则之内,所作的任何修改、等同替换、改进等,均应包含在本发明的保护范围之内。
Claims (5)
1.一种网页数据表格在线设计方法,其特征在于:包括以下步骤;
S1,获取当前单元格的运行状态,所述运行状态包括:编辑状态以及待机状态,对当前单元格的运行状态进行检测,当检测到当前单元格的运行状态为编辑状态时,获取原始鼠标事件;当检测到当前单元格的运行状态为待机状态时,接收字符数据,并对该字符数据进行判断,根据判断结果将当前单元格的运行状态变更为编辑状态;当当前单元格的运行状态为编辑状态时,从后台字体数据库中提取字体文件对应的字节流,并对该字节流进行加载,获取该字节流对应的字体文件,通过该字体文件对单元格进行辅助编辑,其中,字节流的正确性由http协议自行判断;
S2,从该原始鼠标事件中提取鼠标点值,并通过该鼠标点值计算出当前单元格位置区域信息,根据该当前单元格位置区域信息生成input编辑框,并将该当前单元格的数据复制存放入input编辑框中;其中,input编辑框有两种工作方式:第一种,当检测到当前单元格的运行状态为编辑状态时,Webassembly在网页中是以html原生元素画布作为显示载体,在画布收到鼠标事件后,通过鼠标点x、y值计算得出点中的是哪个单元格并取得单元格位置区域信息,同时获取当前选中框所在单元格位置信息,并根据该单元格位置信息生成input编辑框,所述单元格位置信息与input编辑框关联,复制该单元格对应的单元格数据,并存入input编辑框中,将接收的字符数据与input编辑框进行绑定;第二种,即当检测到当前单元格的运行状态为待机状态时,以键盘操作来编辑单元格,在整体单元格不在编辑状态时,按下键盘的可见字符A-Z、a-z、0-9及标点符号时,触发当前选中框位置的单元格处于编辑状态,由隐藏的编辑框充当接收键盘消息的对象;
S3,获取第一鼠标事件,从该第一鼠标事件中提取第一鼠标点值,并计算出对应的第一单元格位置区域信息,将input编辑框中存储的数据存入第一单元格中,并隐藏input编辑框;在制作完成网页数据表格后,通过webassembly将网页数据表格中的内容形成json格式,发送到后台进行保存;需要再次使用时,由后台以字节流形式发送到前端,供webassembly打开后在原有数据基础上再次进行编辑或查看。
2.如权利要求1所述的网页数据表格在线设计方法,其特征在于:当检测到当前单元格的运行状态为待机状态时,接收字符数据,并对该字符数据进行判断,根据判断结果将当前单元格的运行状态变更为编辑状态,还包括以下步骤,当检测到当前单元格的运行状态为待机状态时,设定字符数据判断表,所述字符数据包括:字符A-Z、a-z、0-9以及标点符号,接收字符数据,通过字符数据判断表对该字符数据判断,当字符数据满足字符数据判断表时,将当前单元格的运行状态变更为编辑状态;当字符数据不满足字符数据判断表时,重新接受字符数据。
3.一种网页数据表格在线设计装置,其特征在于,所述网页数据表格在线设计装置包括:
获取判断模块,用于获取当前单元格的运行状态,所述运行状态包括:编辑状态以及待机状态,对当前单元格的运行状态进行检测,当检测到当前单元格的运行状态为编辑状态时,获取原始鼠标事件;当检测到当前单元格的运行状态为待机状态时,接收字符数据,并对该字符数据进行判断,根据判断结果将当前单元格的运行状态变更为编辑状态;当当前单元格的运行状态为编辑状态时,从后台字体数据库中提取字体文件对应的字节流,并对该字节流进行加载,获取该字节流对应的字体文件,通过该字体文件对单元格进行辅助编辑,其中,字节流的正确性由http协议自行判断;
复制模块,用于从该原始鼠标事件中提取鼠标点值,并通过该鼠标点值计算出当前单元格位置区域信息,根据该当前单元格位置区域信息生成input编辑框,并将该当前单元格的数据复制存放入input编辑框中;其中,input编辑框有两种工作方式:第一种,当检测到当前单元格的运行状态为编辑状态时,Webassembly在网页中是以html原生元素画布作为显示载体,在画布收到鼠标事件后,通过鼠标点x、y值计算得出点中的是哪个单元格并取得单元格位置区域信息,同时获取当前选中框所在单元格位置信息,并根据该单元格位置信息生成input编辑框,所述单元格位置信息与input编辑框关联,复制该单元格对应的单元格数据,并存入input编辑框中,将接收的字符数据与input编辑框进行绑定;第二种,即当检测到当前单元格的运行状态为待机状态时,以键盘操作来编辑单元格;在整体单元格不在编辑状态时,按下键盘的可见字符A-Z、a-z、0-9及标点符号时,触发当前选中框位置的单元格处于编辑状态,由隐藏的编辑框充当接收键盘消息的对象;
编辑模块,用于获取第一鼠标事件,从该第一鼠标事件中提取第一鼠标点值,并计算出对应的第一单元格位置区域信息,将input编辑框中存储的数据存入第一单元格中,并隐藏input编辑框;在制作完成网页数据表格后,通过webassembly将网页数据表格中的内容形成json格式,发送到后台进行保存;需要再次使用时,由后台以字节流形式发送到前端,供webassembly打开后在原有数据基础上再次进行编辑或查看。
4.一种终端设备,其特征在于,所述终端设备包括:存储器、处理器以及存储在所述存储器上并可在所述处理器上运行的网页数据表格在线设计方法程序,所述网页数据表格在线设计方法程序配置为实现如权利要求1至2任一项所述的网页数据表格在线设计方法的步骤。
5.一种存储介质,其特征在于,所述存储介质为计算机存储介质,所述计算机存储介质上存储有网页数据表格在线设计方法程序,所述网页数据表格在线设计方法程序被处理器执行时实现如权利要求1至2任一项所述的网页数据表格在线设计方法的步骤。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202010870603.2A CN112001157B (zh) | 2020-08-26 | 2020-08-26 | 一种网页数据表格在线设计方法及装置 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202010870603.2A CN112001157B (zh) | 2020-08-26 | 2020-08-26 | 一种网页数据表格在线设计方法及装置 |
Publications (2)
Publication Number | Publication Date |
---|---|
CN112001157A CN112001157A (zh) | 2020-11-27 |
CN112001157B true CN112001157B (zh) | 2021-07-27 |
Family
ID=73470411
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN202010870603.2A Active CN112001157B (zh) | 2020-08-26 | 2020-08-26 | 一种网页数据表格在线设计方法及装置 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN112001157B (zh) |
Families Citing this family (1)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN112882703B (zh) * | 2021-02-07 | 2022-11-11 | 湖北盈帆数据技术有限公司 | 一种自定义图表插件在线设计方法及装置 |
Citations (9)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN101149737A (zh) * | 2007-05-10 | 2008-03-26 | 廖义洪 | 通过Microsoft Word快速建立web表单及自动在数据库中建立对应数据表的方法 |
CN101611399A (zh) * | 2007-02-16 | 2009-12-23 | 罗凡 | 网页、网站建模和生成 |
CN103631877A (zh) * | 2013-11-08 | 2014-03-12 | 四川长虹电器股份有限公司 | 网页表格的处理方法 |
CN103729340A (zh) * | 2013-12-29 | 2014-04-16 | 上海浦东物流云计算有限公司 | 网页中编辑表格的方法和装置 |
CN106528271A (zh) * | 2015-09-11 | 2017-03-22 | 北京国双科技有限公司 | 网页数据获取的方法及装置 |
CN106610774A (zh) * | 2015-10-23 | 2017-05-03 | 北京国双科技有限公司 | 网页表格编辑方法及装置 |
CN106610923A (zh) * | 2015-10-26 | 2017-05-03 | 北京国双科技有限公司 | 用于网页表格的单元格的撤销方法及装置 |
CN110826305A (zh) * | 2019-10-14 | 2020-02-21 | 北京字节跳动网络技术有限公司 | 在线表格的数据处理方法、装置、终端及服务器 |
CN111476017A (zh) * | 2020-06-04 | 2020-07-31 | 广东三维家信息科技有限公司 | 网页表格编辑方法、装置及电子设备 |
Family Cites Families (2)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN102497436B (zh) * | 2011-12-16 | 2015-03-18 | 方正国际软件有限公司 | 一种基于http协议的网络文件存储方法及系统 |
CN104090850B (zh) * | 2014-06-24 | 2017-07-14 | 上海铀尼信息科技有限公司 | 在线表格系统及其数据管理方法 |
-
2020
- 2020-08-26 CN CN202010870603.2A patent/CN112001157B/zh active Active
Patent Citations (9)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN101611399A (zh) * | 2007-02-16 | 2009-12-23 | 罗凡 | 网页、网站建模和生成 |
CN101149737A (zh) * | 2007-05-10 | 2008-03-26 | 廖义洪 | 通过Microsoft Word快速建立web表单及自动在数据库中建立对应数据表的方法 |
CN103631877A (zh) * | 2013-11-08 | 2014-03-12 | 四川长虹电器股份有限公司 | 网页表格的处理方法 |
CN103729340A (zh) * | 2013-12-29 | 2014-04-16 | 上海浦东物流云计算有限公司 | 网页中编辑表格的方法和装置 |
CN106528271A (zh) * | 2015-09-11 | 2017-03-22 | 北京国双科技有限公司 | 网页数据获取的方法及装置 |
CN106610774A (zh) * | 2015-10-23 | 2017-05-03 | 北京国双科技有限公司 | 网页表格编辑方法及装置 |
CN106610923A (zh) * | 2015-10-26 | 2017-05-03 | 北京国双科技有限公司 | 用于网页表格的单元格的撤销方法及装置 |
CN110826305A (zh) * | 2019-10-14 | 2020-02-21 | 北京字节跳动网络技术有限公司 | 在线表格的数据处理方法、装置、终端及服务器 |
CN111476017A (zh) * | 2020-06-04 | 2020-07-31 | 广东三维家信息科技有限公司 | 网页表格编辑方法、装置及电子设备 |
Non-Patent Citations (1)
Title |
---|
在Qt5.12上使用webassembly构建web报表工具(efreport.com);efreport;《360快照》;20200519;第1-7页 * |
Also Published As
Publication number | Publication date |
---|---|
CN112001157A (zh) | 2020-11-27 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
CN108304498B (zh) | 网页数据采集方法、装置、计算机设备和存储介质 | |
CN109375914B (zh) | 信息远程交互方法和系统 | |
US20160232140A1 (en) | Systems and methods for remote dashboard image generation | |
CN111930370A (zh) | 可视化页面处理方法、装置、计算机设备和存储介质 | |
CN112882703B (zh) | 一种自定义图表插件在线设计方法及装置 | |
US8209598B1 (en) | Exporting electronic documents from rich internet applications | |
CN100444163C (zh) | 一种网页显示页面的配置方法 | |
WO2016054549A1 (en) | Application prototyping tool | |
CN111428177A (zh) | 用于web内容生成的方法和系统 | |
US9934206B2 (en) | Method and apparatus for extracting web page content | |
CN108595697B (zh) | 网页集成方法、装置及系统 | |
US20220383381A1 (en) | Video generation method, apparatus, terminal and storage medium | |
US20230229406A1 (en) | Page rendering method, apparatus, electronic device, computer-readable storage medium, and computer program product | |
CN103942202B (zh) | 网页文本域高度自适应缩放方法及装置 | |
US10417317B2 (en) | Web page profiler | |
CN110333853A (zh) | 活动卡片的应用方法、装置、设备及可读存储介质 | |
US10248392B2 (en) | Replicating a web technology | |
CN112068873B (zh) | 网页生成方法、装置、服务器及存储介质 | |
CN112001157B (zh) | 一种网页数据表格在线设计方法及装置 | |
CN114297700A (zh) | 动静态结合的移动应用隐私协议提取方法及相关设备 | |
Billah et al. | Sinter: Low-bandwidth remote access for the visually-impaired | |
CN113836092A (zh) | 基于rpa和ai的文件比对方法、装置、设备及存储介质 | |
CN113448569A (zh) | 一种站点页面的处理系统、方法、设备和存储介质 | |
CN117093386A (zh) | 页面截图方法、装置、计算机设备和存储介质 | |
CN111736831A (zh) | 一种基于移动端html页面的自定义菜单组件开发方法 |
Legal Events
Date | Code | Title | Description |
---|---|---|---|
PB01 | Publication | ||
PB01 | Publication | ||
SE01 | Entry into force of request for substantive examination | ||
SE01 | Entry into force of request for substantive examination | ||
GR01 | Patent grant | ||
GR01 | Patent grant |