CN111125590B - 一种绘制热力图的方法及装置 - Google Patents

Abstract

本发明公开了一种绘制热力图的方法及装置，涉及互联网技术领域，提高绘制热力图的准确性，本发明的主要技术方案为：获取目标页面对应点击事件的点击数据，点击数据至少包括：点击事件对应点击目标元素的点击位置；确定目标元素对应的元素块尺寸，元素块为所述目标元素发生点击事件时对应的有效点击区域；根据点击位置和所述元素块尺寸，计算相对偏移量；在网页底图上查找目标元素的位置，网页底图与目标页面具有相同的网页内容信息；根据在网页底图上查找到的目标元素的位置、相对偏移量，确定点击事件在网页底图上对应的实际点击位置；根据实际点击位置在网页底图上绘制点击事件对应的热力图。本发明应用于基于网页元素的位置绘制热力图。

Description

一种绘制热力图的方法及装置

技术领域

本发明涉及互联网技术领域，尤其涉及一种绘制热力图的方法及装置。

背景技术

在对网站上用户的点击行为进行分析时，可以选取一个网页的截图作为底图，将在该网页上监听到的大量点击事件对应的点击位置数据绘制在该底图上，从而渲染成一张热力图，用于将不同用户在该网页上发生的对应点击行为以可视化的形式呈现在该底图上，如此清楚的展示该网页上不同位置引起用户关注的程度，这将有助于对网站分析研究。

目前，对于现有的绘制热力图的方法，在收集一个网页上的点击位置数据时，是以浏览器显示窗口的左上角位置为坐标原点，在该网页上采集一个点击事件对应的实际点击落点相对于该坐标原点的固定坐标值，该固定坐标值就是对应的点击位置数据。

然而，在绘制热力图时，是需要将具有相同网页内容信息的大量网页对应的点击位置数据汇总到一张底图上，由于不同的用户使用的浏览器窗口尺寸很可能是存在差异的，如此内容相同的网页对应的显示尺寸也将是存在差异的，因而在绘制热力图时，若仅将内容相同但是尺寸不同的大量网页上对应的点击位置数据统计到一张底图上，那么对于同一个点击事件，在底图上对应的点击位置和在原网页上对应的点击位置所分别对应指示的内容信息可能是完全不同的，这将导致最终绘制的热力图不能真实的还原用户在原网页上的点击行为，绘制的热力图是不准确的。

发明内容

有鉴于此，本发明提供一种绘制热力图的方法及装置，主要目的在于基于网页元素位置优化绘制热力图的方法，以在绘制热力图时能够准确地还原用户的点击行为，进而提高绘制热力图的准确性。

为了解决上述问题，本发明主要提供如下技术方案：

一方面，本发明提供了一种绘制热力图的方法，该方法包括：

获取目标页面对应点击事件的点击数据，所述点击数据至少包括：所述点击事件对应点击的目标元素的点击位置；

确定目标元素对应的元素块尺寸，所述元素块为所述目标元素发生点击事件时对应的有效点击区域；

根据所述点击位置和所述元素块尺寸，计算相对偏移量；

在网页底图上查找所述目标元素的位置，所述网页底图与所述目标页面具有相同的网页内容信息；

根据在所述网页底图上查找到的所述目标元素的位置、所述相对偏移量，确定所述点击事件在所述网页底图上对应的实际点击位置；

根据所述实际点击位置在所述网页底图上绘制所述点击事件对应的热力图。

可选的，所述根据所述点击位置和所述元素块尺寸，计算相对偏移量，包括：

根据所述元素块尺寸，确定所述元素块的中心点位置；

计算所述点击位置和所述中心点位置之间的相对偏移量；和/或，

所述根据在所述网页底图上查找到的所述目标元素的位置、所述相对偏移量，确定所述点击事件在所述网页底图上对应的实际点击位置，包括：

获取所述目标页面上所述目标元素对应的元素块尺寸；

根据所述网页底图对应的文档对象模型结构，在所述网页底图上获取所述目标元素对应的元素块的尺寸；

根据所述目标页面上所述元素块的尺寸与所述网页底图上所述元素块的尺寸，计算得到对应尺寸的缩放比；

根据所述缩放比，对所述相对偏移量进行缩小或放大，得到在所述网页底图上所述目标元素的位置与所述实际点击位置的实际相对偏移量；

在所述网页底图上根据所述目标元素的位置以及所述实际相对偏移量，计算所述点击事件对应的实际点击位置。

可选的，在所述在网页底图上查找所述目标元素的位置之前，所述方法还包括：

获取所述网页底图对应的文档对象模型结构的路径；

判断所述文档对象模型结构的路径中是否存在所述目标元素对应的父元素；

若否，则确定在所述网页底图上不存在所述目标元素，并确定所述点击事件不是对应于发生在所述网页底图上的点击事件，将所述点击事件标记为无效点击事件。

可选的，若所述文档对象模型结构的路径中存在所述目标元素对应的父元素，所述方法还包括：

获取所述父元素内的索引，所述索引用于指示所述目标元素在所述父元素内的位置；

根据所述索引在所述网页底图上查找是否存在所述目标元素；

若存在，则确定所述点击事件是发生在所述网页底图上的点击事件，将所述点击事件标记为有效点击事件；

若不存在，则确定所述点击事件不是对应于发生在所述网页底图上的点击事件，将所述点击事件标记为无效点击事件。

可选的，在获取目标页面对应点击事件的点击数据之后，所述方法还包括：

若校验所述点击数据中不包含所述点击事件对应点击的目标元素，则确定所述点击事件是无效点击事件；和/或，

