处理矩形树图的方法和装置制造方法及图纸

技术编号:15910634 阅读:64 留言:0更新日期:2017-08-01 22:25
本发明专利技术公开了一种处理矩形树图的方法和装置,涉及互联网技术领域,能够解决现有技术中获取矩形名称操作繁琐的问题。本发明专利技术的方法包括:遍历待显示的矩形树图中的各个矩形,获得遍历的当前矩形的宽度、矩形名称的文字样式以及矩形名称,文字样式包括文字尺寸和文字间距;根据当前矩形的宽度以及当前矩形的矩形名称的文字样式,确定当前矩形的行字数,行字数为矩形每行所能容纳的文字个数;若当前矩形的矩形名称的字数大于行字数,则对当前矩形的矩形名称进行换行处理;在对矩形树图中各个矩形遍历完毕后,显示矩形树图。本发明专利技术主要适用于基于ECharts中的treemap控件渲染矩形树图的场景中。

Method and apparatus for processing rectangular Tree Graphs

The invention discloses a method and a device for processing a rectangular tree diagram, relating to the technical field of the Internet, and solving the problems of complicated operation of obtaining rectangle names in the prior art. The method of the invention comprises: each rectangle rectangular tree traversal to be displayed in the text style and name, the name of the width of rectangle rectangle rectangle for traversal of the text style including text size and text spacing; according to the width of the rectangle and the rectangle rectangular name text style, determine the current line of words a rectangle, line of words for the number of words per line rectangle can hold; if the name of the rectangular rectangular words than for words, the current name of the rectangular rectangle line processing; on rectangular tree in each rectangle traversal after rectangle tree. The invention is mainly applicable to the scene of rendering rectangular tree in treemap control based on ECharts.

