CN109885363A - 一种商业智能仪表盘的组件布局方法 - Google Patents
一种商业智能仪表盘的组件布局方法 Download PDFInfo
- Publication number
- CN109885363A CN109885363A CN201811615123.0A CN201811615123A CN109885363A CN 109885363 A CN109885363 A CN 109885363A CN 201811615123 A CN201811615123 A CN 201811615123A CN 109885363 A CN109885363 A CN 109885363A
- Authority
- CN
- China
- Prior art keywords
- component
- instrument board
- deleted
- adjacent
- client
- 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.)
- Granted
Links
Abstract
本发明涉及一种商业智能仪表盘的组件布局方法,包括组件插入,组件删除、组件移动、组件缩放和组件校验的方法。通过使用仪表盘旋转的方式,将不同方向的操作全部规约到一个方向进行处理,处理完后再将仪表盘旋转回初始方向,使得四个方向的处理能够简化为一个方向,简化了四分之三的逻辑。另外通过整体面积校验的方式降低校验合法性的计算复杂度。本发明涉及的组件布局方法,解决了现有技术中繁琐复杂的终端处理问题,同时实现方便快捷地调整仪表盘布局。
Description
技术领域
本发明涉及商业智能技术领域,尤其涉及一种商业智能仪表盘的组件布局方法,包括组件插入的方法,组件删除方法、组件移动、组件缩放和校验方法。
背景技术
仪表盘(business intelligence dashboard,BI dashboard)是一般商业智能都拥有的实现数据可视化的模块,它是向企业展示度量信息和关键业务指标现状的工具,是商业智能最终展现给用户的结果物。
如何快速高效的创建一个仪表盘对于任何一个商业智能系统都至关重要。根据我们的调查,在制作仪表盘的过程中,业务人员主要将时间花在了两大部分:第一,仪表盘的业务定义;第二,仪表盘的布局美化。在仪表盘的美化的过程中仪表盘中各个组件的布局是最频繁的操作之一,需要对齐,均分,移动等,如果都是每个像素的去对齐和手工移动会非常的耗时费心,虽然会有对齐线等技术支持,但是还是不能够快速和方便。为了解决上述问题,需要一种仪表盘快速布局的方法,实现方便、快捷的调整仪表盘方法。
发明内容
鉴于上述的分析,本发明旨在提供一种商业智能仪表盘的组件布局方法,包括组件插入的方法,组件删除方法、组件移动、组件缩放和校验方法,用以解决现有组件布局过程中操作繁琐、后台代码复杂,运算速度慢的问题。
本发明的目的主要是通过以下技术方案实现的:
提供一种商业智能仪表盘中的组件插入方法,包括以下步骤:
步骤S1.客户端获取组件插入事件;
步骤S2,根据上述组件插入事件,获取组件的插入方向和插入位置,进一步判定是否进行仪表盘及其组件的旋转,将上、或下、或左、或右四个方向的插入通过仪表盘及其组件的旋转规约到一个方向再进行插入处理;
步骤S3,根据组件插入事件中的插入位置,执行插入处理;
步骤S4,在执行完上述插入操作后,将仪表盘及其组件反向旋转与步骤S2中旋转角度相同的度数,以将仪表盘及其组件转换到原来角度,再由客户端展现插入结果。
其中,所述步骤S3中的插入处理为:
根据待插入组件的宽度判断该组件是否是整行插入;
如果是整行插入,执行步骤S31;如果不是整行插入,则执行步骤S32;
步骤S31:新增插入组件的宽度与仪表盘的宽度相同、高度为默认高度;新插入组件下方的其他组件,则下移相应的高度;
步骤S32:根据待插入组件的高度,判断是该组件是实现单列插入、还是多列插入;在单列插入的情境下,新插入组件与其影响的原有组件将均分原有组件占据的面积;在多列插入的情景下,新插入组件与其影响的多排组件将按列共同均分原来多排组件占据的面积。
本发明还提供一种商业智能仪表盘中的组件删除方法,包括步骤:
步骤S1.客户端获取组件删除事件;
步骤S2.根据上述组件删除事件,获取被删除组件相邻的右侧所有组件,在没有相邻右侧组件的情景下,通过仪表盘及其组件旋转的方式,获取相邻的右侧所有组件;
步骤S3.在获取相邻的右侧所有组件后,将右侧所有组件向左侧延伸,填充删除组件的区域;
步骤S4.填充完成,将仪表盘及其组件反向旋转与上述步骤S2中相同的角度后,由客户端展现删除结果。
其中,在所述步骤S2之前还可以包括将整行删除的情形单独处理的步骤:客户端根据待删除组件的宽度判断是否是整行删除,在整行删除的情况下,删除目标组件并采用上移的方式填充区域,删除执行完毕;在不是整行删除的情况下,执行步骤S2。
进一步的,在所述步骤S3中,在获取相邻的右侧所有组件后,进一步判断被删除组件是否具有相邻的左侧组件,在同时具有相邻左侧组件时,相邻左侧和右侧组件均进行延伸,填充删除组件的区域。
本发明还提供一种商业智能仪表盘中的组件移动方法,具体将组件的移动分割为组件删除和组件插入两个步骤进行,所述组件删除采用上述组件删除方法;所述组件插入采用上述组件插入方法。
本发明还提供一种商业智能仪表盘中的组件缩放方法,将组件各边界的缩放通过仪表盘及其组件的旋转规约到一个方向上的移动,其他相邻组件进行填充,缩放完成后,再将仪表盘及其组件反向旋转到原来的角度,呈现缩放结果。
进一步的,在将组件进行插入、删除、移动、或缩放操作时,客户端呈现相应的展现预览提示,供用户参考。
进一步的,在上述组件插入、删除、移动、或缩放方法之后,还包括仪表盘校验的步骤:通过计算所有组件的面积之和是否等于仪表盘上当前有效面积来校验计算结果。
进一步的,在考虑组件间隙的情况下,将组件和缝隙按照比例缩放,之后将缝隙再根据需求拓宽或者收缩的方式来实现。
本发明有益效果如下:通过将仪表盘旋转的方式,将不同方向的移动操作全部规约到对一个方向进行处理,处理完后再将仪表盘旋转回初始方向,这种方式使得四个方向的处理能够简化为一个方向的处理,仅需要在处理前进行仪表盘及其组件的旋转,这种方式能够共用具体处理布局的代码、共用旋转和反旋转的代码,进而简化了问题的处理和代码量,方便维护和调整,客户端计算也更简便,同时通过整体面积校验的方式进一步降低计算复杂度。本发明涉及的组件布局方法解决了现有技术中繁琐的操作、复杂的终端处理的问题,同时实现方便、快捷的调整仪表盘布局。
本发明的其他特征和优点将在随后的说明书中阐述,并且,部分的从说明书中变得显而易见,或者通过实施本发明而了解。本发明的目的和其他优点可通过在所写的说明书、权利要求书、以及附图中所特别指出的结构来实现和获得。
附图说明
附图仅用于示出具体实施例的目的,而并不认为是对本发明的限制,在整个附图中,相同的参考符号表示相同的部件。
图1为仪表盘布局的示意图;
图2为组件示意图;
图3为仪表盘及其组件的旋转、插入示意图;
图4为首次新增整行组件的示意图;
图5为在已有组件内部新增整行组件的示意图;
图6为影响单排组件情景下的插入示意图;
图7为在仅有一列的情景下、影响多拍组件的新组件插入示意图;
图8为从现有组件的中间位置插入时的示意图;
图9为展现预览提示的示意图;
图10、图11为调整右侧相邻组件的组件删除示意图;
图12为组件移动的结果示意图。
具体实施方式
下面结合附图来具体描述本发明的优选实施例,其中,附图构成本申请一部分,并与本发明的实施例一起用于阐释本发明的原理。
本发明的一个具体实施例,公开了一种商业智能仪表盘(business intelligencedashboard,BI dashboard)的布局方法,具体包括商业智能仪表盘的组件插入的方法,组件删除方法、组件移动、组件缩放和校验方法。
本发明涉及的方法能帮助业务人员快速高效地创建一个仪表盘,解决仪表盘制作过程中,仪表盘的业务定义以及布局美化两大问题。所述仪表盘是一般商业智能都拥有的实现数据可视化的模块,它是向企业展示度量信息和关键业务指标现状的工具,是商业智能最终展现给用户的结果物。
仪表盘由一系列组件组成,仪表盘的制作过程中,包含组件的新增、删除、移动、缩放和校验等工作,在这些过程中,调整仪表盘中各组件的布局是最频繁的操作之一,本实施例能够解决组件操作过程中,组件的均分、对齐和排列等问题,省去传统仪表盘制作过程中,逐像素的调整、对齐等繁琐操作。在仪表盘的制作过程中,组件与组件之间的插入、删除、调整等,可能以左、右、上、下四个方向出现,本实施例中的布局方法通过将仪表盘旋转的方式,将左、右、上、下四个方向的处理全部规约到对左侧方向的处理,处理完后再将仪表盘旋转回初始方向,这种方式简化了问题的处理。
下面将结合本发明中的附图,对本发明的技术方案进行清楚、完整地阐述。所描述的实施例是本发明的一个示例性实施例,而非全部实施例。
以下首先阐述实施例环境和坐标定义。
如图1所示,实施例中仪表盘布局的基础是各个组件都是矩形,仪表盘也是一个矩形,各组件能够将仪表盘完全填满的一种布局形态。组件与组件之间、以及组件和仪表盘之间可以存在间隔,但间隔是固定的。但是,本发明并不去局限于矩形组件,采用圆形、椭圆形、三角形等其他形状的组件,也在本发明的保护范围内,具体可以将圆形、椭圆形、三角形等其他形状的组件的放入矩形范围(矩形范围以组件的最长和最宽长度为边)内,再进行相应的布局计算。
如图2所示,将每个组件的采用一个4元组表示,Element=(x,y,w,h),其中x和y分别表示组件左上角的x、y坐标,该x、y坐标的值是组件左上角相对于仪表盘左上角的横向、纵向距离,w和h分别表示组件的宽度和高度。
仪表盘中的所有组件是一系列组件的集合,Dashboard={E1,E2,…En}。W和H分别表示仪表盘的宽度和高度。
仪表盘旋转,包括逆时针、顺时针旋转,具体采用以下方式:
仪表盘及其包含的组件顺时针旋转90度的坐标转换关系:
newEi.x=D.h-Ei.y-Ei.h
newEi.y=Ei.x
newEi.h=Ei.w
newEi.w=Ei.h
newD.w=D.h
newD.h=D.w
其中,D表示仪表盘旋转前的旧值,Ei表示仪表盘包含的任意一个组件的旧值,newD表示仪表盘顺时针旋转90度之后的新值,newEi表示Ei顺时针旋转90度之后的新值。
仪表盘及其包含的组件逆时针旋转90度的坐标对应关系:
newEi.x=Ei.y
newEi.y=D.w-Ei.x-Ei.w
newEi.h=Ei.w
newEi.w=Ei.h
newD.w=D.h
newD.h=D.w
其中,D表示仪表盘旋转前的旧值,Ei表示仪表盘包含的任意一个组件的旧值,newD表示仪表盘逆时针旋转90度之后的新值,newEi表示Ei逆时针旋转90度之后的新值。
本发明涉及的仪表盘布局方法,结合上述仪表盘的顺时针和逆时针旋转的定义,将左、右、上、下四个方向的处理算法转换为只考虑从左侧插入这一种情况:具体先将仪表盘和组件进行旋转,例如从下方进行处理时,通过顺时针旋转90度转换为从左侧进行处理,待处理完成后,将仪表盘和组件反向旋转(逆时针旋转90度)回原来的位置进行展现。其他方向同理进行处理。这样各个方向的处理可以共用一套处理代码,实现代码简单化、方便维护。
例如,如图3,将下方新插入组件转换成从左侧插入的场景。
如图(3-a),新组件从下方插入仪表盘
如图(3-b),利用前文定义的坐标转换,将仪表盘顺时针旋转90度,则新组件插入方向转换为从左侧插入,使用左侧插入方法对新组件进行布局;
如图(3-c),布局完成后,将插入新组件后的仪表盘逆时针旋转90度,转换回原来的位置关系得到最终结果并展示,其结果将等效于图(3-a)中从下方插入新组件到仪表盘之后的结果。
同样的原理,对于从右侧插入的场景,对仪表盘进行两次顺时针90度旋转操作,得到从左侧插入的情况,处理完毕后,再对仪表盘进行两次逆时针90度旋转,得到最终结果。
对于从上方插入情形,对仪表盘进行一次逆时针90度旋转操作,得到从左侧插入的情况,处理完毕后,再对仪表盘进行一次顺时针90度旋转,得到最终处理结果。
具体布局方法包括:
A.商业智能仪表盘中的组件插入方法,包括步骤:
步骤S1.客户端获取组件插入事件;
其中,组件插入事件可以由客户端获取,组件插入事件可以为鼠标拖拽新组件到仪表盘,也可以为手指通过触摸屏拖拽组件到仪表盘,也可以是触控笔拖拽组件到仪表盘或者其他方式。
步骤S2,客户端根据获取的插入事件,获取组件的插入方向;根据获取的插入方向,判定是否进行仪表盘及其组件的旋转,通过旋转可以将四个方向的插入归到一个方向进行以下插入计算。本实施例中以左侧插入为基准,将上侧、右侧、下侧的插入通过旋转转化为左侧插入。通过这种方式,可以使用一套插入程序实现四个方向的组件插入。当然,本发明也可以将四个方向的插入归集到右侧或下侧或上侧进行计算。本实施例的左侧插入仅是一种实施例。
步骤S3,客户端根据待插入组件的宽度判断该组件是否是整行插入;
如果是整行插入,则执行S31步骤;
如果不是整行插入,则执行S32步骤。
步骤S31:在仪表盘中首次新增整行组件,此时插入组件的高度为默认高度,宽度默认填充满仪表盘的宽度,最终插入效果如图4。
在已有组件内部新增整行组件时,新增插入组件的宽度与仪表盘的宽度相同、高度为默认高度。该新插入组件下方的其他组件,则下移相应的高度。通过以上方式实现中间的整行插入,最终插入效果如图5。
步骤S32.如果不是整行插入情况,即插入组件的宽度小于仪表盘宽度,则进一步根据待插入组件的高度,判断是该组件是实现单列插入、还是多列插入。所述单列插入是指仅影响最小高度的那一列、即影响单排组件的情形,所述多列插入是指新插入组件高度较高,会影响多排组件的情形。当待插入组件的高度小于等于单列组件高度时,则属于影响单排组件的情形;当待插入组件的高度大于单列组件高度时,则属于影响多排排组件的情形。
在仅影响单排组件的情形的情形下,新插入的组件与其影响那一原有组件将均分原有组件的面积。具体均分方法是:上述两组件分别采用原1/2的宽度、高度不变,或采用原1/2的高度、宽度不变,具体采用哪一种方式将根据客户的需求、图表的高宽而决定(如图6)。
在影响多排组件的情形下,新插入的组件将按列共同均分原来多排组件占据的面积。具体采用均分仪表盘宽度,而高度不变的方式进行共同均分。
在插入前仅有一列的情景下,具体均分方法是(如图7):保持原有多列组件的高度不变,将多列组件的宽度均减半,剩余空间为新插入组件的位置。新插入组件的高度为原有多拍组件高度的综合,宽度为原多列组件宽度的1/2。
插入前有两列的情景下,待插入的组件从现有组件的中间位置插入时,组件的插入会同时影响左右两侧原有组件的情形。此时,从左边找最小宽度的组件和右边最小宽度的组件,左侧组件、待插入组件、右侧组件将三等分原左右侧组件所占的宽度(如图8),原有组件的高度均不变。
以上举例说明均分方法,其他情形的均分原理相同。
采用上述判断和插入规则,能够灵活的进行组件插入,为仪表盘的布局实现更多变化,有利于之后的组件调整,提高了用户体验。
步骤S4,在执行完上述的插入操作后,将根据原有的旋转过程,反向旋转相同的度数或次数,将仪表盘及其组件转换到原来的角度,再进行呈现。
优选的,在将组件拖入现有组件时,会出现相应的展现预览提示(hint),以供用户参考(如图9)。
B.商业智能仪表盘中组件的删除方法,包括以下步骤:
删除组件时,按照左、右、上、下四个方向,顺次寻找与被删除组件相邻且需要调整的组件,删除目标组件并填充删除的区域。
具体包括以下步骤:
步骤S1.客户端获取组件删除事件,获取方式为插入事件中描述的方式之一;
步骤S2.客户端根据待删除组件的宽度判断该组件是否是整行删除,如果是则进入步骤S21,否则进入S3;
步骤S21,在用户输入整行删除的事务指令后,在删除整行组件后,将被删除组件下方的所有组件均上移h,h为被删除组件的高度;删除执行完毕,展现删除后的仪表盘;
步骤S3,在用户输入的删除事务指令涉及的组件不是整行组件后,采用以下方法:
S31.获取被删除组件右侧相邻的所有组件,在被删除组件具有右侧相邻组件的情况下,这些组件为所有需要调整的组件,将所有需要调整的组件的宽度延长,以填满删除组件的区域。具体的,对于需要调整的右侧相邻组件,在原有宽度的基础上,延长被删除组件的宽度,使各个受影响的组件均延长被删除组件的宽度,以填充被删除组件的区域,填充完成后,组件删除处理完毕(图10,图11)。
S32.如果被删除组件右侧没有需要调整的组件,则对仪表盘顺时针旋转90度一次,执行上一步骤S31,实现具有右侧相邻组件的情况下的删除操作;
S33.如果被删除组件右侧仍没有需要调整的组件,则在上一步的基础上对仪表盘再一次顺时针旋转90度,并执行步骤S31;
S34.在S33的基础上,如果被删除组件右侧仍没有需要调整的组件,则在上一步的基础上对仪表盘再一次顺时针旋转90度、或者在原仪表盘基础上逆时针旋转90度,并执行步骤S31。
不论待删除组件的位置在哪里,删除操作中右侧组件的延长填充将落入步骤S31-S34之一。
上述右侧相邻组件按照被删除组件的高度判断,右侧被相邻组件高度之和应等于被删除组件的高度。
步骤S4.在删除删除处理完毕后,将仪表盘及其组件反向旋转步骤S3中旋转相同的度数,并由客户端呈现最终删除后的结果。
上述步骤S2中整行删除的单独处理也可以并入到S3中,而不进行单独判断和处理。
进一步的,为了提高删除操作的灵活性,在步骤S3中,组件从中间删除的情形,此时采用上述方法,将使得右边的组件延长,而左边组件不动。为了更好的展现组件、实现组件也仪表盘上的均匀分布,上述步骤S3中,在进行延长操作前,还包括判断左侧是否有相邻组件。判断条件与右侧相邻组件的判断条件相同:左侧被判断为相邻组件的高度之和应等于被删除组件的高度。在判断左侧有相邻组件时,则左侧相邻组件和右侧相邻组件将分别延长,两者延长长度之和为被删除组件的宽度。
上述删除组件的方法将多种组件的延长填充,通过仪表盘及其组件的旋转规约到从右向左的填充,并进一步考虑左右两侧均实现延长填充的情形。
C.商业智能仪表盘中组件的移动方法:
移动组件就是将现有的组件从目前的位置删除掉,再插入到新的位置。删除和插入的技术和上文所述方法一致。
步骤S1,客户端获取用户输入的组件移动事件;
步骤S2,将组件移动事件拆分为组件删除事件和组件插入事件。
所述组件删除事件是将被移动组件从仪表盘现有布局删除,同时调整其被影响的其他组件,删除方法同上述B中的组件删除方法。
所述组件插入事件是在用户指定的位置插入被移动组件,具体插入方法同上述A中的组件删除方法。
步骤S3,在实现完上述组件删除事件和组件插入事件后,客户端呈现组件移动的结果(图12)。
D.商业智能仪表盘中组件的缩放方法,包括:
步骤S1,客户端获取用户输入的组件缩放事件;
步骤S2,根据获取的组件缩放事件,判断是否缩放整行;
如果是整行缩放,表示针对整行的高度进行缩放,此时缩放TargetE(TargetE可以是占据整行的单个组件,也可以是一行中包含的所有组件的集合)中所有组件的高,宽度不变,并将下方组件全部下移或上移TargetE的高度;
如果否则执行步骤S3:
步骤S3.如果组件或组件集合(TargetE)的边界从左往右进行移动,移动一距离(由于仪表盘的大小固定,组件缩放的情景是在组件右边或左边有其他组件时,调整相互大小时使用的,因此所述从左往右移动是指组件或组件集合的一个边界的移动),根据TargetE的最大高度,判断相邻影响到的左侧或右侧组件;将左侧或右侧组件的与该缩放组件相邻的边界从左往右延伸相同距离,实现目标组件的缩放及相邻组件的调整;
如果是从其他方向移动组件或组件集合的一个边界,例如从上向下、从下至上、从右至左移动边界,则旋转坐标系,以满足是从左向右移动的逻辑;旋转完成后进行上述移动和调整操作,实现缩放及调整;
如果从左往右移动后,右侧为空,则不进行右侧组件的操作;
步骤S4.在组件或组件集合缩放及调整完成之后,将仪表盘及其组件进行反向旋转坐标系,旋转角度与步骤S3中的旋转角度相同;然后在客户端进行缩放结果的呈现。
进一步的,本发明涉及的商业智能仪表盘的布局方法对组件的位置要求是严格的。如果有组件没有“对齐”的情况下面,那么所有的算法都将在一种不正确的状态下运行。为了避免这种不一致的状态出现。我们需要在每次的操作之后对所有的组件的位置进行校验。但是从算法复杂度上来说,要判断所有的组件是否对齐其实是非常耗时的。于是我们采取了一种近似的校验方式。就是计算所有组件的面积是否等于仪表盘的面积,当然还需要加上中间缝隙的面积。在不计算中间缝隙面积时,可以计算所有组件的面积之和是否等于仪表盘上当前有效面积来校验组件计算结果。这样虽然不能说完全校验出智能布局的出现的问题,但是低的算法复杂度下面对智能布局的一致性做出了保证。
进一步的,仪表盘可以整体进行缩放,仪表盘中的组件也会随着比例整体的缩放。但是在智能布局中,组件之间的缝隙宽度是固定。也就是说缝隙是不会随着仪表盘的缩放而进行缩放的。针对这种需求,可以将组件和缝隙按照比例缩放,之后将缝隙再根据需求拓宽或者收缩的方式来完成。
在将组件进行插入、删除、移动或缩放操作时,客户端呈现相应的展现预览提示,供用户参考。
综上所述,本发明实施例提供了一种商业智能仪表盘的布局方法,将仪表盘旋转的方式,将左、右、上、下四个方向的处理全部规约到对一个方向进行处理,处理完后再将仪表盘旋转回初始方向,这种方式使得四个方向的处理简化为一个方向的代码,仅需要在处理前进行仪表盘及其组件的旋转,这种方式简化了问题的处理和代码量,同时通过整体面积校验的方式进一步降低计算复杂度,解决了现有技术中繁琐的操作、复杂的终端处理的问题。上述实施例仅以左为例进行说明,规约到其他方向,本领域技术人员按照上述方法和思路,也能实现相同的技术效果。
本领域技术人员可以理解,实现上述实施例方法的全部或部分流程,可以通过计算机程序来指令相关的硬件来完成,所述的程序可存储于计算机可读存储介质中。其中,所述计算机可读存储介质为磁盘、光盘、只读存储记忆体或随机存储记忆体等。
以上所述,仅为本发明较佳的具体实施方式,但本发明的保护范围并不局限于此,任何熟悉本技术领域的技术人员在本发明揭露的技术范围内,可轻易想到的变化或替换,都应涵盖在本发明的保护范围之内。
Claims (10)
1.一种商业智能仪表盘中的组件插入方法,其特征在于,包括以下步骤:
步骤S1.客户端获取组件插入事件;
步骤S2,根据上述组件插入事件,获取组件的插入方向和插入位置,进一步判定是否进行仪表盘及其组件的旋转,将上、或下、或左、或右四个方向的插入通过仪表盘及其组件的旋转规约到一个方向再进行插入处理;
步骤S3,根据组件插入事件中的插入位置,执行插入处理;
步骤S4,在执行完上述插入操作后,将仪表盘及其组件反向旋转与步骤S2中旋转角度相同的度数,以将仪表盘及其组件转换到原来角度,再由客户端展现插入结果。
2.根据权利要求1所述的组件插入方法,其特征在于,所述步骤S3中的插入处理进一步包括以下步骤:
根据待插入组件的宽度判断该组件是否是整行插入;
如果是整行插入,执行步骤S31;如果不是整行插入,则执行步骤S32;
步骤S31:新增插入组件的宽度与仪表盘的宽度相同、高度为默认高度;新插入组件下方的其他组件,则下移相应的高度;
步骤S32:根据待插入组件的高度,判断是该组件是实现单列插入、还是多列插入;
在单列插入的情境下,新插入组件与其影响的原有组件将均分原有组件占据的面积;在多列插入的情景下,新插入组件与其影响的多排组件将按列共同均分原来多排组件占据的面积。
3.一种商业智能仪表盘中的组件删除方法,其特征在于,包括以下步骤:
步骤S1.客户端获取组件删除事件;
步骤S2.根据上述组件删除事件,获取被删除组件相邻的右侧所有组件,在没有相邻右侧组件的情景下,通过仪表盘及其组件旋转的方式,获取相邻的右侧所有组件;
步骤S3.在获取相邻的右侧所有组件后,将右侧所有组件向左侧延伸,填充删除组件的区域;
步骤S4.填充完成,将仪表盘及其组件反向旋转与上述步骤S2中相同的角度后,由客户端展现删除结果。
4.根据权利要求3所述的组件删除方法,其特征在于,所述步骤S2之前还包括将整行删除的情形单独处理的步骤:客户端根据待删除组件的宽度判断是否是整行删除,在整行删除的情况下,删除目标组件并采用上移的方式填充区域,删除执行完毕;在不是整行删除的情况下,执行步骤S2。
5.根据权利要求3或4所述的组件删除方法,其特征在于,所述步骤S3中,在获取相邻的右侧所有组件后,进一步判断被删除组件是否具有相邻的左侧组件,在同时具有相邻左侧组件时,相邻左侧和右侧组件均进行延伸,填充删除组件的区域。
6.一种商业智能仪表盘中的组件移动方法,其特征在于,将组件的移动分割为组件删除和组件插入两个步骤进行,所述组件删除采用上述权利要求3-5之一所述的方法;所述组件插入采用上述权利要求1-2之一所述的方法。
7.一种商业智能仪表盘中的组件缩放方法,其特征在于,将组件各边界的缩放通过仪表盘及其组件的旋转规约到一个方向上的移动,其他相邻组件进行填充,缩放完成后,再将仪表盘及其组件反向旋转到原来的角度,呈现缩放结果。
8.根据权利要求1至7之一所述的方法,其特征在于,在将组件进行插入、删除、移动、或缩放操作时,客户端呈现相应的展现预览提示,供用户参考。
9.根据权利要求1至7之一所述的方法,其特征在于,在上述组件插入、删除、移动、或缩放方法之后,还包括仪表盘校验的步骤:通过计算所有组件的面积之和是否等于仪表盘上当前有效面积来校验计算结果。
10.根据权利要求1至7之一所述的方法,其特征在于,在考虑组件间隙的情况下,将组件和缝隙按照比例缩放,之后将缝隙再根据需求拓宽或者收缩的方式来实现。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201811615123.0A CN109885363B (zh) | 2018-12-27 | 2018-12-27 | 一种商业智能仪表盘的组件布局方法 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201811615123.0A CN109885363B (zh) | 2018-12-27 | 2018-12-27 | 一种商业智能仪表盘的组件布局方法 |
Publications (2)
Publication Number | Publication Date |
---|---|
CN109885363A true CN109885363A (zh) | 2019-06-14 |
CN109885363B CN109885363B (zh) | 2022-03-25 |
Family
ID=66925244
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN201811615123.0A Active CN109885363B (zh) | 2018-12-27 | 2018-12-27 | 一种商业智能仪表盘的组件布局方法 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN109885363B (zh) |
Cited By (1)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN114995942A (zh) * | 2022-07-29 | 2022-09-02 | 北京永洪商智科技有限公司 | 商业智能仪表盘组件的样式自动生成方法及相关装置 |
Citations (7)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN101697176A (zh) * | 2009-10-29 | 2010-04-21 | 西北工业大学 | 多组件结构系统布局优化设计方法 |
US20130219263A1 (en) * | 2012-02-20 | 2013-08-22 | Wixpress Ltd. | Web site design system integrating dynamic layout and dynamic content |
CN103440106A (zh) * | 2013-08-28 | 2013-12-11 | 珠海市魅族科技有限公司 | 列表组件显示方法和终端 |
US20150346922A1 (en) * | 2014-05-29 | 2015-12-03 | International Business Machines Corporation | Arranging components in a two-dimensional area |
CN106406877A (zh) * | 2016-09-09 | 2017-02-15 | 浪潮软件股份有限公司 | 一种在线开发和发布轻应用的实现方法 |
CN106528741A (zh) * | 2016-11-04 | 2017-03-22 | 浪潮软件集团有限公司 | 一种基于大数据的可视化实现方法 |
CN108363572A (zh) * | 2018-01-03 | 2018-08-03 | 网易(杭州)网络有限公司 | 一种ui自动布局的方法 |
-
2018
- 2018-12-27 CN CN201811615123.0A patent/CN109885363B/zh active Active
Patent Citations (7)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN101697176A (zh) * | 2009-10-29 | 2010-04-21 | 西北工业大学 | 多组件结构系统布局优化设计方法 |
US20130219263A1 (en) * | 2012-02-20 | 2013-08-22 | Wixpress Ltd. | Web site design system integrating dynamic layout and dynamic content |
CN103440106A (zh) * | 2013-08-28 | 2013-12-11 | 珠海市魅族科技有限公司 | 列表组件显示方法和终端 |
US20150346922A1 (en) * | 2014-05-29 | 2015-12-03 | International Business Machines Corporation | Arranging components in a two-dimensional area |
CN106406877A (zh) * | 2016-09-09 | 2017-02-15 | 浪潮软件股份有限公司 | 一种在线开发和发布轻应用的实现方法 |
CN106528741A (zh) * | 2016-11-04 | 2017-03-22 | 浪潮软件集团有限公司 | 一种基于大数据的可视化实现方法 |
CN108363572A (zh) * | 2018-01-03 | 2018-08-03 | 网易(杭州)网络有限公司 | 一种ui自动布局的方法 |
Cited By (2)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN114995942A (zh) * | 2022-07-29 | 2022-09-02 | 北京永洪商智科技有限公司 | 商业智能仪表盘组件的样式自动生成方法及相关装置 |
CN114995942B (zh) * | 2022-07-29 | 2022-10-28 | 北京永洪商智科技有限公司 | 商业智能仪表盘组件的样式自动生成方法及相关装置 |
Also Published As
Publication number | Publication date |
---|---|
CN109885363B (zh) | 2022-03-25 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
US10248751B2 (en) | Alternative hierarchical views of a circuit design | |
EP0441359B1 (en) | Method of and apparatus for extracting image contour data | |
CN106648510B (zh) | 一种显示分辨率的显示方法及装置 | |
CN104217046B (zh) | 布线方法和装置 | |
CN108762601A (zh) | 应用功能的显示方法、装置及移动终端 | |
US11449209B2 (en) | Automatically positioning objects in three-dimensional space utilizing a widget | |
CN104125582B (zh) | 一种规划通信网络的方法 | |
US5335317A (en) | Method and apparatus for displaying three dimensional physical quantity | |
CN107451317A (zh) | 选择控制方法、选择控制装置和记录介质 | |
CN110570491A (zh) | 热力图生成方法及装置 | |
CN109885363A (zh) | 一种商业智能仪表盘的组件布局方法 | |
CN110008387A (zh) | 流场可视化实现方法、装置及电子设备 | |
US8274528B2 (en) | Support system, method and program | |
CN105653881A (zh) | 基于多密度层次的流场可视化方法 | |
CN111026895B (zh) | 一种数据可视化处理方法、装置及存储介质 | |
JP2002283816A (ja) | タイヤ有限要素モデルの作成方法、タイヤ有限要素モデルの作成装置およびプログラム | |
EP3657350A1 (en) | A data filtering device | |
US7451048B2 (en) | Method and apparatus for analyzing electromagnetic wave, and computer product | |
US10916067B1 (en) | Intelligent alignment of graphical elements | |
CN105474268A (zh) | 图像显示系统 | |
US9223904B2 (en) | Correction of topology interference for solid objects in a modeling environment | |
EP4191432A1 (en) | Method and apparatus for gis point data rendering, computer device, and storage medium | |
CN107904794A (zh) | 缝纫机的制版方法、装置、可读存储介质及缝纫机 | |
US10706199B1 (en) | Graphical user interface for interactive macro-cell placement | |
CN113096045A (zh) | 一种位图拉伸方法、位图拉伸装置及电子设备 |
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 |