若检测在所述目标页面上未发生对应所述点击事件的页面跳转，则确定所述点击事件是无效点击事件。

为了实现上述目的，根据本发明的另一方面，提供了一种存储介质，所述存储介质包括存储的程序，其中，在所述程序运行时控制所述存储介质所在设备执行上述所述的绘制热力图的方法。

为了实现上述目的，根据本发明的另一方面，提供了一种处理器，所述处理器用于运行程序，其中，所述程序运行时执行上述所述的绘制热力图的方法。

另一方面，本发明还提供了一种绘制热力图的装置，该装置包括：

获取单元，用于获取目标页面对应点击事件的点击数据，所述点击数据至少包括：所述点击事件对应点击的目标元素的点击位置；

确定单元，用于确定目标元素对应的元素块尺寸，所述元素块为所述目标元素发生点击事件时对应的有效点击区域；

计算单元，用于根据所述获取单元获取到的点击位置和所述确定单元确定的元素块尺寸，计算相对偏移量；

查找单元，用于在网页底图上查找所述目标元素的位置，所述网页底图与所述目标页面具有相同的网页内容信息；

所述确定单元，还用于根据在所述网页底图上所述查找单元查找到的所述目标元素的位置、所述计算单元计算的相对偏移量，确定所述点击事件在所述网页底图上对应的实际点击位置；

绘制单元，用于根据所述确定单元确定的实际点击位置在所述网页底图上绘制所述点击事件对应的热力图。

可选的，所述计算单元包括：

确定模块，用于根据所述元素块尺寸，确定所述元素块的中心点位置；

计算模块，用于计算所述点击位置和所述确定模块确定的中心点位置之间的相对偏移量；

所述确定单元包括：

获取模块，用于获取所述目标页面上所述目标元素对应的元素块尺寸；

所述获取模块，还用于根据所述网页底图对应的文档对象模型结构，在所述网页底图上获取所述目标元素对应的元素块的尺寸；

计算模块，用于根据所述所述获取模块获取到的目标页面上所述元素块的尺寸与所述所述获取模块获取到的网页底图上所述元素块的尺寸，计算得到对应尺寸的缩放比；

确定模块，用于根据所述计算模块计算得到的缩放比，对所述相对偏移量进行缩小或放大，得到在所述网页底图上所述目标元素的位置与所述实际点击位置的实际相对偏移量；

所述计算模块，还用于在所述网页底图上根据所述目标元素的位置以及所述实际相对偏移量，计算所述点击事件对应的实际点击位置。

可选的，所述装置还包括：

所述获取单元，用于在所述在网页底图上查找所述目标元素的位置之前，获取所述网页底图对应的文档对象模型结构的路径；

判断单元，用于判断所述获取单元获取到的文档对象模型结构的路径中是否存在所述目标元素对应的父元素；

所述确定单元，用于当所述判断单元判断所述文档对象模型结构的路径中不存在所述目标元素对应的父元素时，则确定在所述网页底图上不存在所述目标元素，并确定所述点击事件不是对应于发生在所述网页底图上的点击事件；

标记单元，用于将所述点击事件标记为无效点击事件。

可选的，所述装置还包括：

所述获取单元，用于若所述文档对象模型结构的路径中存在所述目标元素对应的父元素，则获取所述父元素内的索引，所述索引用于指示所述目标元素在所述父元素内的位置；

所述查找单元，用于根据所述索引在所述网页底图上查找是否存在所述目标元素；

所述确定单元，还用于当所述查找单元根据所述索引在所述网页底图上查找到所述目标元素时，确定所述点击事件是发生在所述网页底图上的点击事件；

所述标记单元，还用于将所述点击事件标记为有效点击事件；

所述确定单元，用于当所述查找单元根据所述索引在所述网页底图上查找不到所述目标元素时，确定所述点击事件不是对应于发生在所述网页底图上的点击事件；

所述标记单元，还用于将所述点击事件标记为无效点击事件。

可选的，所述装置还包括：

在获取目标页面对应点击事件的点击数据之后，所述方法还包括：

校验单元，用于在获取目标页面对应点击事件的点击数据之后，若校验所述点击数据中不包含所述点击事件对应点击的目标元素，则确定所述点击事件是无效点击事件；

所述校验单元，还用于在获取目标页面对应点击事件的点击数据之后，若检测在所述目标页面上未发生对应所述点击事件的页面跳转，则确定所述点击事件是无效点击事件。

借由上述技术方案，本发明提供的技术方案至少具有下列优点：

本发明提供的一种绘制热力图的方法及装置，本发明是利用在目标页面上确定的点击事件对应的点击位置与被点击的目标元素位置之间的相对偏移量，来确定该点击事件在内容相同的网页底图上对应的实际点击位置，进而达到虽然网页底图与目标页面的尺寸不同但是也可以在网页底图上还原在目标页面上的点击行为，也就是，对于同一点击事件，确保网页底图上的实际点击位置指示的内容信息与在目标页面上点击位置指示的内容信息是相同的。与现有技术相比，解决了现有的通过将目标页面上点击位置的固定坐标值汇总到一张网页底图上实现的绘制热力图方法导致绘制热力图不准确的问题。本发明是基于被点击的目标元素的位置来完成将内容相同的大量网页对应的点击事件汇总到一张内容相同的网页底图上，本发明不在意网页底图尺寸是否与目标页面尺寸相同，也可以在网页底图上还原目标页面上发生的用户点击行为，进而提高绘制热力图的准确性。

