表头斜线的配置式绘制方法、装置、电子设备及存储介质制造方法及图纸

技术编号:36048260 阅读:8 留言:0更新日期:2022-12-21 10:57
本发明专利技术的提供一种表头斜线的配置式绘制方法、装置、电子设备及存储介质,包括:对待处理表格进行起点配置和终点配置,获得点对集合;对待处理表格进行数据渲染,并确定渲染后的待处理表格中,表头单元格的高度信息和宽度信息、以及点对内起点和终点之间的线段所占的目标单元格的宽度和高度;针对该点对,基于起点和终点之间的线段所占的目标单元格的宽度和高度、以及起点和终点各自的位置标识,计算线段的长度和角度;根据每个点对对应的线段的长度和角度,生成斜线,并将斜线定位到表头单元格中,本发明专利技术可以保证动态表格在不同数据下都可以正常兼容斜线配置,不用再来回修改单元格的样式,减少了一些人工成本方面的消耗。减少了一些人工成本方面的消耗。减少了一些人工成本方面的消耗。

【技术实现步骤摘要】
表头斜线的配置式绘制方法、装置、电子设备及存储介质


[0001]本专利技术涉及web前端
,具体而言,涉及一种表头斜线的配置式绘制方法、装置、电子设备及存储介质。

技术介绍

[0002]在日常工作中,需要做大量的表格,这些表格中,有许多表格都需要用斜线表头来表达表格的内容,不论是在静态表格中,还是在动态表格中,设置表头斜线均是一件非常常见的操作。
[0003]传统的表头斜线绘制方法大部分只适用于静态表格,即已知表头单元格的表格内容以及宽高,静态设置单元格的斜线,这种实现方式中,每一条斜线都需要单独计算,代码可复用性差。当单元格的内容和宽度稍微有点变化时,必须重新去修改斜线,否则将会出现斜线位置和角度错乱的问题。

技术实现思路

