网页信息的展示方法和装置与流程

文档序号:13675292阅读:173来源:国知局

本发明涉及计算机技术及软件领域,尤其涉及一种网页信息的展示方法和装置。



背景技术:

在传统的对网页中采集事件的统计技术中,都会记录网页的点击等采集事件数据(例如可以包括点击发生的位置、时间等信息),然后进行汇总,最后生成一段时间内事件分布情况的描述信息。

通常做法如下:

1.向被采集网页植入一段javascript脚本;

2.当在网页中触发点击或其它预设事件时,脚本会将事件的相关信息予以记录并发送至服务器端存储;

3.服务器端将一段时间的数据进行汇总,并将其绘制成热力图图表。

但上述做法存在一定的局限性:通常情况下,网页中会存在折叠区域,比如浮层、弹窗(统称为“浮层”)。采集脚本无法识别网页中的折叠区域,从而会将折叠区域内的事件误以为是与折叠区域的坐标相同的网页上的事件。这样的浮层上的事件数据便会干扰网页整体的数据统计。



技术实现要素:

有鉴于此,本发明提供一种网页信息的展示方法和装置,能够排除网页内折叠区域对整个网页采集事件数据的干扰,并可以将浮层内的采集事件数据提取出来,单独绘制指定浮层的热力图。

为实现上述目的,根据本发明的一个方面,提供了一种网页信息的展示方法。

本发明的一种网页信息的展示方法包括:获取网页中所有浮层的唯一标示,将所述唯一标示组成集合,其中,所述网页包括整个页面和浮层;当触发采集事件时,判断所述采集事件触发的位置并记录所述采集事件的信息,其中,包括:判断所述采集事件所在的dom节点的标示是否存在于集合中,若存在,则认定所述采集事件为某浮层的私有事件,并记录所述私有事件的信息,若不存在,则认定所述采集事件为整个页面的一般事件,并记录所述一般事件的信息;以及根据所述一般事件的信息绘制整个页面的热力图和/或根据所述私有事件的信息绘制浮层的热力图。

可选地,所述方法还包括:在获取网页中所有浮层的唯一标示之前,判断所述网页是否是采集样本。

可选地,所述方法还包括:在判断所述采集事件发生的位置并记录所述采集事件的信息之前,判断触发采集事件的访客是否为采集样本。

可选地,记录所述私有事件的信息包括:将所述私有事件触发的点的全局坐标换算成以其所在浮层的顶点为原点的相对坐标。

可选地,所述方法还包括:若所述采集事件被认定为某浮层的私有事件,则不再被认定为整个页面的一般事件。

为实现上述目的,根据本发明的另一方面,提供了一种网页信息的展示装置。

本发明的一种网页信息的展示装置包括:获取模块,用于获取网页中所有浮层的唯一标示,将所述唯一标示组成集合,其中,所述网页包括整个页面和浮层;记录模块,用于当触发采集事件时,判断所述采集事件触发的位置并记录所述采集事件的信息,其中,包括:判断所述采集事件所在的dom节点的标示是否存在于集合中,若存在,则认定所述采集事件为某浮层的私有事件,并记录所述私有事件的信息,若不存在,则认定所述采集事件为整个页面的一般事件,并记录所述一般事件的信息;以及绘制模块,用于根据所述一般事件的信息绘制整个页面的热力图和/或根据所述私有事件的信息绘制浮层的热力图。

可选地,所述获取模块还用于:在获取网页中所有浮层的唯一标示之前,判断所述网页是否是采集样本。

可选地,所述记录模块还用于:在判断所述采集事件发生的位置并记录所述采集事件的信息之前,判断触发采集事件的访客是否为采集样本。

可选地,所述记录模块还用于:将所述私有事件触发的点的全局坐标换算成以其所在浮层的顶点为原点的相对坐标。

可选地,所述记录模块还用于:若所述采集事件被认定为某浮层的私有事件,则不再被认定为整个页面的一般事件。