上述说明仅是本发明技术方案的概述，为了能够更清楚了解本发明的技术手段，而可依照说明书的内容予以实施，并且为了让本发明的上述和其它目的、特征和优点能够更明显易懂，以下特举本发明的具体实施方式。

附图说明

通过阅读下文优选实施方式的详细描述，各种其他的优点和益处对于本领域普通技术人员将变得清楚明了。附图仅用于示出优选实施方式的目的，而并不认为是对本发明的限制。而且在整个附图中，用相同的参考符号表示相同的部件。在附图中：

图1为本发明实施例提供的一种绘制热力图的方法流程图；

图2为本发明实施例提供的另一种绘制热力图的方法流程图；

图3为本发明实施例提供的一种绘制热力图的装置的组成框图；

图4为本发明实施例提供的另一种绘制热力图的装置的组成框图。

具体实施方式

下面将参照附图更详细地描述本发明的示例性实施例。虽然附图中显示了本发明的示例性实施例，然而应当理解，可以以各种形式实现本发明而不应被这里阐述的实施例所限制。相反，提供这些实施例是为了能够更透彻地理解本发明，并且能够将本发明的范围完整的传达给本领域的技术人员。

本发明实施例提供了一种绘制热力图的方法，如图1所示，该方法是利用在目标页面上确定的点击事件对应的点击位置与被点击的目标元素位置之间的相对偏移量，来确定该点击事件在内容相同的网页底图上对应的实际点击位置，进而根据该实际点击位置绘制热力图更加准确，对此本发明实施例提供以下具体步骤：

101、获取目标页面对应点击事件的点击数据。

其中，点击事件可以包括但不限于是鼠标点击事件、触屏点击事件。点击数据可以包括：点击事件对应点击目标元素的点击位置。该点击位置可以是：以浏览器显示窗口的左上角位置为坐标原点，获取点击事件在目标页面上的实际点击落点相对于上述坐标原点的坐标值，该坐标值指示的位置就是点击事件对应的点击位置。

在本发明实施例中，可以在目标网站中插入一个脚本文件，用于监控用户在网页上的点击事件，从而获取点击事件对应的点击数据，本步骤相当于是数据收集，对于本发明实施例，是利用上述的脚本文件收集具有相同网页内容信息的大量目标页面上分别对应的点击事件的点击数据，需要说明的是，该大量目标页面可以是来自于不同浏览器窗口、不同终端。

102、确定目标元素对应的元素块尺寸。

其中，元素块为目标元素发生点击事件时对应的有效点击区域。

在本发明实施例中，对于一个目标页面，通过解析其源代码可以获知网页结构，也就是可以获知网页的内容以及样式，所以在本发明实施例中当确定点击事件对应的目标元素时，可以通过解析网页的源代码，比如：超级文本标记语言(HyperText MarkupLanguage，HTML)、层叠样式表(Cascading Style Sheets，CSS)以及写入的JS脚本等等，进而确定被点击的目标元素在目标页面中的样式。而目标元素的样式，简而言之，对应的就是元素块，比如：在360导航首页中，目标元素是文本信息“天猫”，但是可以看到在该网页中该目标元素的字体、颜色、在目标页面中的位置以及通过点击测试也可以获知该目标元素是对应一定的有效点击区域的，等等。上述所指的就是目标元素的样式，再者，从编写网页代码的角度，根据CSS，目标元素是被放进一个盒子模型，利用这个盒子模型，CSS可以控制网页上每个目标元素的排版样式，相应的，包含目标元素的盒子就是对应的元素块。

在本发明实施例中，当在目标页面中监控到用户的点击事件时，获取对应被点击的目标元素，通过解析目标页面的代码，比如：HTML文件、CSS文件、JS文件等等，可以获知目标元素对应的元素块的位置与尺寸。

103、根据点击位置和元素块尺寸，计算相对偏移量。

在本发明实施例中，在目标页面上，根据点击事件对应点击位置、元素块的位置与尺寸，可以计算点击事件对应的点击位置与被点击的目标元素位置之间的相对偏移量，该相对偏移量用于指示点击位置与目标元素位置的相对距离，通过分析具有网页内容信息的大量目标页面可知，虽然目标页面的尺寸可能存在差异，但是点击位置与被点击目标元素位置之间的相对偏移量几乎是相差不大的、甚至可以是相同的，所以在本步骤通过计算来获取这个相对偏移量，以便后续根据这个相对偏移量来在具有相同网页内容信息的网页底图上确定点击事件对应的实际点击位置，可以确保实际点击位置在目标元素对应的元素块内，同时也尽可能地还原目标页面中点击位置与目标元素位置之间的相对位置关系，从而可以准确地还原目标页面上发生的点击行为。

104、在网页底图上查找目标元素的位置。

其中，网页底图与目标页面具有相同的网页内容信息。

在本发明实施例中，由于网页底图与目标页面具有相同的内容信息，也就是，网页底图与目标页面是相同网页，也具有相同的网页结构，所以可以通过解析目标页面的源代码来获知目标元素在目标页面中的位置，来间接地分析目标元素在网页底图中的位置，具体的方法，本发明实施例不做限定。

105、根据在网页底图上查找到的目标元素的位置、相对偏移量，确定点击事件在网页底图上对应的实际点击位置。

在本发明实施例中，是将具有相同网页内容信息的大量目标页面上分别对应的点击事件汇总到一张网页底图上，由于实质上网页底图与目标页面是相同网页，所以，在网页底图上根据目标元素的位置、相对偏移量，可以简单、便捷地确定在网页底图上点击事件对应的实际点击位置，进而确保在网页底图上确定的实际点击位置指示的内容信息仍然是目标元素，如此还原了目标页面上点击行为。