【技术实现步骤摘要】
处理矩形树图的方法和装置
本专利技术涉及互联网
,尤其涉及一种处理矩形树图的方法和装置。
技术介绍
ECharts(EnterpriseCharts)是一种商业级数据图表库,可提供直观、生动、可交互以及可个性化定制的可视化数据图表。基于ECharts中不同的控件可渲染出不同类型的图表,例如,折线图、柱状图、饼图、热力图以及矩形树图等。其中,利用treemap控件可渲染出矩形树图。矩形树图由若干不同大小的矩形组成,且通过矩形树图可直观看出同一组数据的对比。在实际应用中,每个矩形中都会显示对应的矩形名称,用户可直观获知各个矩形所代表的数据;当鼠标光标移至某一矩形所在区域时,会在该矩形的上层显示矩形名称以及对应的取值,从而用户可直观获知该矩形的取值。然而,当矩形树图中某一矩形的宽度小于矩形名称的长度时,无法在该矩形中显示矩形名称,只有当用户将鼠标的光标移至该矩形区域时,才可在该矩形的上层显示矩形名称以及对应的取值。因此,当矩形树图中有多个矩形无法显示矩形名称时,用户需要一一将鼠标光标移至对应的矩形区域,才可获知矩形名称,操作十分繁琐。
技术实现思路
鉴于上述技术问题,本专利技术提出了一种处理矩形树图的方法和装置,其目的在于解决现有技术中存在的以下问题:当矩形树图中某一矩形的宽度小于矩形名称的长度时,无法在该矩形中显示矩形名称,并只有当用户将鼠标的光标移至该矩形局域时,才可在该矩形的上层显示矩形名称以及对应的取值,从而当矩形树图中有多个矩形无法显示矩形名称时,用户需要一一将鼠标光标移至对应的矩形区域,才可获知矩形名称,操作十分繁琐。一方面,本专利技术提供了一种处理矩形树图的方法,所述方法包括:遍历待显示的矩形树图中的各个矩形,获得遍历的当前矩形的宽度、矩形名称的文字样式以及矩形名称,所述文字样式包括文字尺寸和文字间距;根据所述当前矩形的宽度以及所述当前矩形的矩形名称的文字样式,确定所述当前矩形的行字数,所述行字数为矩形每行所能容纳的文字个数;若所述当前矩形的矩形名称的字数大于所述行字数,则对所述当前矩形的矩形名称进行换行处理;在对所述矩形树图中各个矩形遍历完毕后,显示所述矩形树图。另一方面,本专利技术提供了一种处理矩形树图的装置,所述装置包括:遍历单元,用于遍历待显示的矩形树图中的各个矩形,获得遍历的当前矩形的宽度、矩形名称的文字样式以及矩形名称,所述文字样式包括文字尺寸和文字间距;确定单元,用于根据所述遍历单元获得的当前矩形的宽度以及所述当前矩形的矩形名称的文字样式,确定所述当前矩形的行字数,所述行字数为矩形每行所能容纳的文字个数;处理单元,用于当所述当前矩形的矩形名称的字数大于所述确定单元确定的所述行字数时,对所述当前矩形的矩形名称进行换行处理;显示单元,用于在所述处理单元对所述矩形树图中各个矩形遍历完毕后,显示所述矩形树图。借由上述技术方案,本专利技术提供的处理矩形树图的方法和装置,能够在显示矩形树图以前,先遍历该矩形树图中的各个矩形,获取遍历的当前矩形的宽度、矩形名称的文字样式以及矩形名称,并根据当前矩形的宽度以及当前矩形的矩形名称的文字样式,确定当前矩形的行字数(即当前矩形每行所能容纳的文字个数),然后当当前矩形的矩形名称的字数大于行字数时,对当前矩形的矩形名称进行换行处理,最后在对该矩形树图中的各个矩形遍历完毕后,再显示矩形树图。由此可知,当矩形名称的长度大于矩形的宽度而无法单行显示时,本专利技术可以对该矩形名称先进行换行处理,再进行显示,从而使得用户能够通过矩形树图直观获知各个矩形所代表的数据,而无需用户必须通过将鼠标光标移至矩形名称的长度大于矩形宽度的矩形区域,才可获知矩形名称,进而简化了用户操作,提高了获取矩形名称的效率。上述说明仅是本专利技术技术方案的概述,为了能够更清楚了解本专利技术的技术手段,而可依照说明书的内容予以实施,并且为了让本专利技术的上述和其它目的、特征和优点能够更明显易懂,以下特举本专利技术的具体实施方式。附图说明通过阅读下文优选实施方式的详细描述,各种其他的优点和益处对于本领域普通技术人员将变得清楚明了。附图仅用于示出优选实施方式的目的,而并不认为是对本专利技术的限制。而且在整个附图中,用相同的参考符号表示相同的部件。在附图中:图1示出了本专利技术实施例提供的一种处理矩形树图的方法的流程图;图2示出了本专利技术实施例提供的一种矩形树图显示示意图;图3示出了本专利技术实施例提供的一种处理矩形树图的装置的组成框图;图4示出了本专利技术实施例提供的另一种处理矩形树图的装置的组成框图。具体实施方式下面将参照附图更详细地描述本公开的示例性实施例。虽然附图中显示了本公开的示例性实施例,然而应当理解,可以以各种形式实现本公开而不应被这里阐述的实施例所限制。相反,提供这些实施例是为了能够更透彻地理解本公开,并且能够将本公开的范围完整的传达给本领域的技术人员。本专利技术实施例提供了一种处理矩形树图的方法,如图1所示,该方法主要包括:101、遍历待显示的矩形树图中的各个矩形,获得遍历的当前矩形的宽度、矩形名称的文字样式以及矩形名称。其中,文字样式可以包括文字尺寸和文字间距,还可以包括字体、颜色、是否加粗、是否倾斜等。当用户对矩形树图中各个矩形的参数均设置完成后,treemap控件需要对该矩形树图进行渲染,即对矩形树图中的边框矩形进行划分,对划分后生成的各个矩形进行颜色填充,以便在渲染完成后,对矩形树图进行显示。因此,treemap控件可以在渲染矩形树图之前,对矩形树图中的各个矩形进行遍历,也可以在渲染矩形树图的过程中,对矩形树图中的各个矩形进行遍历,也可以在对矩形树图渲染完成后、显示前,对矩形树图中的各个矩形进行遍历,在此不作限定。102、根据当前矩形的宽度以及当前矩形的矩形名称的文字样式,确定当前矩形的行字数。其中,行字数为矩形每行所能容纳的文字个数。当获得当前矩形的宽度以及当前矩形的矩形名称的文字样式后,treemap控件可以从文字样式中获取文字尺寸以及文字间距,并基于文字尺寸、文字间距以及当前矩形的宽度,计算出当前矩形单行所能容纳的文字个数(即行字数),以便后续基于该行字数来判断是否需要对当前矩形名称进行换行处理。103、若当前矩形的矩形名称的字数大于行字数,则对当前矩形的矩形名称进行换行处理。若当前矩形的矩形名称的字数大于行字数,则当前矩形的矩形名称无法在当前矩形中进行单行显示,因此treemap控件需要对当前矩形的矩形名称进行换行处理,使其能够在当前矩形中进行多行显示;若当前矩形的矩形名称的字数小于等于行字数,则当前矩形的矩形名称能够在当前矩形中进行单行显示。104、在对矩形树图中各个矩形遍历完毕后,显示矩形树图。若上述步骤101-103在渲染矩形树图之前执行,则当对矩形树图中的所有矩形都如步骤101-103所述的处理方式进行处理后,先对矩形树图进行渲染,再显示矩形树图;若上述步骤101-103在渲染矩形树图的过程中执行,则当对矩形树图中的所有矩形都如步骤101-103所述的处理方式进行处理后,继续对矩形树图进行渲染,并在渲染完成后,显示矩形树图;若上述步骤101-103在对矩形树图渲染完成后执行,则当对矩形树图中的所有矩形都如步骤101-103所述的处理方式进行处理后,显示矩形树图。示例性的,如图2所示的矩形树本文档来自技高网...
处理矩形树图的方法和装置