根据本发明的技术方案,通过配置,可以识别浮层,避免浮层上的采集事件对整个页面采集事件统计的干扰,从而得到准确的网页热力图;同时,还可以单独获得某一个浮层的热力图,为统计分析提供依据;通过在获取数据前对网页进行采集样本的识别,以及在记录采集事件的数据之前,对触发采集事件的访客是否是采集样本的识别,从而可以避免统计和计算的浪费;通过将私有事件的坐标换算成以所在浮层的顶点为原点的坐标,从而可以准确的统计整个网页或某个浮层的热力图,避免点错位的现象的发生;通过在认定某采集事件为浮层的私有事件后,不再被认定为整个页面的一般事件,从而能准确的避免浮层采集事件对整个网页采集事件统计的干扰。

附图说明

附图用于更好地理解本发明,不构成对本发明的不当限定。其中:

图1是根据本发明实施例的网页信息的展示方法的主要步骤的示意图;

图2是根据本发明实施例的网页信息的展示装置的主要部分的示意图。

具体实施方式

以下结合附图对本发明的示范性实施例做出说明,其中包括本发明实施例的各种细节以助于理解,应当将它们认为仅仅是示范性的。因此,本领域普通技术人员应当认识到,可以对这里描述的实施例做出各种改变和修改,而不会背离本发明的范围和精神。同样,为了清楚和简明,以下的描述中省略了对公知功能和结构的描述。

图1是根据本发明实施例的一种网页信息的展示方法的主要步骤的示意图。

如图1所示,本发明实施例的一种网页信息的展示方法主要包括:

步骤s11:获取网页中所有浮层的唯一标示,将所述唯一标示组成集合,其中,所述网页包括整个页面和浮层。本步骤是为了将网页中的浮层与网页中的整个网页页面加以区分。

但在步骤s11之前,本发明实施例的网页信息的展示方法还包括:在获取网页中所有浮层的唯一标示之前,判断所述网页是否是采集样本。若所述网页是采集样本,则向网页的document对象植入脚本,进行网页中浮层的唯一标示的获取及热力图绘制等处理。网页中的脚本指的是在网页中执行的程序,如网页中有一个按钮,用户希望通过点击它,让网页弹出一个对话框等,实现此功能须通过向网页中植入脚本来实现,原则上只要性能允许,可以向网页中植入多个脚本。

获取网页中所有浮层的唯一标示,可以作如下理解:以电子商务网页为例,当用户访问某电子商务网页时,若鼠标悬停在例如“家居、家装”等类似条目时,会出现一个“区域”覆盖在网页的部分位置上,那么这个“区域”便成为“浮层”。通常情况下,浮层或弹窗(以下统称为“浮层”)的层级较其他一般网页的层级高,即浮层的出现会遮挡整个网页页面的部分区域。并且,在一个页面中,浮层可能有多个。例如,鼠标悬停在“家用电器”等其他条目上,又会出现一个新的浮层。所以对这些浮层,可以通过它们的唯一标示加以区分,以便于让植入的脚本可以识别各个浮层。

本发明实施例中,预先获取网页中所有的浮层元素的唯一标示,并将这些唯一标示组成一个集合(下文简称标示集合a)。其中,这个唯一标示可以包括:dom元素的id(dom的唯一标示),dom元素的xpath,其他为dom元素增加新的特殊属性。

在步骤s11获取浮层唯一标示之后,从步骤s12进行处理。

步骤s12:当触发采集事件时,判断所述采集事件触发的位置并记录所述采集事件的信息,其中,包括:判断所述采集事件所在的dom节点的标示是否存在于集合中,若存在,则认定所述采集事件为某浮层的私有事件,并记录所述私有事件的信息,若不存在,则认定所述采集事件为整个页面的一般事件,并记录所述一般事件的信息。本步骤的目的是为了根据采集事件触发位置的不同,将采集事件区分为整个网页的一般事件和某一浮层的私有事件,并分别记录私有事件和一般事件的信息。

其中,采集事件可以依据采集需求而定,例如可以是点击,此外,还可以是鼠标滚轮滚动、鼠标长时间悬停或一些键盘按键事件。