106、根据实际点击位置在网页底图上绘制点击事件对应的热力图。

在本发明实施例中，在准确地确定了网页底图上点击事件对应的实际点击位置之后，利用该实际点击位置来绘制热力图，提高绘制热力图的准确性。在本发明实施例中，可以根据实际点击位置在网页底图上的坐标值来绘制热力图，具体的绘制步骤，本发明实施例不做限定。

本发明实施例提供的一种绘制热力图的方法，本发明实施例是利用在目标页面上确定的点击事件对应的点击位置与被点击的目标元素位置之间的相对偏移量，来确定该点击事件在内容相同的网页底图上对应的实际点击位置，进而达到虽然网页底图与目标页面的尺寸不同但是也可以在网页底图上还原在目标页面上的点击行为，也就是，对于同一点击事件，确保网页底图上的实际点击位置指示的内容信息与在目标页面上点击位置指示的内容信息是相同的。与现有技术相比，解决了现有的通过将目标页面上点击位置的固定坐标值汇总到一张网页底图上实现的绘制热力图方法导致绘制热力图不准确的问题。本发明实施例是基于被点击的目标元素的位置来完成将内容相同的大量网页对应的点击事件汇总到一张内容相同的网页底图上，本发明不在意网页底图尺寸是否与目标页面尺寸相同，也可以在网页底图上还原目标页面上发生的用户点击行为，进而提高绘制热力图的准确性。

为了对上述实施例做出更加详细的说明，本发明实施例还提供了另一种绘制热力图的方法，如图2所示，该方法是在获取到目标页面对应点击事件的点击数据之后，优先校验该点击事件是否是用户在目标页面上的无意识的点击，由于该点击事件是无意义的，因而应该从大量点击事件中被标记出，以确保后续绘制热力图的准确性，对此本发明实施例提供以下具体步骤：

201、获取目标页面对应点击事件的点击数据。

其中，点击事件对应点击目标元素的点击位置。

在本发明实施例中，对于本步骤的详细陈述，请参见步骤101，此处不再赘述。

202a、若校验点击数据中不包含点击事件对应点击的目标元素则确定点击事件是无效点击事件，和/或，若检测在目标页面上未发生对应点击事件的页面跳转则确定点击事件是无效点击事件。

在本发明实施例中，对于目标页面上的点击事件可能包含无意义的点击事件，比如：用户仅是在目标页面的空白处无意识的点击，该点击并未选中目标元素，或者也并未引起当前目标页面发生跳转，等等，所以类似这样的点击事件相当于是无效点击事件。由于上述的无效点击事件并未反映用户真实的点击意图，因而应该从获取到的大量点击事件中被标记出，以便在绘制热力图时加以区分，如此提高绘制热力图的准确性。

202b、若验证点击事件是有效点击事件，则确定目标元素对应的元素块尺寸。

其中，元素块为目标元素发生点击事件时对应的有效点击区域。

在本发明实施例中，在验证点击事件是有效点击事件之后，则获取在目标页面中点击事件对应的目标元素，进而确定对应的元素块尺寸，对本步骤的详细陈述，请参见步骤102，此处不再赘述

203b、根据点击位置和元素块尺寸，计算相对偏移量。

在本发明实施例中，在目标页面上根据点击位置和元素块尺寸计算相对偏移量的具体方法做进一步的详细说明，如下：

首先，可以在目标页面上根据元素块尺寸，确定元素块的中心点位置，比如：通过对源代码的解析以及利用相关运算，在目标页面中可以获知元素块的4个点坐标，A(300，200)、B(322，200)、C(300，214)、D(322，214)，上述4个坐标点组成一个矩形块，计算该矩形块的中心点位置坐标得到(311，207)；然后，在根据点击位置的坐标值与中心点位置坐标值进行相关运算来求解两个坐标值之间的距离，就是相对偏移量。

204b、在网页底图上查找目标元素的位置。

在本发明实施例中，在网页底图上查找目标元素的位置之前，需要验证在网页底图上是否存在该目标元素，这是因为若点击目标页面中隐藏的下拉菜单中的目标元素时，实质上该目标元素是不存在于目标页面，而是准确地说存在于隐藏的下拉菜单中，所以在本发明实施例中有必要校验点击事件是否是发生在目标页面中的点击事件，若不是，则有必要对其标记，以与其他发生在目标页面中的点击事件加以区分，如此可以避免出现在网页底图上绘制热力图时直接将点击隐藏目标元素对应的点击事件也进行绘制但是并未加以区分，导致绘制热力图不准确的问题。

具体的，可以根据点击事件对应的目标元素所在的文档对象模型(DocumentObject Model，DOM)来验证被点击的目标元素是否是存在目标页面中，验证的步骤可以如下：

首先，获取网页底图对应的DOM路径，其次，判断DOM路径中是否存在目标元素对应的父元素，若不存在，则确定在网页底图上不存在目标元素，并确定点击事件不是对应于发生在网页底图上的点击事件，比如该点击事件可能是点击隐藏下拉菜单中的元素，将点击事件标记为无效点击事件，在此“无效点击事件”是指因点击的不是目标页面中的目标元素，所以点击行为对该目标页面没有作用。

需要说明的是，上述提及的是查找目标元素的父元素，是因为在DOM路径中目标元素对应的节点是“文档节点”，而其父元素是“元素节点”也就是元素块，并且一个父元素对应的父节点下可能存在多个子节点，如此通过查找DOM路径中目标元素的父元素，可以减少查找的工作量，若其父元素都不存在，则不必再查找目标元素了。

