CN107168961B - 图表的数据展示方法及装置 - Google Patents

图表的数据展示方法及装置 Download PDF

Info

Publication number
CN107168961B
CN107168961B CN201610127185.1A CN201610127185A CN107168961B CN 107168961 B CN107168961 B CN 107168961B CN 201610127185 A CN201610127185 A CN 201610127185A CN 107168961 B CN107168961 B CN 107168961B
Authority
CN
China
Prior art keywords
graph
alternative
determining
cursor
reference value
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
Application number
CN201610127185.1A
Other languages
English (en)
Other versions
CN107168961A (zh
Inventor
董晓庆
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Advanced New Technologies Co Ltd
Advantageous New Technologies Co Ltd
Original Assignee
Alibaba Group Holding Ltd
Priority date (The priority date 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 date listed.)
Filing date
Publication date
Application filed by Alibaba Group Holding Ltd filed Critical Alibaba Group Holding Ltd
Priority to CN201610127185.1A priority Critical patent/CN107168961B/zh
Publication of CN107168961A publication Critical patent/CN107168961A/zh
Application granted granted Critical
Publication of CN107168961B publication Critical patent/CN107168961B/zh
Active legal-status Critical Current
Anticipated expiration legal-status Critical

Links

Images

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/90Details of database functions independent of the retrieved data types
    • G06F16/904Browsing; Visualisation therefor
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0484Interaction techniques based on graphical user interfaces [GUI] for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range
    • G06F3/04842Selection of displayed objects or displayed text elements
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F40/00Handling natural language data
    • G06F40/10Text processing
    • G06F40/166Editing, e.g. inserting or deleting
    • G06F40/174Form filling; Merging

Landscapes

  • Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • General Engineering & Computer Science (AREA)
  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • Databases & Information Systems (AREA)
  • Health & Medical Sciences (AREA)
  • Artificial Intelligence (AREA)
  • Audiology, Speech & Language Pathology (AREA)
  • Computational Linguistics (AREA)
  • General Health & Medical Sciences (AREA)
  • Human Computer Interaction (AREA)
  • Data Mining & Analysis (AREA)
  • User Interface Of Digital Computer (AREA)
  • Image Generation (AREA)

Abstract

本申请实施例公开了一种图表的数据展示方法及装置。所述方法包括:确定与光标所在的像素点对应的且在包含多个图形的图表中的第一坐标轴上的第一参照数值;根据所述第一参照数值确定与所述第一坐标轴对应的第一数值范围;根据图表中的各个图形对应的图形数据包含的在所述第一坐标轴上的数值与所述第一数值范围,确定所述图表中的备选图形集合;根据所述备选图形集合确定所述光标选定的待展示图形;将与所述待展示图形对应的图形数据在该图表中进行展示。本申请实施例通过上述方法,使得在图表中包含的图形数量较大时,可以确保计算一次光标所选定的图形的过程耗用较短的时间,确保图表中展示的数据准确性。

Description

图表的数据展示方法及装置
技术领域
本申请涉及计算机及人机交互技术领域,特别涉及一种图表的数据展示方法及装置。
背景技术
一般地,在浏览器上通过一定的计算机绘图程序可以绘制包含多个图形的图表(如Canvas图表),该图表的每个图形可以与一个图形数据进行对应。
以Canvas图表为例,Canvas(画布)是在HTML(超文本标记语言)中用以绘制图形的容器,在一些应用中可以通过Canvas来绘制图表。Canvas可以将一个绘图API(ApplicationProgramming Interface,应用程序编程接口)展现给客户端,以使JavaScript脚本能够把待绘制图形绘制到一块画布上。在绘制成上述包含多个图形的图表后,需要实现与鼠标之间的交互,在鼠标的光标在上述图表内移动时,需要将光标选定的图形对应的图形数据进行展示,以供用户查看。
通常,浏览器不会提供当前光标移动到上述Canvas图表中哪个图形上的事件或者接口,需要Canvas通过计算的方式来确定。为满足显示的要求,Canvas计算一次光标所选定的图形所耗用的时长需小于计算机显示屏上的像素点的刷新间隔。
现有技术中,以Canvas图表为例,计算机确定光标所选定的图形的过程是:当光标移动到Canvas图表中的某个位置之后,会确定当前光标所在位置对应的像素点的坐标,之后通过传统的数学几何算法,逐一检查当前像素点的坐标是否落入当前Canvas图表中的每一个图形所在的区域内,直至找到当前像素点的坐标所落入的图形,并将该图形对应的图形数据在该Canvas图表上进行展示。在该现有技术中,由于画布(canvas)上的图形绘制完成后是作为图片元素存在,需要为每个图形采用一次数学几何算法,这样完成一次光标所选定图形的计算过程需耗用的时长与上述Canvas图表中包含的图形数量成正比,当上述Canvas图表中包含的图形数量较大时,容易导致计算一次光标所选定的图形的过程所耗用的时长大于计算机显示屏上的像素点的刷新间隔,进而导致Canvas图表中展示的数据不准确。
发明内容
本申请实施例的目的是提供一种图表的数据展示方法及装置,用以解决上述现有技术中存在的问题。
为解决上述问题,本申请实施例提供的图表的数据展示方法及装置通过如下技术方案来实现:
一种Canvas图表的数据展示方法,包括:
确定与光标所在的像素点对应的且在包括多个图形的图表中的第一坐标轴上的第一参照数值;
根据所述第一参照数值确定与所述第一坐标轴对应的第一数值范围;其中,所述第一参照数值处于确定的所述第一数值范围内;
逐一判断与所述图表中的各个图形对应的图形数据在所述第一坐标轴上的数值是否处于所述第一数值范围内;
若是,将所述图表中的该图形确定为备选图形,得到包含各备选图形的备选图形集合;
基于所述备选图形集合中的各备选图形,确定所述光标所在的像素点落入的并被所述光标选定的待展示图形;
将与所述待展示图形对应的图形数据在该图表中进行展示。
一种图表的数据展示装置:
第一数值确定单元,用于确定与光标所在的像素点对应的且在包含多个图形的图表中的第一坐标轴上的第一参照数值;
第一范围确定单元,用于根据所述第一参照数值确定与所述第一坐标轴对应的第一数值范围;其中,所述第一参照数值处于确定的所述第一数值范围内;
第一判断单元,用于逐一判断与所述图表中的各个图形对应的图形数据在所述第一坐标轴上的数值是否处于所述第一数值范围内;若是,将所述图表中的该图形确定为备选图形,得到包含各备选图形的备选图形集合;
图形确定单元,用于基于所述备选图形集合中的各备选图形,确定所述光标所在的像素点落入的并被所述光标选定的待展示图形;
展示单元,用于将与所述待展示图形对应的图形数据在该图表中进行展示。
由以上本申请实施例提供的技术方案可见,本申请实施例提供的一种图表的数据展示方法及装置,通过在光标停留在图表中某个像素点上时,确定该光标所在的像素点对应的且在包含多个图形的图表中的第一坐标轴上的第一参照数值,并根据该第一参照数值确定第一数值范围,随后,通过逐一判断与所述图表中的各个图形对应的图形数据在所述第一坐标轴上的数值是否处于所述第一数值范围内,若是,将所述图表中的该图形确定为备选图形,得到包含各备选图形的备选图形集合。最终,基于所述备选图形集合中的备选图形,确定待展示图形(比如,可以利用传统的数学几何算法来确定)并将该待展示图形对应的图形数据在该图表中进行展示。相比较于现有技术,在本申请实施例上述过程中,通过确定第一数值范围,可以在第一数值范围对应的图表的区域内查找被光标选定的图形,从而可以将疑似被选定的图形(备选图形)的数目进行限缩,在得到各个疑似被选定的图形之后,可以在逐一通过传统的数学几何算法确定待展示图形,由于计算一次光标所选定的图形的过程所耗用的时间可以不决定于整个图表中包含的图形数量,使得在图表中包含的图形数量较大时,依然可以确保计算一次光标所选定的图形的过程耗用较短的时间(小于计算机显示屏上的像素点的刷新间隔),确保图表中展示的数据准确性。
附图说明
为了更清楚地说明本申请实施例或现有技术中的技术方案,下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍,显而易见地,下面描述中的附图仅仅是本申请中记载的一些实施例,对于本领域普通技术人员来讲,在不付出创造性劳动性的前提下,还可以根据这些附图获得其他的附图。
图1为本申请一实施例提供的图表的数据展示方法的流程图;
图2为本申请实施例中Canvas图表(点状)的示意图;
图3为本申请实施例中Canvas图表(柱状)的示意图;
图4为本申请一实施例提供的图表的数据展示装置的模块示意图。
具体实施方式
为了使本技术领域的人员更好地理解本申请中的技术方案,下面将结合本申请实施例中的附图,对本申请实施例中的技术方案进行清楚、完整地描述,显然,所描述的实施例仅仅是本申请一部分实施例,而不是全部的实施例。基于本申请中的实施例,本领域普通技术人员在没有作出创造性劳动前提下所获得的所有其他实施例,都应当属于本申请保护的范围。
本申请实施例提供一种图表的数据展示方法及装置,用以解决现有技术在确定光标所选定的图形并将所述图形对应的图形数据进行展示的过程中存在的耗时问题。为了便于描述,本文将以Canvas图表为例对本申请的技术方案进行叙述。当然,所述包含多个图形的图表包括除Canvas图表之外的其他类型的图表,本申请将不一一列举。
对于Canvas图表,计算机可以在网页中通过Canvas API生成Canvas图表。其中,关于如何生成Canvas图表的过程为本领域普通技术人员所熟知的技术,本文不再予以介绍。本文将具体叙述在生成Canvas图表之后,计算机确定光标所选定的图形,并将该选定的图形对应的图形数据进行展示的过程。
图1为本申请一实施例中图表的数据展示方法的流程图。配合参照图1和图2所示,本实施例中,所述图表的数据展示方法包括如下步骤:
S110:确定与光标所在的像素点对应的且在图表中的第一坐标轴上的第一参照数值。
以Canvas图表为例,像素点是显示器显示画面的最小发光单位,由红、绿、蓝三个像素单元组成。在计算机的显示器显示生成的Canvas图表时,该Canvas图表所在区域10是由若干像素点组成的。在图2中,所示Canvas图表为点状图,其中包含多个呈圆形状的图形11,每个图形代表一个图形数据,该图形数据由在x轴上的数值和在y轴上的数值组成,如:(1.5 13000)。其中,对于上述Canvas图表,当计算机确定到光标20所在的位置对应的像素点之后,一般可以根据该Canvas图表所在区域10内包括的像素点个数、x轴上的数值区间及y轴上的数值区间,来确定该Canvas图表内每个像素点对应的参照数值。
其中,第一坐标轴可以是x轴或y轴,当然,对于三维图表而言,该第一坐标轴还可以是z轴。以第一坐标轴为x轴为例,则确定的第一参照数值为与x轴对应的数值。
举例而言,假设在x轴上的数值区间是(0,4),在y轴上的数值区间是(0,20000),在该Canvas图表的x轴上包括200个像素点,在该Canvas图表的y轴上包括100个像素点,则,可以计算得到x轴上的相邻两个像素点在x轴上的参照数值之差为:4/200=0.02,可以计算得到y轴上的相邻两个像素点在y轴上的参照数值之差为:20000/100=200。则,对于光标20所在的任意一个像素点(h,k),其中,若h表示该像素点在x轴方向上的编号,k表示该像素点在y轴方向上的编号,可以确定与该像素点(h,k)对应的在x轴上的参照数值p=0.02h,在y轴上的参照数值q=200k。例如,确定到当前光标所在的像素点是Canvas图表的x轴从左向右数的第100个像素点,是Canvas图表的y轴从下向上数的第50个像素点,则与该像素点对应的在x轴上的参照数值p=2,在y轴上的参照数值q=10000。
S120:根据所述第一参照数值确定与所述第一坐标轴对应的第一数值范围;其中,所述第一参照数值处于确定的所述第一数值范围内。
在上述例子中,第一坐标轴可以是x轴,第一参照数值是与x轴对应的参照数值,该参照数值并不是最终要展示的数值,需确定到当前光标所选定的图形。为避免将Canvas图表中所有的图形与当前光标的像素点进行数学几何算法,本申请实施例需要在Canvas图表中确定一个用以包含被选定图形的区域。
在上述图2中,假设光标所在的像素点对应的参照数值是p(x轴)和q(y轴),若第一坐标轴是x轴,则确定的第一数值范围内可以是:(a,b),其中,a≤p≤b;若第一坐标轴是y轴,则确定的第一数值范围内可以是:(c,d),其中,c≤q≤d。举例而言,如p=2,则第一数值范围可以是:(1.5,2.5);如q=10000,则第一数值范围可以是:(8000,12000)。
本申请实施例中,根据所述第一参照数值确定与所述第一坐标轴对应的第一数值范围之前,首先可以确定所述Canvas图表中包含的最大图形。其次,确定与处于所述最大图形内的各像素点对应的在所述第一坐标轴上的参照数值,得到与所述最大图形对应的参照数值变化区间。进而,根据所述第一参照数值确定与所述第一坐标轴对应的第一数值范围。具体地,根据所述第一参照数值及所述参照数值变化区间,确定与所述第一坐标轴对应的第一数值范围;其中,所述第一参照数值与所述第一数值范围的端点值之间的差值不小于所述参照数值变化区间。即若确定的第一数值范围为:(a,b)(a和b作为该数值范围的端点值),第一参照数值为p,所述参照数值变化区间的二分之一为s,则所述第一参照数值与所述第一数值范围的端点值之间应满足条件:
|a-p|≥s且|b-p|≥s。
举例而言,上述最大图形为Canvas图表中形状最大的一个图形。当然,在图2中,若每个图形的大小相等,则只需确定任意一个图形的参照数值变化区间,即可确定上述第一数值范围。在图2中,若第一坐标轴为x轴,则只需确定该最大图形(圆)在x轴方向上的直径两端的两个像素点,通过上述方法,可以确定这两个像素点对应的在x轴方向上的参照数值例如为:1.2和1.3,则可以得到在x轴方向上的参照数值变化区间为:0.1,这样,上述s=0.05。
本申请实施例中,若第一坐标轴为x轴,在确定第一数值范围:(a,b)时,参照数值p可以满足这个的条件:p=b-a(即p处于a与b练成的线段的中点处)。当然,在其他可行的实施例中,也可以满足这样的条件:p≠b-a,只需满足|a-p|≥s且|b-p|≥s的条件即可。通过上述方案,可以确保最终确定的区域内包含所需查找的被选定图形。当然,上述第一数值范围也可以人为设定一个固定的数值区间,在确定上述p之后,只需基于该p向左向右移动即可。对于第一坐标轴为y轴的情况,原理参照上述内容。
S130:逐一判断与所述图表中的各个图形对应的图形数据在所述第一坐标轴上的数值是否处于所述第一数值范围内。
S140:若是,将所述图表中的该图形确定为备选图形,得到包含各备选图形的备选图形集合。
以Canvas图表为例,假设第一坐标轴为x轴,光标所在的像素点在x轴方向上的第一参照数值p=2,确定的第一数值范围为(1.5,2.5)。则,通过遍历该Canvas图表中的各个图形对应的图形数据,可以快递找到落到该第一数值范围内的图形数据,例如是:
(1.6,16000),(1.55,14000),(1.65,9000)
(1.34,19000),(1.87,16800),(1.9,17000)
(2.12,11400),(2.2,12000),(1.8,11000)
(1.4,7700),(1.77,15500),(2.33,8000)
则总共找到上述12个图形数据,对应于12个图形。则,备选图形集合中包含这12个图形。
一般地,若备选图形集合中包含的备选图形的数量较多,若对每个备选图形采取数学几何算法,确定当前光标选定的图形,则有可能导致计算耗用较长时间。本申请实施例中,为解决上述问题,在上述步骤S140之后,所述方法还包括:
判断所述备选图形集合包含的备选图形的数量是否小于或等于预设阈值。若所述备选图形集合包含的备选图形的数量小于或等于预设阈值,进入下述步骤S150。
在上述例子中,若设定的预设阈值为10,则上述备选图形集合中包含的备选图形数量无法满足要求,需要进一步进行过滤;若设定的预设阈值为15,则可以满足要求,直接可以进入步骤S150。本申请实施例中,上述预设阈值可以根据实际需求进行设定。
本申请实施例中,当所述备选图形集合包含的备选图形的数量大于预设阈值时,可以继续通过第二坐标轴(如y轴)来进行过滤。则具体包括如下步骤:
S10:确定与光标所在的像素点对应的且在图表中的第二坐标轴上的第二参照数值q。
S20:根据所述第二参照数值q确定与所述第二坐标轴(如y轴)对应的第二数值范围:(c,d);其中,所述第二参照数值q处于确定的所述第二数值范围(c,d)内。
S30:逐一判断与所述备选图形集合中的各个备选图形对应的图形数据包含的在所述第二坐标轴上的数值是否处于所述第二数值范围内。若否,进入步骤S40。
上述步骤S10~S30可以参照上述步骤S110~S130的内容,本文不再予以赘述。
S40:将该备选图形从备选图形集合中剔除。
举例而言,在上述得到12个备选图形的图形数据的例子中,若继续通过y轴进行过滤,假设第二数值范围(c,d)例如是:(8000,12000),则,过滤后得到的备选图形集合中包括的备选图形的图形数据如下:
(1.65,9000)(2.12,11400),(2.2,12000),
(1.8,11000),(1.4,7700),(2.33,8000)
从而,可以确保最终得到的备选图形的个数小于预设阈值,缓解采用数学几何算法对计算时间的消耗,进而确保能够较快地确定被光标选定的图形。
S150:基于所述备选图形集合中的各备选图形,确定所述光标所在的像素点落入的并被所述光标选定的待展示图形。
基于所述备选图形集合中的各备选图形,可以根据数学几何算法来确定所述光标所在的像素点落入的并被所述光标选定的待展示图形。每种图形对应一种算法。具体的,首先算出每个图形的轮廓对应的方程式,若所述图形为圆,则其轮廓对应的方程式可以算出为:
(x+A)2+(y+B)2=C
进而将所述光标所在的像素点对应的且在Canvas图表中的参照数值(p,q)带入上述方程式中,
若(p+A)2+(q+B)2-C=0,则说明光标所对应的在Canvas图表中的坐标点在该图形上,该图形为待展示图形。
若(p+A)2+(q+B)2-C<0,则说明光标所对应的在Canvas图表中的坐标点在该图形内,该图形为待展示图形。
若(p+A)2+(q+B)2-C>0,则说明光标所对应的在Canvas图表中的坐标点在该图形之外,该图形不是待展示图形。
例如一个圆形的方程式为x2+y2=1然后,将像素点的坐标带入上述方程式,判断其在图形内还是图形外。
所述Canvas图表中包含的图形还可以是矩形、三角形、不规则图形等,可以采用与每种特定图形相应的数学几何算法来确定上述光标所咋的像素点落入的图形,并将该图形确定为待展示图形。本文不再对各种图形的数学几何算法一一介绍。
本申请实施例中,可能存在多个图形在所述Canvas图表中重叠的情况,这样就有可能导致光标所在的像素点落入多个图形内。为解决这样的问题,基于所述备选图形集合中的各备选图形,确定所述光标所在的像素点落入的并被所述光标选定的待展示图形,具体包括如下步骤:
a)基于所述备选图形集合中的各备选图形,确定所述光标所在的像素点落入的备选图形;
b)判断所述光标所在的像素点落入的备选图形是否唯一;若是,进入步骤c;若否,进入步骤d。
c)将光标所在的像素点落入的唯一的备选图形确定为待展示图形。
d)将光标所在的像素点落入的多个备选图形中在Canvas图表中最后生成的备选图形确定为待展示图形。
通过上述过程,由于在Canvas图表中,各个图形是按照一定的顺序生成的,计算机中记录了Canvas图表中各个图形生成的先后顺序,故在确定到像素点落入的备选图形不唯一时,可以将最后生成的备选图形确定为待展示图形,从而解决上述问题,并且确保Canvas图表中数据的正常显示。
S160:将与所述待展示图形对应的图形数据在该图表中进行展示。
所述待展示图形及与其对应的图形数据以一一对应的关系,预先存储。所述待展示图形对应的图形数据,可以在图表中预设的区域内展示。比如,可以将展示数据的区域设置于光标附近的任意位置,同时还可以将展示图形数据的区域预设为消息框的形式。则所述待展示图形对应的图形数据可以通过预设消息框展示于该Canvas图表中。
例如,从上述6个备选图形的图形数据(1.65,9000)(2.12,11400),(2.2,12000),(1.8,11000),(1.4,7700),(2.33,8000)中,最终确定的待展示图形的图形数据为(2.33,8000),则显示的数据便是(2.33,8000)。
值得提及的是,参照图3所述,本申请实施例中,上述图表还可以是柱状图等形式,柱状图可以采用与上述点状图相同的原理,本申请不再予以赘述。
由以上本申请实施例提供的技术方案可见,本申请实施例提供的一种图表的数据展示方法,通过在光标停留在图表中某个像素点上时,确定该光标所在的像素点对应的且在图表中的第一坐标轴上的第一参照数值,并根据该第一参照数值确定第一数值范围,随后,通过逐一判断与所述图表中的各个图形对应的图形数据在所述第一坐标轴上的数值是否处于所述第一数值范围内,若是,将所述图表中的该图形确定为备选图形,得到包含各备选图形的备选图形集合。最终,基于所述备选图形集合中的备选图形,确定待展示图形(利用传统的数学几何算法)并将该待展示图形对应的图形数据在该图表中进行展示。在上述过程中,通过确定第一数值范围,可以在第一数值范围对应的图表的区域内查找被光标选定的图形,从而可以将疑似被选定的图形(备选图形)的数目进行筛选,在得到各个疑似被选定的图形之后,在逐一通过传统的数学几何算法确定待展示图形。本申请实施例中,由于计算一次光标所选定的图形的过程所耗用的时间可以不决定于整个图表中包含的图形数量,使得在图表中包含的图形数量较大时,依然可以确保计算一次光标所选定的图形的过程耗用较短的时间(小于计算机显示屏上的像素点的刷新间隔),确保图表中展示的数据准确性。
除了利用本申请实施例中的Canvas绘制图表之外,还可以基于SVG或VML技术来绘制图表。其中Canvas与SVG及VML之间的不同之处在于,Canvas有一种基于JavaScript的绘图应用程序接口(Application Program Interface,API),而SVG和VML通过XML文档来描述绘图。这两种绘图方式在功能上是等同的,但是对于绘制的图表中图形的编辑过程各有特点。通过XML文档来描述绘图,可以对图表中的每个图片进行单独编辑,而基于Canvas绘制的图表,一旦绘制完成,其以一个图片的形式存在,不方便对图表中的每个图片进行单独编辑。比如利用SVG绘图时,若需要从绘制完成的图表移除某个图形或元素时,则从绘图的描述语言中移除图片或元素即可,而同样的情况下Canvas则需要重新绘制一遍,而不能通过对于图表中的某个图形进行单独编辑来实现对该图形的移除操作。此外SVG比较适合图形数量较少的情况,而Canvas可以适用于图形数量较大的情况。
本申请实施例还提供一种Canvas图表的数据展示装置,可以实现上述的方法步骤,且该装置可以通过软件实现,也可以通过硬件或者软硬件结合的方式实现。以软件实现为例,作为逻辑意义上的装置,是通过服务器的CPU(Central Process Unit,中央处理器)将对应的计算机程序指令读取到内存中运行形成的。
图4为本申请一实施例中图表的数据展示装置的模块示意图。本实施例中,所述图表的数据展示装置包括:
第一数值确定单元201,用于确定与光标所在的像素点对应的且在图表中的第一坐标轴上的第一参照数值;
第一范围确定单元202,用于根据所述第一参照数值确定与所述第一坐标轴对应的第一数值范围;其中,所述第一参照数值处于确定的所述第一数值范围内;
第一判断单元203,用于逐一判断与所述图表中的各个图形对应的图形数据在所述第一坐标轴上的数值是否处于所述第一数值范围内;若是,将所述图表中的该图形确定为备选图形,得到包含各备选图形的备选图形集合;
图形确定单元204,用于基于所述备选图形集合中的各备选图形,确定所述光标所在的像素点落入的并被所述光标选定的待展示图形;
展示单元205,用于将与所述待展示图形对应的图形数据在该图表中进行展示。
本申请实施例的装置中,以Canvas图表为例,由于计算一次光标所选定的图形的过程所耗用的时间可以不决定于整个Canvas图表中包含的图形数量,使得在Canvas图表中包含的图形数量较大时,依然可以确保计算一次光标所选定的图形的过程耗用较短的时间(小于计算机显示屏上的像素点的刷新间隔),确保Canvas图表中展示的数据准确性。
如图4的所示的装置,本申请实施例中,该装置还包括:
最大图形确定单元,用于确定所述图表中包含的最大图形;
区间确定单元,用于确定与处于所述最大图形内的各像素点对应的在所述第一坐标轴上的参照数值,得到与所述最大图形对应的参照数值变化区间;
则,所述第一范围确定单元具体用于:
根据所述第一参照数值及所述参照数值变化区间,确定与所述第一坐标轴对应的第一数值范围;其中,所述第一参照数值与所述第一数值范围的端点值之间的差值不小于所述参照数值变化区间。
如图4的所示的装置,本申请实施例中,该装置还包括:
备选数量判断单元,用于判断所述备选图形集合包含的备选图形的数量是否小于或等于预设阈值;
则,所述图形确定单元具体用于:
若所述备选图形集合包含的备选图形的数量小于或等于预设阈值,基于所述备选图形集合中的各备选图形,确定所述光标所在的像素点落入的并被所述光标选定的待展示图形。
如图4的所示的装置,本申请实施例中,该装置还包括:
第二数值确定单元,用于在所述备选图形集合包含的备选图形的数量大于预设阈值时,确定与光标所在的像素点对应的且在图表中的第二坐标轴上的第二参照数值;
第二范围确定单元,用于根据所述第二参照数值确定与所述第二坐标轴对应的第二数值范围;其中,所述第二参照数值处于确定的所述第二数值范围内;
第二判断单元,用于逐一判断与所述备选图形集合中的各个备选图形对应的图形数据包含的在所述第二坐标轴上的数值是否处于所述第二数值范围内;若否,将该备选图形从备选图形集合中剔除。
如图4的所示的装置,本申请实施例中,该装置还包括:
落入图形确定单元,用于基于所述备选图形集合中的各备选图形,确定所述光标所在的像素点落入的备选图形;
唯一性判断单元,用于判断所述光标所在的像素点落入的备选图形是否唯一;
待展示图形确定单元,用于在所述光标所在的像素点落入的备选图形唯一时,将所述光标所在的像素点落入的唯一的备选图形确定为待展示图形;用于在所述光标所在的像素点落入的备选图形不唯一时,将所述光标所在的像素点落入的多个备选图形中在图表中最后生成的备选图形确定为待展示图形。
上述实施例阐明的系统、装置、模块或单元,具体可以由计算机芯片或实体实现,或者由具有某种功能的产品来实现。
为了描述的方便,描述以上装置时以功能分为各种单元分别描述。当然,在实施本申请时可以把各单元的功能在同一个或多个软件和/或硬件中实现。
本领域内的技术人员应明白,本发明的实施例可提供为方法、系统、或计算机程序产品。因此,本发明可采用完全硬件实施例、完全软件实施例、或结合软件和硬件方面的实施例的形式。而且,本发明可采用在一个或多个其中包含有计算机可用程序代码的计算机可用存储介质(包括但不限于磁盘存储器、CD-ROM、光学存储器等)上实施的计算机程序产品的形式。
本发明是参照根据本发明实施例的方法、设备(系统)、和计算机程序产品的流程图和/或方框图来描述的。应理解可由计算机程序指令实现流程图和/或方框图中的每一流程和/或方框、以及流程图和/或方框图中的流程和/或方框的结合。可提供这些计算机程序指令到通用计算机、专用计算机、嵌入式处理机或其他可编程数据处理设备的处理器以产生一个机器,使得通过计算机或其他可编程数据处理设备的处理器执行的指令产生用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的装置。
这些计算机程序指令也可存储在能引导计算机或其他可编程数据处理设备以特定方式工作的计算机可读存储器中,使得存储在该计算机可读存储器中的指令产生包括指令装置的制造品,该指令装置实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能。
这些计算机程序指令也可装载到计算机或其他可编程数据处理设备上,使得在计算机或其他可编程设备上执行一系列操作步骤以产生计算机实现的处理,从而在计算机或其他可编程设备上执行的指令提供用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的步骤。
在一个典型的配置中,计算设备包括一个或多个处理器(CPU)、输入/输出接口、网络接口和内存。
内存可能包括计算机可读介质中的非永久性存储器,随机存取存储器(RAM)和/或非易失性内存等形式,如只读存储器(ROM)或闪存(flash RAM)。内存是计算机可读介质的示例。
计算机可读介质包括永久性和非永久性、可移动和非可移动媒体可以由任何方法或技术来实现信息存储。信息可以是计算机可读指令、数据结构、程序的模块或其他数据。计算机的存储介质的例子包括,但不限于相变内存(PRAM)、静态随机存取存储器(SRAM)、动态随机存取存储器(DRAM)、其他类型的随机存取存储器(RAM)、只读存储器(ROM)、电可擦除可编程只读存储器(EEPROM)、快闪记忆体或其他内存技术、只读光盘只读存储器(CD-ROM)、数字多功能光盘(DVD)或其他光学存储、磁盒式磁带,磁带磁磁盘存储或其他磁性存储设备或任何其他非传输介质,可用于存储可以被计算设备访问的信息。按照本文中的界定,计算机可读介质不包括暂存电脑可读媒体(transitory media),如调制的数据信号和载波。
还需要说明的是,术语“包括”、“包含”或者其任何其他变体意在涵盖非排他性的包含,从而使得包括一系列要素的过程、方法、商品或者设备不仅包括那些要素,而且还包括没有明确列出的其他要素,或者是还包括为这种过程、方法、商品或者设备所固有的要素。在没有更多限制的情况下,由语句“包括一个……”限定的要素,并不排除在包括所述要素的过程、方法、商品或者设备中还存在另外的相同要素。
本领域技术人员应明白,本申请的实施例可提供为方法、系统或计算机程序产品。因此,本申请可采用完全硬件实施例、完全软件实施例或结合软件和硬件方面的实施例的形式。而且,本申请可采用在一个或多个其中包含有计算机可用程序代码的计算机可用存储介质(包括但不限于磁盘存储器、CD-ROM、光学存储器等)上实施的计算机程序产品的形式。
本申请可以在由计算机执行的计算机可执行指令的一般上下文中描述,例如程序模块。一般地,程序模块包括执行特定任务或实现特定抽象数据类型的例程、程序、对象、组件、数据结构等等。也可以在分布式计算环境中实践本申请,在这些分布式计算环境中,由通过通信网络而被连接的远程处理设备来执行任务。在分布式计算环境中,程序模块可以位于包括存储设备在内的本地和远程计算机存储介质中。
本说明书中的各个实施例均采用递进的方式描述,各个实施例之间相同相似的部分互相参见即可,每个实施例重点说明的都是与其他实施例的不同之处。尤其,对于系统实施例而言,由于其基本相似于方法实施例,所以描述的比较简单,相关之处参见方法实施例的部分说明即可。
以上所述仅为本申请的实施例而已,并不用于限制本申请。对于本领域技术人员来说,本申请可以有各种更改和变化。凡在本申请的精神和原理之内所作的任何修改、等同替换、改进等,均应包含在本申请的权利要求范围之内。