记录所述私有事件的信息包括:将所述私有事件触发的点的全局坐标换算成以其所在浮层的顶点为原点的相对坐标。

若所述采集事件被认定为某浮层的私有事件,则不再被认定为整个页面的一般事件。

同样地,本发明实施例的网页信息的展示方法中,在步骤s12判断所述采集事件发生的位置并记录所述采集事件的信息之前,判断触发采集事件的访客是否为采集样本。此规则包括且不限于使用hashid或其他散列方法。如前所述,同样是采用植入脚本的方式进行判断,此处不再赘述。例如,与前述网页是否为采集样本结合,可以进行如下设置:采集样本为18-20岁的男性在网页b上的点击分布。则采集样本有两个条件,一个是18-20岁男性,另一个是当前页面必须是网页b。当两个都满足,则它的点击数据才被统计。

当触发采集事件时,判断所述采集事件触发的位置并记录所述采集事件的信息。即首先判断采集事件是在哪个位置被触发的。判断过程如下所述:先获取事件在哪个dom节点;判断此dom节点的唯一标示是否存在于标示集合a中任意一个子节点内,如果判断结果为“是”,则该事件为标示集合a中包含触发事件元素的子元素(即某一浮层)的私有事件,(子元素为标示集合a中的一员),且私有事件的全局坐标会被换算成相对于子元素上某一顶点(例如左上点)为原点的相对坐标,且事件不再会被页面其他区域捕捉,如果判断结果为“否”则该事件为整个页面的一般事件,事件的坐标为相对于整个页面的坐标。

将私有事件的全局坐标换算成相对于子元素的顶点(例如左上点)为原点的相对坐标的考虑是:如果要采集整个页面的一般事件的数据,那么就需要以整个页面的顶点(例如左上点)作为原点;如果采集某个浮层的私有事件的数据,那么就需要换算成以某个浮层的顶点(例如左上点)为原点的数据,否则在热力图绘制和展示时就会出现错位。

此外,本发明实施例中,私有事件不再会被网页其他区域捕捉。若某一点被作为某一浮层c的私有事件记录,此时javascript的事件机制会向外层广播,当广播到浮层c时,事件广播被终止掉,否则会出现两条数据,一条是相对浮层c的相对坐标,另一条是相对整个网页的全局坐标如此,数据就会失真,因为第二条数据是多余的。

上述采集事件通过判断区分后,将采集事件的数据进行记录:向服务器发送采集事件的相关信息。事件的相关信息包括但不限于:事件的类型、事件是否为某个元素的私有事件、事件发生的坐标(如果是某个元素的私有事件,则坐标是相对于该元素的,如果是页面一般事件,则坐标是相对与整体网页的)、根据上下文获取的其他数据(关于提交的其他数据可以自定义,根据事件的不同,其他数据可能也不尽相同。比如在点击事件中,关键的数据是点击发生的x、y,但是在长按事件中除了x、y,还需要发送长按的时间)。

经过一段时间的采集后,通过服务器汇总,返回这一段时间数据。返回的数据有如下特征:1)可通过参数,单独获取整个页面的采集事件数据,或标示集合a中某一子元素的采集事件数据;2)子元素的采集事件数据和整个页面的采集事件数据的坐标原点是不同的。

步骤s13:根据所述一般事件的信息绘制整个页面的热力图和/或根据所述私有事件的信息绘制浮层的热力图。

经过前述步骤,网页中采集事件的数据被记录下来,接下来对网页的热力图进行绘制。热力图的展示方法可以采用canvas标签,此外还可以利用webgl或者svg等展示方法。本发明实施例中,对网页热力图的绘制采利用iframe创建底图,在底图上利用canvas绘制热力图的方式进行。

a)本发明实施例中,绘制整个页面的热力图时,可以采取如下步骤:从服务器获取整个页面的采集事件数据;

b)向热力图页面植入iframe标签,将iframe的src属性设置为数据的来源url(例如电商网站的热力图,就可以是电商网站的网址),此步骤是指用此iframe设置热力图显示的底图;

c)创建canvas标签并将其覆盖在创建好的iframe上;