进一步的，若所文档对象模型结构的路径中存在目标元素对应的父元素，对于验证网页底图上是否存在目标元素的步骤，进一步陈述，如下：

首先，获取父元素内的索引，该索引用于指示目标元素在所述父元素内的位置，其次，根据索引在网页底图上查找是否存在目标元素，若存在，则确定点击事件是发生在网页底图上的点击事件，将点击事件标记为有效点击事件。但是，若不存在，则确定点击事件不是对应于发生在网页底图上的点击事件，将点击事件标记为无效点击事件。

205b、根据在网页底图上查找到的目标元素的位置、相对偏移量，确定点击事件在网页底图上对应的实际点击位置。

在本发明实施例中，对在网页底图上确定实际点击位置的具体步骤，陈述如下：

首先，获取目标页面上目标元素对应的元素块尺寸。其次，根据网页底图对应的DOM路径，在网页底图上获取目标元素的位置并综合网页底图的尺寸，在网页底图上获取目标元素对应的元素块尺寸。再后，通过将目标页面上元素块的尺寸与网页底图上元素块的尺寸进行比较，计算得到对应尺寸的缩放比，进而根据缩放比，对相对偏移量进行缩小或放大，得到在网页底图上目标元素的位置与实际点击位置的实际相对偏移量。最后，在获知网页底图上目标元素的位置以及实际相对偏移量，计算点击事件对应的实际点击位置。

206b、根据实际点击位置在网页底图上绘制点击事件对应的热力图。

在本发明实施例中，对于本步骤的陈述，请参见步骤106，此处不再赘述。

为了实现上述目的，根据本发明的另一方面，本发明实施例还提供了一种存储介质，所述存储介质包括存储的程序，其中，在所述程序运行时控制所述存储介质所在设备执行上述所述的绘制热力图的方法。

为了实现上述目的，根据本发明的另一方面，本发明实施例还提供了一种处理器，所述处理器用于运行程序，其中，所述程序运行时执行上述所述的绘制热力图的方法。

进一步的，作为对上述图1、图2所示方法的实现，本发明实施例提供了一种绘制热力图的装置。该装置实施例与前述方法实施例对应，为便于阅读，本装置实施例不再对前述方法实施例中的细节内容进行逐一赘述，但应当明确，本实施例中的装置能够对应实现前述方法实施例中的全部内容。该装置应用于基于目标元素的位置在网页底图上绘制点击事件对应的热力图，具体如图3所示，该装置包括：

获取单元31，用于获取目标页面对应点击事件的点击数据，所述点击数据至少包括：所述点击事件对应点击的目标元素的点击位置；

确定单元32，用于确定目标元素对应的元素块尺寸，所述元素块为所述目标元素发生点击事件时对应的有效点击区域；

计算单元33，用于根据所述获取单元31获取到的点击位置和所述确定单元32确定的元素块尺寸，计算相对偏移量；

查找单元34，用于在网页底图上查找所述目标元素的位置，所述网页底图与所述目标页面具有相同的网页内容信息；

所述确定单元32，还用于根据在所述网页底图上所述查找单元34查找到的所述目标元素的位置、所述计算单元33计算的相对偏移量，确定所述点击事件在所述网页底图上对应的实际点击位置；

绘制单元35，用于根据所述确定单元32确定的实际点击位置在所述网页底图上绘制所述点击事件对应的热力图。

进一步的，如图4所示，所述计算单元33包括：

确定模块331，用于根据所述元素块尺寸，确定所述元素块的中心点位置；

计算模块332，用于计算所述点击位置和所述确定模块331确定的中心点位置之间的相对偏移量；

进一步的，如图4所示，所述确定单元32包括：

获取模块321，用于获取所述目标页面上所述目标元素对应的元素块尺寸；

所述获取模块321，还用于根据所述网页底图对应的文档对象模型结构，在所述网页底图上获取所述目标元素对应的元素块的尺寸；

计算模块322，用于根据所述所述获取模块321获取到的目标页面上所述元素块的尺寸与所述所述获取模块获取到的网页底图上所述元素块的尺寸，计算得到对应尺寸的缩放比；

确定模块323，用于根据所述计算模块322计算得到的缩放比，对所述相对偏移量进行缩小或放大，得到在所述网页底图上所述目标元素的位置与所述实际点击位置的实际相对偏移量；

所述计算模块322，还用于在所述网页底图上根据所述目标元素的位置以及所述实际相对偏移量，计算所述点击事件对应的实际点击位置。

进一步的，如图4所示，所述装置还包括：

所述获取单元31，用于在所述在网页底图上查找所述目标元素的位置之前，获取所述网页底图对应的文档对象模型结构的路径；

判断单元36，用于判断所述获取单元31获取到的文档对象模型结构的路径中是否存在所述目标元素对应的父元素；

所述确定单元32，用于当所述判断单元36判断所述文档对象模型结构的路径中不存在所述目标元素对应的父元素时，则确定在所述网页底图上不存在所述目标元素，并确定所述点击事件不是对应于发生在所述网页底图上的点击事件；

标记单元37，用于将所述点击事件标记为无效点击事件。

进一步的，如图4所示，所述装置还包括：

所述获取单元31，用于若所述文档对象模型结构的路径中存在所述目标元素对应的父元素，则获取所述父元素内的索引，所述索引用于指示所述目标元素在所述父元素内的位置；

所述查找单元34，用于根据所述索引在所述网页底图上查找是否存在所述目标元素；

所述确定单元32，还用于当所述查找单元34根据所述索引在所述网页底图上查找到所述目标元素时，确定所述点击事件是发生在所述网页底图上的点击事件；