[0004]本专利技术的目的之一在于提供一种表头斜线的配置式绘制方法、装置、电子设备及存储介质,用以可以保证动态表格在不同数据下都可以正常兼容斜线配置,不用再来回修改单元格的样式,减少了一些人工成本方面的消耗。
[0005]第一方面,本专利技术提供一种表头斜线的配置式绘制方法,所述方法包括:对待处理表格进行起点配置和终点配置,获得点对集合;其中,所述待处理表格为空表格,所述点对集合中包含至少一个点对,所述点对内包含一个起点的位置标识和一个终点的位置标识;对待处理表格进行数据渲染,并确定渲染后的所述待处理表格中,表头单元格的高度信息和宽度信息、以及所述点对内所述起点和所述终点之间的线段所占的目标单元格的宽度和高度;针对所述点对,基于所述起点和所述终点之间的线段所占的目标单元格的宽度和高度、以及所述起点和终点各自的位置标识,计算所述线段的长度和角度;根据所述线段的所述长度和所述角度,生成斜线,并将所述斜线定位到所述表头单元格中。
[0006]第二方面,本专利技术提供一种表头斜线的配置式绘制装置,包括:配置模块,用于对待处理表格进行起点配置和终点配置,获得点对集合;其中,所述待处理表格为空表格,所述点对集合中包含至少一个点对,所述点对内包含一个起点的位置标识和一个终点的位置标识;确定模块,用于对待处理表格进行数据渲染,并确定渲染后的所述待处理表格中,表头单元格的高度信息和宽度信息、以及所述点对内所述起点和所述终点之间的线段所占的目标单元格的宽度和高度;所述确定模块,还用于针对所述点对,基于所述起点和所述终点之间的线段所占
的目标单元格的宽度和高度、以及所述起点和终点各自的位置标识,计算所述线段的长度和角度;绘制模块,用于根据所述线段的所述长度和所述角度,生成斜线,并将所述斜线定位到所述表头单元格中。
[0007]第三方面,本专利技术提供一种电子设备,包括处理器和存储器,所述存储器存储有能够被所述处理器执行的计算机程序,所述处理器可执行所述计算机程序以实现第一方面所述的方法。
[0008]第四方面,本专利技术提供一种存储介质,其上存储有计算机程序,所述计算机程序被处理器执行时实现第一方面所述的方法。
[0009]本专利技术的提供一种表头斜线的配置式绘制方法、装置、电子设备及存储介质,包括:首先对空的待处理表格进行起点配置和终点配置,得到至少一个点对,并确定该点对内的起点和终点之间的线段所占的目标单元格,然后对待处理表格进行数据渲染后确定待处理表格的表头单元格的宽度信息和高度信息,最终可以集合高度信息、宽度信息以及点对内的起点和终点各自的位置标识、点对内起点和终点之间的线段所占的目标单元格,确定该点对内起点和终点之间的线段的长度和角度,最终基于得到的线段长度和角度进行斜线绘制,本专利技术先配置斜线的起点和终点,然后基于动态获取的表头单元格的宽度,精准的计算斜线的长度和角度后进行斜线绘制,整个过程不再受单元格宽高限制,可以保证动态表格在不同数据下都可以正常兼容斜线配置,不用再来回修改单元格的样式,减少了一些人工成本方面的消耗。
附图说明
[0010]为了更清楚地说明本专利技术实施例的技术方案,下面将对实施例中所需要使用的附图作简单地介绍,应当理解,以下附图仅示出了本专利技术的某些实施例,因此不应被看作是对范围的限定,对于本领域普通技术人员来讲,在不付出创造性劳动的前提下,还可以根据这些附图获得其他相关的附图。
[0011]图1为本专利技术实施例提供的电子设备的结构框图;图2为本专利技术实施例提供的表头斜线的配置式绘制方法的示意性流程图;图3为本专利技术实施例提供的一种待处理表格的示意图;图4为本专利技术实施例提供的步骤S201的示意性流程图;图5为本专利技术实施例提供的不同待处理单元格的示意图;图6为本专利技术实施例提供的步骤S202的示意性流程图;图7为本专利技术实施例提供的步骤S203的示意性流程图;图8为本专利技术实施例提供的直角三角形的示意图;图9为本专利技术实施例提供的效果示意图;图10为本专利技术实施例提供的表头斜线的配置式绘制装置的功能模块图。
具体实施方式
[0012]为使本专利技术实施例的目的、技术方案和优点更加清楚,下面将结合本专利技术实施例中的附图,对本专利技术实施例中的技术方案进行清楚、完整地描述,显然,所描述的实施例是
本专利技术一部分实施例,而不是全部的实施例。通常在此处附图中描述和示出的本专利技术实施例的组件可以以各种不同的配置来布置和设计。
[0013]因此,以下对在附图中提供的本专利技术的实施例的详细描述并非旨在限制要求保护的本专利技术的范围,而是仅仅表示本专利技术的选定实施例。基于本专利技术中的实施例,本领域普通技术人员在没有作出创造性劳动前提下所获得的所有其他实施例,都属于本专利技术保护的范围。
[0014]应注意到:相似的标号和字母在下面的附图中表示类似项,因此,一旦某一项在一个附图中被定义,则在随后的附图中不需要对其进行进一步定义和解释。
[0015]在本专利技术的描述中,需要说明的是,若出现术语“上”、“下”、“内”、“外”等指示的方位或位置关系为基于附图所示的方位或位置关系,或者是该专利技术产品使用时惯常摆放的方位或位置关系,仅是为了便于描述本专利技术和简化描述,而不是指示或暗示所指的装置或元件必须具有特定的方位、以特定的方位构造和操作,因此不能理解为对本专利技术的限制。
[0016]此外,若出现术语“第一”、“第二”等仅用于区分描述,而不能理解为指示或暗示相对重要性。
[0017]需要说明的是,在不冲突的情况下,本专利技术的实施例中的特征可以相互结合。
[0018]在日常工作中,需要做大量的表格,这些表格中,有许多表格都需要用斜线表头来表达表格的内容,不论是在静态表格中,还是在动态表格中,设表头斜线均是一件非常常见的操作。
[0019]实现表头单元格斜线绘制的方法有如下常见的几种:(1)可以设置单元格的背景图片,在背景图片中预设好需要设置的斜线,然后将背景图片叠加到单元格上面,从而实现单元格的斜线绘制;(2)在单元格中添加一个块级标签,设置标签相邻的两个边框线的样式,使其左边框线的宽度和单元格的宽度相等、上边框线的宽度和单元格的高度相等,以此拼接处两个斜线区域。
[0020](3)通过css3的画布标签canvas,在画布上绘制所要的斜线。<本文档来自技高网
...