Claims (12)

1.一种图表的数据展示方法,其特征在于,包括:
确定与光标所在的像素点对应的且在包含多个图形的图表中的第一坐标轴上的第一参照数值;
根据所述第一参照数值和参照数值变化区间确定与所述第一坐标轴对应的第一数值范围;其中,所述第一参照数值处于确定的所述第一数值范围内,所述参照数值变化区间是基于所述图表中包含的最大图形内的各像素点对应的在所述第一坐标轴上的参照数值确定的数值范围或者预先设定的固定数值范围;
逐一判断与所述图表中的各个图形对应的图形数据在所述第一坐标轴上的数值是否处于所述第一数值范围内;
若是,将所述图表中的该图形确定为备选图形,得到包含各备选图形的备选图形集合;
基于所述备选图形集合中的各备选图形,确定所述光标所在的像素点落入的并被所述光标选定的待展示图形;
将与所述待展示图形对应的图形数据在该图表中进行展示。
2.如权利要求1所述的方法,其特征在于,所述图表为Canvas图表。
3.如权利要求1所述的方法,其特征在于,根据所述第一参照数值和参照数值变化区间确定与所述第一坐标轴对应的第一数值范围之前,所述方法还包括:
确定所述图表中包含的最大图形;
确定与处于所述最大图形内的各像素点对应的在所述第一坐标轴上的参照数值,得到与所述最大图形对应的参照数值变化区间;
则,根据所述第一参照数值和参照数值变化区间确定与所述第一坐标轴对应的第一数值范围,具体包括:
根据所述第一参照数值及所述参照数值变化区间,确定与所述第一坐标轴对应的第一数值范围;其中,所述第一参照数值与所述第一数值范围的端点值之间的差值不小于所述参照数值变化区间。
4.如权利要求1所述的方法,其特征在于,所述将所述图表中的该图形确定为备选图形,得到包含各备选图形的备选图形集合之后,所述方法还包括:
判断所述备选图形集合包含的备选图形的数量是否小于或等于预设阈值;
则,基于所述备选图形集合中的各备选图形,确定所述光标所在的像素点落入的并被所述光标选定的待展示图形,具体包括:
若所述备选图形集合包含的备选图形的数量小于或等于预设阈值,基于所述备选图形集合中的各备选图形,确定所述光标所在的像素点落入的并被所述光标选定的待展示图形。
5.如权利要求4所述的方法,其特征在于,判断所述备选图形集合包含的备选图形的数量是否小于或等于预设阈值之后,所述方法还包括:
若所述备选图形集合包含的备选图形的数量大于预设阈值,确定与光标所在的像素点对应的且在图表中的第二坐标轴上的第二参照数值;
根据所述第二参照数值确定与所述第二坐标轴对应的第二数值范围;其中,所述第二参照数值处于确定的所述第二数值范围内;
逐一判断与所述备选图形集合中的各个备选图形对应的图形数据包含的在所述第二坐标轴上的数值是否处于所述第二数值范围内;
若否,将该备选图形从备选图形集合中剔除。
6.如权利要求1所述的方法,其特征在于,基于所述备选图形集合中的各备选图形,确定所述光标所在的像素点落入的并被所述光标选定的待展示图形,具体包括:
基于所述备选图形集合中的各备选图形,确定所述光标所在的像素点落入的备选图形;
判断所述光标所在的像素点落入的备选图形是否唯一;
若是,将所述光标所在的像素点落入的唯一的备选图形确定为待展示图形;
若否,将所述光标所在的像素点落入的多个备选图形中在图表中最后生成的备选图形确定为待展示图形。
7.一种图表的数据展示装置,其特征在于,包括:
第一数值确定单元,用于确定与光标所在的像素点对应的且在包含多个图形的图表中的第一坐标轴上的第一参照数值;
第一范围确定单元,用于根据所述第一参照数值和参照数值变化区间确定与所述第一坐标轴对应的第一数值范围;其中,所述第一参照数值处于确定的所述第一数值范围内,所述参照数值变化区间是基于所述图表中包含的最大图形内的各像素点对应的在所述第一坐标轴上的参照数值确定的数值范围或者预先设定的固定数值范围;
第一判断单元,用于逐一判断与所述图表中的各个图形对应的图形数据在所述第一坐标轴上的数值是否处于所述第一数值范围内;若是,将所述图表中的该图形确定为备选图形,得到包含各备选图形的备选图形集合;
图形确定单元,用于基于所述备选图形集合中的各备选图形,确定所述光标所在的像素点落入的并被所述光标选定的待展示图形;
展示单元,用于将与所述待展示图形对应的图形数据在该图表中进行展示。
8.如权利要求7所述的装置,其特征在于,所述图表为Canvas图表。
9.如权利要求7所述的装置,其特征在于,所述装置还包括:
最大图形确定单元,用于确定所述图表中包含的最大图形;
区间确定单元,用于确定与处于所述最大图形内的各像素点对应的在所述第一坐标轴上的参照数值,得到与所述最大图形对应的参照数值变化区间;
则,所述第一范围确定单元具体用于:
根据所述第一参照数值及所述参照数值变化区间,确定与所述第一坐标轴对应的第一数值范围;其中,所述第一参照数值与所述第一数值范围的端点值之间的差值不小于所述参照数值变化区间。
10.如权利要求7所述的装置,其特征在于,所述装置还包括:
备选数量判断单元,用于判断所述备选图形集合包含的备选图形的数量是否小于或等于预设阈值;
则,所述图形确定单元具体用于:
若所述备选图形集合包含的备选图形的数量小于或等于预设阈值,基于所述备选图形集合中的各备选图形,确定所述光标所在的像素点落入的并被所述光标选定的待展示图形。
11.如权利要求10所述的装置,其特征在于,所述装置还包括:
第二数值确定单元,用于在所述备选图形集合包含的备选图形的数量大于预设阈值时,确定与光标所在的像素点对应的且在图表中的第二坐标轴上的第二参照数值;
第二范围确定单元,用于根据所述第二参照数值确定与所述第二坐标轴对应的第二数值范围;其中,所述第二参照数值处于确定的所述第二数值范围内;
第二判断单元,用于逐一判断与所述备选图形集合中的各个备选图形对应的图形数据包含的在所述第二坐标轴上的数值是否处于所述第二数值范围内;若否,将该备选图形从备选图形集合中剔除。
12.如权利要求7所述的装置,其特征在于,所述图形确定单元具体包括:
落入图形确定单元,用于基于所述备选图形集合中的各备选图形,确定所述光标所在的像素点落入的备选图形;
唯一性判断单元,用于判断所述光标所在的像素点落入的备选图形是否唯一;
待展示图形确定单元,用于在所述光标所在的像素点落入的备选图形唯一时,将所述光标所在的像素点落入的唯一的备选图形确定为待展示图形;用于在所述光标所在的像素点落入的备选图形不唯一时,将所述光标所在的像素点落入的多个备选图形中在图表中最后生成的备选图形确定为待展示图形。
CN201610127185.1A 2016-03-07 2016-03-07 图表的数据展示方法及装置 Active CN107168961B (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN201610127185.1A CN107168961B (zh) 2016-03-07 2016-03-07 图表的数据展示方法及装置

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN201610127185.1A CN107168961B (zh) 2016-03-07 2016-03-07 图表的数据展示方法及装置

Publications (2)

Publication Number Publication Date
CN107168961A CN107168961A (zh) 2017-09-15
CN107168961B true CN107168961B (zh) 2020-06-26

Family

ID=59849170

Family Applications (1)

Application Number Title Priority Date Filing Date
CN201610127185.1A Active CN107168961B (zh) 2016-03-07 2016-03-07 图表的数据展示方法及装置

Country Status (1)

Country Link
CN (1) CN107168961B (zh)

Families Citing this family (5)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN109582939B (zh) * 2017-09-29 2023-05-26 北京国双科技有限公司 一种气泡图展示方法和装置
CN109688437A (zh) * 2018-12-10 2019-04-26 未来电视有限公司 一种数据展示方法、装置、电子设备及可读存储介质
CN110189345A (zh) * 2019-04-28 2019-08-30 浙江大学 一种数据图中数据点坐标信息的提取方法
CN113805782A (zh) * 2020-06-16 2021-12-17 阿里巴巴集团控股有限公司 对象设定方法及装置、电子设备、存储介质
CN114816202B (zh) * 2022-05-09 2024-06-11 广州市易工品科技有限公司 tab组件里的图表跨界交互方法、装置、设备及介质

Citations (1)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN105373522A (zh) * 2014-08-22 2016-03-02 商业对象软件有限公司 基于手势的图表上的数据筛选

Family Cites Families (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
JP2007034497A (ja) * 2005-07-25 2007-02-08 Hitachi Software Eng Co Ltd 蛋白質両親媒性二次構造領域の検索方法及び装置
CN102855132B (zh) * 2011-06-30 2016-01-20 大族激光科技产业集团股份有限公司 一种图形对象的选取方法及系统
CN103473814B (zh) * 2013-09-23 2016-01-20 电子科技大学中山学院 一种基于gpu的三维几何图元拾取方法

Patent Citations (1)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN105373522A (zh) * 2014-08-22 2016-03-02 商业对象软件有限公司 基于手势的图表上的数据筛选

Also Published As

Publication number Publication date
CN107168961A (zh) 2017-09-15

Similar Documents

Publication Publication Date Title
CN107168961B (zh) 图表的数据展示方法及装置
US20160275647A1 (en) Dynamic Image Presentation
US20180101295A1 (en) System for displaying elements of a scrollable list
US9111327B2 (en) Transforming graphic objects
CN109324796B (zh) 界面布局方法及装置
US9754392B2 (en) Generating data-mapped visualization of data
CN107885713B (zh) 文件格式转换方法、装置、设备和存储介质
US10319129B2 (en) Snapping line generation
CN106611401B (zh) 一种在纹理内存中存储图像的方法及装置
US11561637B2 (en) Method and device of drawing handwriting track, electronic apparatus, medium, and program product
CN106569805B (zh) 一种画布存储、图形绘制方法和设备
TWI671675B (zh) 資訊顯示的方法及裝置
CN109857964B (zh) 一种页面操作的热力图绘制方法、装置、存储介质及处理器
CN108460003B (zh) 文本数据的处理方法和装置
CN115439609A (zh) 基于地图服务的三维模型渲染方法、系统、设备及介质
US9141380B2 (en) Method and system for visualization of large codebases
CN109388306B (zh) 信息显示方法及装置
CN113538623B (zh) 确定目标图像的方法、装置、电子设备及存储介质
CN107621951B (zh) 一种视图层级优化的方法及装置
CN106610824B (zh) 一种页面高度自适应的方法及装置
US20210279504A1 (en) Method and appauatus for processing feature point matching result
CN108228043A (zh) 图像数据的移动方法及装置
CN110580731B (zh) 3d文字渲染方法、介质、设备及装置
CN113918543A (zh) 图表展示方法及装置
CN114972558A (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
TR01 Transfer of patent right

Effective date of registration: 20200923

Address after: Cayman Enterprise Centre, 27 Hospital Road, George Town, Grand Cayman, British Islands

Patentee after: Innovative advanced technology Co.,Ltd.

Address before: Cayman Enterprise Centre, 27 Hospital Road, George Town, Grand Cayman, British Islands

Patentee before: Advanced innovation technology Co.,Ltd.

Effective date of registration: 20200923

Address after: Cayman Enterprise Centre, 27 Hospital Road, George Town, Grand Cayman, British Islands

Patentee after: Advanced innovation technology Co.,Ltd.

Address before: A four-storey 847 mailbox in Grand Cayman Capital Building, British Cayman Islands

Patentee before: Alibaba Group Holding Ltd.

TR01 Transfer of patent right