所述标记单元37，还用于将所述点击事件标记为有效点击事件；

所述确定单元32，用于当所述查找单元34根据所述索引在所述网页底图上查找不到所述目标元素时，确定所述点击事件不是对应于发生在所述网页底图上的点击事件；

所述标记单元37，还用于将所述点击事件标记为无效点击事件。

进一步的，如图4所示，所述装置还包括：

在获取目标页面对应点击事件的点击数据之后，所述方法还包括：

校验单元38，用于在获取目标页面对应点击事件的点击数据之后，若校验所述点击数据中不包含所述点击事件对应点击的目标元素，则确定所述点击事件是无效点击事件；

所述校验单元38，还用于在获取目标页面对应点击事件的点击数据之后，若检测在所述目标页面上未发生对应所述点击事件的页面跳转，则确定所述点击事件是无效点击事件。

综上所述，本发明实施例提供的一种绘制热力图的方法及装置，本发明实施例是利用在目标页面上确定的点击事件对应的点击位置与被点击的目标元素位置之间的相对偏移量，来确定该点击事件在内容相同的网页底图上对应的实际点击位置，进而达到虽然网页底图与目标页面的尺寸不同但是也可以在网页底图上还原在目标页面上的点击行为，也就是，对于同一点击事件，确保网页底图上的实际点击位置指示的内容信息与在目标页面上点击位置指示的内容信息是相同的。与现有技术相比，解决了现有的通过将目标页面上点击位置的固定坐标值汇总到一张网页底图上实现的绘制热力图方法导致绘制热力图不准确的问题。本发明是基于被点击的目标元素的位置来完成将内容相同的大量网页对应的点击事件汇总到一张内容相同的网页底图上，本发明实施例不在意网页底图尺寸是否与目标页面尺寸相同，也可以在网页底图上还原目标页面上发生的用户点击行为，进而提高绘制热力图的准确性。此外，本发明实施例还可以验证目标页面上点击事件是否是用户无意识的点击，以及验证点击事件是否是对应于在目标页面中的有效点击行为，进而判断点击事件对于目标页面是否是无效点击事件，若是，则对其进行标记，以便在绘制热力图时加以区分，确保绘制的准确性。

所述绘制热力图的装置包括处理器和存储器，上述获取单元、确定单元、计算单元、查找单元和绘制单元等均作为程序单元存储在存储器中，由处理器执行存储在存储器中的上述程序单元来实现相应的功能。

处理器中包含内核，由内核去存储器中调取相应的程序单元。内核可以设置一个或以上，通过调整内核参数来基于网页元素位置优化绘制热力图的方法，以在绘制热力图时能够准确地还原用户的点击行为，进而提高绘制热力图的准确性。

存储器可能包括计算机可读介质中的非永久性存储器，随机存取存储器(RAM)和/或非易失性内存等形式，如只读存储器(ROM)或闪存(flashRAM)，存储器包括至少一个存储芯片。

本发明实施例提供了一种存储介质，其上存储有程序，该程序被处理器执行时实现所述绘制热力图的方法。

本发明实施例提供了一种处理器，所述处理器用于运行程序，其中，所述程序运行时执行所述绘制热力图的方法。

本发明实施例提供了一种设备，设备包括处理器、存储器及存储在存储器上并可在处理器上运行的程序，处理器执行程序时实现以下步骤：

一种绘制热力图的方法，所述方法包括：获取目标页面对应点击事件的点击数据，所述点击数据至少包括：所述点击事件对应点击目标元素的点击位置；确定目标元素对应的元素块尺寸，所述元素块为所述目标元素发生点击事件时对应的有效点击区域；根据所述点击位置和所述元素块尺寸，计算相对偏移量；在网页底图上查找所述目标元素的位置，所述网页底图与所述目标页面具有相同的网页内容信息；根据在所述网页底图上查找到的所述目标元素的位置、所述相对偏移量，确定所述点击事件在所述网页底图上对应的实际点击位置；根据所述实际点击位置在所述网页底图上绘制所述点击事件对应的热力图。

进一步的，所述根据所述点击位置和所述元素块尺寸，计算相对偏移量，包括：根据所述元素块尺寸，确定所述元素块的中心点位置；计算所述点击位置和所述中心点位置之间的相对偏移量；和/或，所述根据在所述网页底图上查找到的所述目标元素的位置、所述相对偏移量，确定所述点击事件在所述网页底图上对应的实际点击位置，包括：获取所述目标页面上所述目标元素对应的元素块尺寸；根据所述网页底图对应的文档对象模型结构，在所述网页底图上获取所述目标元素对应的元素块的尺寸；根据所述目标页面上所述元素块的尺寸与所述网页底图上所述元素块的尺寸，计算得到对应尺寸的缩放比；根据所述缩放比，对所述相对偏移量进行缩小或放大，得到在所述网页底图上所述目标元素的位置与所述实际点击位置的实际相对偏移量；在所述网页底图上根据所述目标元素的位置以及所述实际相对偏移量，计算所述点击事件对应的实际点击位置。

进一步的，在所述在网页底图上查找所述目标元素的位置之前，所述方法还包括：获取所述网页底图对应的文档对象模型结构的路径；判断所述文档对象模型结构的路径中是否存在所述目标元素对应的父元素；若否，则确定在所述网页底图上不存在所述目标元素，并确定所述点击事件不是对应于发生在所述网页底图上的点击事件，将所述点击事件标记为无效点击事件。