d)在canvas上绘制整个网页的热力图图像。

绘制标示集合a中子元素(即某浮层)的热力图绘制时,可以采取如下步骤:

a)从服务器获取标示集合a中某子元素的采集事件数据;

b)向热力图页面植入iframe标签,将iframe的src属性设置为数据的来源url;

c)向iframe中植入javascript脚本,该脚本有如下功能:使用javascript定时器,周期时间内判断标示集合a中的所有子元素是否出现在iframe内,如果出现,则找到该子元素,向子元素内部置入一个canvas标签,并将canvas置于该子元素顶部(即视觉上它可以覆盖子元素)。即在位于下层的iframe里插入canvas,制造出局部的上下叠加的效果。

根据本发明实施例的网页信息的展示方法可以看出,通过配置,可以识别浮层,避免浮层上的采集事件对整个页面采集事件统计的干扰,从而得到准确的网页热力图;同时,还可以单独获得某一个浮层的热力图,为统计分析提供依据;通过在获取数据前对网页进行采集样本的识别,以及在记录采集事件的数据之前,对触发采集事件的访客是否是采集样本的识别,从而可以避免统计和计算的浪费;通过将私有事件的坐标换算成以所在浮层的顶点为原点的坐标,从而可以准确的统计整个网页或某个浮层的热力图,避免点错位的现象的发生;通过在认定某采集事件为浮层的私有事件后,不再被认定为整个页面的一般事件,从而能准确的避免浮层采集事件对整个网页采集事件统计的干扰。

图2是根据本发明实施例的网页信息的展示装置的主要部分的示意图。

如图2所示,本发明实施例的网页信息的展示装置20主要包括如下部分:获取模块201、记录模块202以及绘制模块203,其中:

获取模块201用于获取网页中所有浮层的唯一标示,将唯一标示组成集合,其中,网页包括整个页面和浮层;记录模块202用于当触发采集事件时,判断所述采集事件触发的位置并记录采集事件的信息,其中,包括:判断所述采集事件所在的dom节点的标示是否存在于集合中,若存在,则认定采集事件为某浮层的私有事件,并记录私有事件的信息,若不存在,则认定采集事件为整个页面的一般事件,并记录一般事件的信息;以及绘制模块203用于根据一般事件的信息绘制整个页面的热力图和/或根据所述私有事件的信息绘制浮层的热力图。

其中,获取模块201还可用于:在获取网页中所有浮层的唯一标示之前,判断所述网页是否是采集样本。

记录模块202还可用于:在判断所述采集事件发生的位置并记录采集事件的信息之前,判断触发采集事件的访客是否为采集样本。

此外,记录模块202还可用于:将私有事件触发的点的全局坐标换算成以其所在浮层的顶点为原点的相对坐标。

记录模块202还可用于:若采集事件被认定为某浮层的私有事件,则不再被认定为整个页面的一般事件。

从以上描述可以看出,通过配置,可以识别浮层,避免浮层上的采集事件对整个页面采集事件统计的干扰,从而得到准确的网页热力图;同时,还可以单独获得某一个浮层的热力图,为统计分析提供依据;通过在获取数据前对网页进行采集样本的识别,以及在记录采集事件的数据之前,对触发采集事件的访客是否是采集样本的识别,从而可以避免统计和计算的浪费;通过将私有事件的坐标换算成以所在浮层的顶点为原点的坐标,从而可以准确的统计整个网页或某个浮层的热力图,避免点错位的现象的发生;通过在认定某采集事件为浮层的私有事件后,不再被认定为整个页面的一般事件,从而能准确的避免浮层采集事件对整个网页采集事件统计的干扰。

上述具体实施方式,并不构成对本发明保护范围的限制。本领域技术人员应该明白的是,取决于设计要求和其他因素,可以发生各种各样的修改、组合、子组合和替代。任何在本发明的精神和原则之内所作的修改、等同替换和改进等,均应包含在本发明保护范围之内。

当前第1页1 2 
网友询问留言 已有0条留言
  • 还没有人留言评论。精彩留言会获得点赞!
1