【技术保护点】

【技术特征摘要】
1.一种表头斜线的配置式绘制方法,其特征在于,所述方法包括:对待处理表格进行起点配置和终点配置,获得点对集合;其中,所述待处理表格为空表格,所述点对集合中包含至少一个点对,所述点对内包含一个起点的位置标识和一个终点的位置标识;对待处理表格进行数据渲染,并确定渲染后的所述待处理表格中,表头单元格的高度信息和宽度信息、以及所述点对内所述起点和所述终点之间的线段所占的目标单元格的宽度和高度;针对所述点对,基于所述起点和所述终点之间的线段所占的目标单元格的宽度和高度、以及所述起点和所述终点各自的所述位置标识,计算所述线段的长度和角度;根据所述线段的所述长度和所述角度,生成斜线,并将所述斜线定位到所述表头单元格中。2.根据权利要求1所述的方法,其特征在于,对待处理表格进行起点配置和终点配置,获得点对集合,所述方法还包括:以所述表头单元格的左上角为坐标原点,以上边框线为横坐标轴、左边框线为纵坐标轴,构建坐标系;当所述表头单元格为单个单元格,将所述坐标原点作为所述起点,并从所述表头单元格的右边框线和下边框线各自的中点、以及所述右边框线分别与所述上边框线和所述下边框线的交点中,确定至少一个所述终点;当所述表头单元格由至少两个单元格合并而成,从所述坐标原点、所述上边框线和所述左边框线上各自的单元格交叉点中,确定至少一个所述起点、并从所述右边框线和所述下边框线各自的中点、所述右边框线分别与所述上边框线和所述下边框线的交点、所述右边框线和所述下边框线上各自的单元格交叉点中,确定至少一个所述终点;确定每个所述起点和每个所述终点在所述坐标系中的位置标识,并将所述起点和终点进行两两组合,得到至少一个所述点对,并基于所述点对组成所述点对集合。3.根据权利要求1所述的方法,其特征在于,对待处理表格进行数据渲染,并确定渲染后的所述待处理表格中,表头单元格的高度信息和宽度信息、以及所述点对内所述起点和所述终点之间的线段所占的目标单元格的宽度和高度,包括:确定所述表头单元格对应的宽度集合和高度集合;当所述表头单元格为单个单元格,确定所述目标单元格为所述表头单元格,所述目标单元格的宽度和高度分别为所述表头单元格的宽度和高度;当所述表头单元格由至少两个单元格合并而成,确定所述点对内,所述线段所占的横向单元格和竖向单元格为所述目标单元格、并从所述宽度集合提取所述横向单元格的宽度,以及从所述高度集合中提取所述竖向单元格的高度。4.根据权利要求3所述的方法,其特征在于,当所述表头单元格由至少两个单元格合并而成,确定所述点对内,所述线段所占的横向单元格和竖向单元格为所述目标单元格、并从所述宽度集合提取所述横向单元格的宽度,以及从所述高度集合中提取所述竖向单元格的高度,包括:针对所述点对,基于所述起点和所述终点各自的所述位置标识,确定所述起点和所述终点间隔的第一单元格数量和第二单元格数量;
从所述起点所在位置开始,沿远离左边框线的水平方...

【专利技术属性】
技术研发人员:王进王小通张培贺张小林朱田静
申请(专利权)人:宇动源北京信息技术有限公司
类型:发明
国别省市:

网友询问留言 已有0条评论
  • 还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。

1