进一步的，若所述文档对象模型结构的路径中存在所述目标元素对应的父元素，所述方法还包括：获取所述父元素内的索引，所述索引用于指示所述目标元素在所述父元素内的位置；根据所述索引在所述网页底图上查找是否存在所述目标元素；若存在，则确定所述点击事件是发生在所述网页底图上的点击事件，将所述点击事件标记为有效点击事件；若不存在，则确定所述点击事件不是对应于发生在所述网页底图上的点击事件，将所述点击事件标记为无效点击事件。

进一步的，在获取目标页面对应点击事件的点击数据之后，所述方法还包括：若校验所述点击数据中不包含所述点击事件对应点击的目标元素，则确定所述点击事件是无效点击事件；和/或，若检测在所述目标页面上未发生对应所述点击事件的页面跳转，则确定所述点击事件是无效点击事件。

本文中的设备可以是服务器、PC、PAD、手机等。

本申请还提供了一种计算机程序产品，当在数据处理设备上执行时，适于执行初始化有如下方法步骤的程序代码：获取目标页面对应点击事件的点击数据，所述点击数据至少包括：所述点击事件对应点击的目标元素的点击位置；确定目标元素对应的元素块尺寸，所述元素块为所述目标元素发生点击事件时对应的有效点击区域；根据所述点击位置和所述元素块尺寸，计算相对偏移量；在网页底图上查找所述目标元素的位置，所述网页底图与所述目标页面具有相同的网页内容信息；根据在所述网页底图上查找到的所述目标元素的位置、所述相对偏移量，确定所述点击事件在所述网页底图上对应的实际点击位置；根据所述实际点击位置在所述网页底图上绘制所述点击事件对应的热力图。

本领域内的技术人员应明白，本申请的实施例可提供为方法、系统、或计算机程序产品。因此，本申请可采用完全硬件实施例、完全软件实施例、或结合软件和硬件方面的实施例的形式。而且，本申请可采用在一个或多个其中包含有计算机可用程序代码的计算机可用存储介质(包括但不限于磁盘存储器、CD-ROM、光学存储器等)上实施的计算机程序产品的形式。

本申请是参照根据本申请实施例的方法、设备(系统)、和计算机程序产品的流程图和/或方框图来描述的。应理解可由计算机程序指令实现流程图和/或方框图中的每一流程和/或方框、以及流程图和/或方框图中的流程和/或方框的结合。可提供这些计算机程序指令到通用计算机、专用计算机、嵌入式处理机或其他可编程数据处理设备的处理器以产生一个机器，使得通过计算机或其他可编程数据处理设备的处理器执行的指令产生用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的装置。

这些计算机程序指令也可存储在能引导计算机或其他可编程数据处理设备以特定方式工作的计算机可读存储器中，使得存储在该计算机可读存储器中的指令产生包括指令装置的制造品，该指令装置实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能。

这些计算机程序指令也可装载到计算机或其他可编程数据处理设备上，使得在计算机或其他可编程设备上执行一系列操作步骤以产生计算机实现的处理，从而在计算机或其他可编程设备上执行的指令提供用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的步骤。

在一个典型的配置中，计算设备包括一个或多个处理器(CPU)、输入/输出接口、网络接口和内存。

存储器可能包括计算机可读介质中的非永久性存储器，随机存取存储器(RAM)和/或非易失性内存等形式，如只读存储器(ROM)或闪存(flashRAM)。存储器是计算机可读介质的示例。

计算机可读介质包括永久性和非永久性、可移动和非可移动媒体可以由任何方法或技术来实现信息存储。信息可以是计算机可读指令、数据结构、程序的模块或其他数据。计算机的存储介质的例子包括，但不限于相变内存(PRAM)、静态随机存取存储器(SRAM)、动态随机存取存储器(DRAM)、其他类型的随机存取存储器(RAM)、只读存储器(ROM)、电可擦除可编程只读存储器(EEPROM)、快闪记忆体或其他内存技术、只读光盘只读存储器(CD-ROM)、数字多功能光盘(DVD)或其他光学存储、磁盒式磁带，磁带磁磁盘存储或其他磁性存储设备或任何其他非传输介质，可用于存储可以被计算设备访问的信息。按照本文中的界定，计算机可读介质不包括暂存电脑可读媒体(transitory media)，如调制的数据信号和载波。

还需要说明的是，术语“包括”、“包含”或者其任何其他变体意在涵盖非排他性的包含，从而使得包括一系列要素的过程、方法、商品或者设备不仅包括那些要素，而且还包括没有明确列出的其他要素，或者是还包括为这种过程、方法、商品或者设备所固有的要素。在没有更多限制的情况下，由语句“包括一个……”限定的要素，并不排除在包括要素的过程、方法、商品或者设备中还存在另外的相同要素。

本领域技术人员应明白，本申请的实施例可提供为方法、系统或计算机程序产品。因此，本申请可采用完全硬件实施例、完全软件实施例或结合软件和硬件方面的实施例的形式。而且，本申请可采用在一个或多个其中包含有计算机可用程序代码的计算机可用存储介质(包括但不限于磁盘存储器、CD-ROM、光学存储器等)上实施的计算机程序产品的形式。

以上仅为本申请的实施例而已，并不用于限制本申请。对于本领域技术人员来说，本申请可以有各种更改和变化。凡在本申请的精神和原理之内所作的任何修改、等同替换、改进等，均应包含在本申请的权利要求范围之内。

Claims (8)

1.一种绘制热力图的方法，其特征在于，所述方法包括：

获取目标页面对应点击事件的点击数据，所述点击数据至少包括：所述点击事件对应点击目标元素的点击位置；

确定目标元素对应的元素块尺寸，所述元素块为所述目标元素发生点击事件时对应的有效点击区域；