【技术保护点】
一种处理矩形树图的方法,其特征在于,所述方法包括:遍历待显示的矩形树图中的各个矩形,获得遍历的当前矩形的宽度、矩形名称的文字样式以及矩形名称,所述文字样式包括文字尺寸和文字间距;根据所述当前矩形的宽度以及所述当前矩形的矩形名称的文字样式,确定所述当前矩形的行字数,所述行字数为矩形每行所能容纳的文字个数;若所述当前矩形的矩形名称的字数大于所述行字数,则对所述当前矩形的矩形名称进行换行处理;在对所述矩形树图中各个矩形遍历完毕后,显示所述矩形树图。

【技术特征摘要】
1.一种处理矩形树图的方法,其特征在于,所述方法包括:遍历待显示的矩形树图中的各个矩形,获得遍历的当前矩形的宽度、矩形名称的文字样式以及矩形名称,所述文字样式包括文字尺寸和文字间距;根据所述当前矩形的宽度以及所述当前矩形的矩形名称的文字样式,确定所述当前矩形的行字数,所述行字数为矩形每行所能容纳的文字个数;若所述当前矩形的矩形名称的字数大于所述行字数,则对所述当前矩形的矩形名称进行换行处理;在对所述矩形树图中各个矩形遍历完毕后,显示所述矩形树图。2.根据权利要求1所述的方法,其特征在于,根据所述当前矩形的宽度以及所述当前矩形的矩形名称的文字样式,确定所述当前矩形的行字数,包括:根据所述当前矩形的矩形名称对应的文字样式中文字尺寸以及文字间距,计算所述当前矩形对应的文字空间宽度,所述文字空间宽度为每个文字占用矩形的平均宽度;基于所述当前矩形的宽度以及所述文字空间宽度,确定所述当前矩形的行字数。3.根据权利要求1所述的方法,其特征在于,对所述当前矩形的矩形名称进行换行处理,包括:在所述当前矩形的矩形名称中,每隔所述行字数个文字,添加一个换行符。4.根据权利要求1至3中任一项所述的方法,其特征在于,在若所述当前矩形的矩形名称的字数大于所述行字数,则对所述当前矩形的矩形名称进行换行处理之前,所述方法还包括:获取所述当前矩形的高度;根据所述当前矩形的高度以及所述当前矩形的矩形名称的文字样式,确定所述当前矩形的列字数,所述列字数为矩形每列所能容纳的文字个数;将所述行字数与所述列字数相乘,获得所述当前矩形所能容纳的文字总数;若所述当前矩形的矩形名称的字数大于所述行字数,则对所述当前矩形的矩形名称进行换行处理,包括:若所述文字总数大于等于所述当前矩形的矩形名称的字数,则对所述当前矩形的矩形名称进行换行处理。5.根据权利要求4所述的方法,其特征在于,所述方法还包括:若所述文字总数小于所述当前矩形的矩形名称的字数,则根据所述当前矩形的矩形名称的字数、所述当前矩形的宽度以及所述当前矩形的高度,更换所述当前矩形的矩形名称对应的文字样式;基于更换后的文字样式,对所述当前矩形的矩形名称进行换行处理。6.一种处理矩形树图的装置,其特征在于,所述装置包括:遍历单元,用于...

【专利技术属性】
技术研发人员:张鹏霄
申请(专利权)人:北京国双科技有限公司
类型:发明
国别省市:北京,11

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

1