根据所述点击位置和所述元素块尺寸，计算相对偏移量，进一步包括：根据所述元素块尺寸，确定所述元素块的中心点位置；计算所述点击位置和所述中心点位置之间的相对偏移量；

在网页底图上查找所述目标元素的位置，所述网页底图与所述目标页面具有相同的网页内容信息；

根据在所述网页底图上查找到的所述目标元素的位置、所述相对偏移量，确定所述点击事件在所述网页底图上对应的实际点击位置，进一步包括：获取所述目标页面上所述目标元素对应的元素块尺寸；根据所述网页底图对应的文档对象模型结构，在所述网页底图上获取所述目标元素对应的元素块的尺寸；根据所述目标页面上所述元素块的尺寸与所述网页底图上所述元素块的尺寸，计算得到对应尺寸的缩放比；根据所述缩放比，对所述相对偏移量进行缩小或放大，得到在所述网页底图上所述目标元素的位置与所述实际点击位置的实际相对偏移量；在所述网页底图上根据所述目标元素的位置以及所述实际相对偏移量，计算所述点击事件对应的实际点击位置；

根据所述实际点击位置在所述网页底图上绘制所述点击事件对应的热力图。

2.根据权利要求1所述的方法，其特征在于，在所述在网页底图上查找所述目标元素的位置之前，所述方法还包括：

获取所述网页底图对应的文档对象模型结构的路径；

判断所述文档对象模型结构的路径中是否存在所述目标元素对应的父元素；

若否，则确定在所述网页底图上不存在所述目标元素，并确定所述点击事件不是对应于发生在所述网页底图上的点击事件，将所述点击事件标记为无效点击事件。

3.根据权利要求2所述的方法，其特征在于，若所述文档对象模型结构的路径中存在所述目标元素对应的父元素，所述方法还包括：

获取所述父元素内的索引，所述索引用于指示所述目标元素在所述父元素内的位置；

根据所述索引在所述网页底图上查找是否存在所述目标元素；

若存在，则确定所述点击事件是发生在所述网页底图上的点击事件，将所述点击事件标记为有效点击事件；

若不存在，则确定所述点击事件不是对应于发生在所述网页底图上的点击事件，将所述点击事件标记为无效点击事件。

4.根据权利要求1所述的方法，其特征在于，在获取目标页面对应点击事件的点击数据之后，所述方法还包括：

若校验所述点击数据中不包含所述点击事件对应点击的目标元素，则确定所述点击事件是无效点击事件；和/或，

若检测在所述目标页面上未发生对应所述点击事件的页面跳转，则确定所述点击事件是无效点击事件。

5.一种绘制热力图的装置，其特征在于，所述装置包括：

获取单元，用于获取目标页面对应点击事件的点击数据，所述点击数据至少包括：所述点击事件对应点击目标元素的点击位置；

确定单元，用于确定目标元素对应的元素块尺寸，所述元素块为所述目标元素发生点击事件时对应的有效点击区域；

计算单元，用于根据所述获取单元获取到的点击位置和所述确定单元确定的元素块尺寸，计算相对偏移量；

所述计算单元包括：确定模块，用于根据所述元素块尺寸，确定所述元素块的中心点位置；计算模块，用于计算所述点击位置和所述确定模块确定的中心点位置之间的相对偏移量；

查找单元，用于在网页底图上查找所述目标元素的位置，所述网页底图与所述目标页面具有相同的网页内容信息；

所述确定单元，还用于根据在所述网页底图上所述查找单元查找到的所述目标元素的位置、所述计算单元计算的相对偏移量，确定所述点击事件在所述网页底图上对应的实际点击位置；

所述确定单元包括：获取模块，用于获取所述目标页面上所述目标元素对应的元素块尺寸；所述获取模块，还用于根据所述网页底图对应的文档对象模型结构，在所述网页底图上获取所述目标元素对应的元素块的尺寸；计算模块，用于根据所述获取模块获取到的目标页面上所述元素块的尺寸与所述获取模块获取到的网页底图上所述元素块的尺寸，计算得到对应尺寸的缩放比；确定模块，用于根据所述计算模块计算得到的缩放比，对所述相对偏移量进行缩小或放大，得到在所述网页底图上所述目标元素的位置与所述实际点击位置的实际相对偏移量；所述计算模块，还用于在所述网页底图上根据所述目标元素的位置以及所述实际相对偏移量，计算所述点击事件对应的实际点击位置；

绘制单元，用于根据所述确定单元确定的实际点击位置在所述网页底图上绘制所述点击事件对应的热力图。

6.根据权利要求5所述的装置，其特征在于，所述装置还包括：

所述获取单元，用于在所述在网页底图上查找所述目标元素的位置之前，获取所述网页底图对应的文档对象模型结构的路径；

判断单元，用于判断所述获取单元获取到的文档对象模型结构的路径中是否存在所述目标元素对应的父元素；

所述确定单元，用于当所述判断单元判断所述文档对象模型结构的路径中不存在所述目标元素对应的父元素时，则确定在所述网页底图上不存在所述目标元素，并确定所述点击事件不是对应于发生在所述网页底图上的点击事件；

标记单元，用于将所述点击事件标记为无效点击事件。

7.一种存储介质，其特征在于，所述存储介质包括存储的程序，其中，在所述程序运行时控制所述存储介质所在设备执行如权利要求1-4中任一项所述的绘制热力图的方法。

8.一种处理器，其特征在于，所述处理器用于运行程序，其中，所述程序运行时执行如权利要求1-4中任一项所述的绘制热力图的方法。

Images