CN1851713A - 基于多图像文本的图像检索及显示方法 - Google Patents

Abstract

本发明公开了一种基于多图像文本的图像检索及显示方法，为解决现有图像检索显示效率低而提出，本发明包括步骤：根据图像文本中存储的图像信息建立图像及其匹配信息的对应关系库；根据图像文本显示的图像信息，输入查询条件，并利用该查询条件在关系库中进行匹配操作，若匹配成功，则返回匹配信息对应的图像的边界信息、图像文本的显示区域信息；根据检索图像的边界信息确定仅包括检索图像的显示区域，生成可覆盖除检索图像显示区域外的图像文本的显示区域的覆盖层；将覆盖层输出至显示端，仅显示检索图像。本发明可高效显示一张图片上的指定区域，节约了新图片生成过程和新图片数据传输过程，节约了处理资源。

Description

基于多图像文本的图像检索及显示方法

技术领域

本发明涉及一种图像检索及显示方法，尤其涉及一种基于多图像文本的图像检索及显示方法。

背景技术

图像能够表达丰富的蕴意，又容易被人识别和接受，因此，图像在现代生活中的应用非常广泛。例如一些公司、网站的标识等多采用图像形式来表现。由于图像不同于文本，需要靠人们各自的理解来说明其蕴意，因此图像检索比起文本的查询和匹配要困难得多。特别是在各种图像较多的文本文件中，在文本的海量图像中查找出用户感兴趣的图像，是非常困难的。即使文件支持自动搜索功能，查找到匹配的图像并将其显示到用户输出端，也是需要耗费大量的资源的。特别是当检索对象是网页文本时，被搜索文本需要面对的可能是海量用户，服务器要针对不同的用户检索需求而传送不同的查询结果，而图像数据一般又都比较大，这必然导致网络的阻塞。

而目前，为在有限的空间内增加信息容量及吸引网友眼球，各式网站的网页中存在很多图像信息。互联网上存在各式各样的图像，有时用户需要收集一些自己最感兴趣的、具有代表性的图像以供自己使用。但随着网上图像信息的急剧膨胀，检索相应的图像并显示到各用户端，对于处理能力有限的服务器来讲，耗费了大量的处理资源。用户较多时，很可能导致数据阻塞。

用户通过浏览器访问web页面时，要求在其中存在的大量图像中查找自己感兴趣的，并在web页面里仅凸显自己感兴趣的一个或者多个图像，同时隐藏其他与检索图像无关的显示数据。目前广泛使用的方法是首先进行图像检索，根据用户检索结果显示的需要，重新生成一张仅包括用户检索结果的web页面，传输到用户浏览器端。目前采用方法的缺点是非常明显的：需要重新生成新的web页面及图像，并进行相应传输，这必然导致处理器负担的增加，总体上延迟了在浏览器端的显示，造成用户体验低下。检索用户较多时，将导致网络的阻塞。

发明内容

针对上述现有的图像检索及显示方法中所存在的问题和不足，本发明的目的是提供一种明显改善图像检索后传输显示效果的基于多图像文本的检索图像显示方法。

本发明是这样实现的：一种基于多图像文本的图像检索及显示方法，包括以下步骤：

(1)根据所述图像文本中存储的图像信息建立图像、图像显示区域、所述图像文本显示区域及其匹配信息的对应关系库；

(2)根据所述图像文本显示的图像信息，利用输入的查询条件在所述关系库中进行匹配操作，若匹配成功，则返回匹配信息对应的图像显示区域、所述图像文本的显示区域信息；

(3)根据所述图像文本的显示区域信息生成至少遮盖掉该图像文本显示区域的覆盖层；

(4)根据所述图像的显示区域，将该图像的边界信息对应于所述覆盖层的区域设置为透明。

其中，所述步骤(1)中建立图像及其匹配信息关系库的具体步骤为：

A、为所述图像文本中存储的所有图像建立标识信息；

B、建立所述标识信息与其对应的图像位置及区域的信息的对应关系库。

所述图像文本为网页页面。

利用本发明在对图像进行检索时，当检索到匹配图像并输出该检索图像时，不需要重新生成图像文本对象，也无需再对原图片进行处理，而是通过将不需要显示的原图层遮盖起来，仅显示检索图像所在区域。特别是检索对象是web页面时，利用本发明显示检索结果，不但节约了对图片本身的处理过程，还节约了web应用中重新传输图片数据的过程，加快了图片局部定位显示的过程。本发明可高效显示一张图片上的指定区域，节约了新图片生成过程和新图片数据传输过程，当原图较大时，能明显节约服务器的处理资源、减少用户整体的等待时间，从而能显著提高web用户体验，具有较强的实用意义。

附图说明

图1是本发明的图像检索及显示流程示意图；

图2是网站页面图片显示示意图。

具体实施方式

以下结合附图，对本发明进行详细描述。

本发明是针对在包含有海量图像的文本对象中进行图像搜索并显示而提出的。以下以比较有代表性的web页面为对象详细介绍本发明，本领域技术人员应当理解，本发明并不限于web页面文本的应用。

本发明实施时，首先需要对web页面文本中包括的各单独图像建立检索匹配信息。本发明可采用关键字检索方式。首先为web页面文本中包括的所有图像建立标识信息，这些标识信息均为文字信息，以方便用户的输入。这些关键字的标识信息包括图像所有可能的名称、蕴意、属性、大小、网站地址、网站域名、网站关键词、网站简介等所有可以标识图像特征的文字信息。为图像建立匹配信息数据库，建立图像显示信息与图像的关键字标识信息的对应关系。在web页面文本中设置坐标系统，例如网格、坐标等可用于确定图像位置及显示区域的系统，利用坐标系统完成对web页面文本中包括的各单独图像的定位，并确定各图像的显示区域、web页面文本的整个显示区域，并将该确定的显示区域、web页面文本的整个显示区域与图像的关键字标识信息进行绑定。

如图1所示，本发明的具体流程如下：

步骤1为流程开始步骤；

在步骤2，当web用户需要在包括有海量的web页面上检索自己感兴趣的图像时，输入相应的搜索匹配信息；

在步骤3，用户的浏览器把此次检索请求发送到web服务器，web服务器将检索请求再转交到存储图片信息的数据库，进行匹配信息匹配，若有匹配信息，则进入步骤4；否则返回检索不成功信息，进入步骤6；

在步骤4，输出匹配信息对应的检索图像的位置信息、web页面的显示区域信息和检索图像显示区域(一块或者多块)信息；

在步骤5，web用户端的浏览器接收到web服务器返回的位置及显示区域信息后，根据本发明的坐标系统动态创建一个和原web页面显示区域大小一致(或者大于web页面显示区域)，且具有非透明背景色的层(以下称覆盖层)遮盖原图层，从而隐藏掉整个原web页面。根据web服务器返回的检索图像显示区域，设置那些检索图像显示区域的背景色为透明色，从而显示出下方的原图片相对应的区域——这些区域正是web用户检索的结果相关的区域。当web用户继续下一次检索时，将先清除掉覆盖层，然后重复上述的检索和显示过程。

步骤6，流程结束。

本发明图像区域信息生成步骤为：

1、根据所述图像的边界坐标信息，确定所述图像的最大横坐标值、最小横坐标值、最大纵坐标值和最小纵坐标值；

2、根据上述坐标值确定矩形区域，并根据该矩形区域确定一个大于或等于该区域的图像显示区域；

3、将上述步骤2确定的图像显示区域信息与所述标识信息绑定。

本发明图像区域信息生成步骤还可以为：

1、在所述图像中确定一个坐标点，并计算出该坐标点距所述图像的边界的最大距离，以该坐标点为圆心、最大距离为半径确定圆形区域；

2、根据圆形区域确定一个大于或等于该区域的图像显示区域；

3、将上述步骤2确定的图像显示区域信息与所述标识信息绑定。

下面以万网网格页面( http://g.www.com.cn)为例，阐明本发明的具体应用过程。

万网网格是一个集中展示万网联盟会员网站logo、图标的页面，将众多会员网站的logo(一种图片标识)统一展示在一张完整页面上。具体可参见上述网址显示内容，如图2所示，具体可参见页面 http://g.www.com.cn。因为整张web页面面积庞大，里面的网站log(web页面包括的图像)非常多，用户用肉眼找到自己感兴趣的相关网站的logo，显得非常困难。这时，可通过输入检索自己比较感兴趣的匹配信息，如用户仅仅对是域名标识的图像感兴趣，即可输入“域名”来搜索图像，启用本发明的方法后，显示检索结果的页面的过程耗时不到0.05s，避免了服务器的资源损耗、几乎不需要用户等待。

为使本领域技术人员更好地理解本发明。仍以上面的网格为例具体说明如何实施在指定的一张包括了海量图像信息的Web页面上快速显示搜索结果的。

首先需要建立图片区域和标识信息(关键字)的映射关系数据，具体步骤如前述。

上述指定的web页面从逻辑上可分解为很多独立的图像区域——这里的独立指把该区域分离出来，视觉上看是一个小图片或者图标，能独立表达出某种信息，并不依赖于其他区域，这就是本发明所称的图像，每个图像在web页面上占据一个确定的区域，同时每个图像在相应的数据库中都有对应的关键字标识信息。这些关键字标识信息和图像的对应关系，储存在Web服务器端的数据库中的一张映射表里。

在数据库中储存的图像到相关信息的映射关系大致可表示为“坐标x，坐标y，宽，高，网址，介绍，其他信息”，其中坐标x，坐标y，宽，高这四个数据定义了每个图像在整张web页面图上的所在区域。

当用户输入搜索词时，Web页面利用Javascript的AJAX技术实现异步后台提交(这里异步提交意义为，客户端的web页面不刷新或者页面网址不变，搜索词由javascript的xhttp组件提交到服务器端)。

Web服务器端的数据库会根据输入的关键字标识信息，找出该关键字标识信息对应的图像位置信息、Web页面显示区域信息和图像显示区域信息。

服务器将找到的上述位置及显示区域信息加上javascript指令，用字符串形式传回到客户端，由客户端的javascript的fnWhenDone函数负责接收，而此函数调用javascript自身的eval函数，让客户端的浏览器执行服务端返回的javascript指令。

这些javascript指令完成的操作分为两步。首先调用javascript自身的createElement方法，动态创建一个与web页面图片显示区域一样大小的div浮动覆盖层，并设置其在web页面上的坐标，使其位置浮在到web页面图片正上方达到遮盖掉原显示区域的效果。遮盖区域等于或大于原web页面图片显示区域。

然后设置该div浮动层的css属性FILTER为mask(color＝#efefff)，设置这个属性后，该div浮动层会有一个特性，div里面的子元素(childElement)所在的区域(检索图像显示区域)都会透明，失去遮盖效果。本发明将利用这个特性，继续动态创建createElement该div浮动层的子元素，并把这些子元素根据前面服务端返回的坐标数据，设置其css属性的位置属性，包括left、top、width、height等信息，定位到不需要遮盖的位置上方。检索图像的显示区域数目与检索图像数目一一对应。最后完成显示。本发明原页面本身并没有发生变化，也没有任何新页面图片的传输，节约了图片数据重新传输过程，防止网络拥塞，并且高效地完成了图片搜索显示过程，对于提高网站的用户体验非常有意义。

当然，本发明还可有其他多种实施例，在不背离本发明精神及其实质的情况下，本领域技术人员当可根据本发明作出各种相应的改变和变形，但这些相应的改变和变形都应属于本发明所附的权利要求的保护范围。

Claims (6)

1、一种基于多图像文本的图像检索及显示方法，其特征在于，该方法包括以下步骤：

(1)根据所述图像文本中存储的图像信息建立图像、图像显示区域、所述图像文本显示区域及其匹配信息的对应关系库；

(2)根据所述图像文本显示的图像信息，利用输入的查询条件在所述关系库中进行匹配操作，若匹配成功，则返回匹配信息对应的图像显示区域、所述图像文本的显示区域信息；

(3)根据所述图像文本的显示区域信息生成至少遮盖掉该图像文本显示区域的覆盖层；

(4)根据所述图像的显示区域，将该图像的边界信息对应于所述覆盖层的区域设置为透明。

2、根据权利要求1所述的基于多图像文本的检索图像显示方法，其特征在于，所述步骤(1)中建立图像及其匹配信息关系库的具体步骤为：

A、为所述图像文本中存储的所有图像建立标识信息；

B、建立所述标识信息与其对应的图像位置及区域的信息的对应关系库。

3、根据权利要求2所述的基于多图像文本的检索图像显示方法，其特征在于，所述步骤B中的图像区域信息生成步骤为：

a、根据所述图像的边界坐标信息，确定所述图像的最大横坐标值、最小横坐标值、最大纵坐标值和最小纵坐标值；

b、根据上述坐标值确定矩形区域，并根据该矩形区域确定一个大于或等于该区域的图像显示区域；

c、将步骤b确定的图像显示区域信息与所述标识信息绑定。

4、根据权利要求2所述的基于多图像文本的检索图像显示方法，其特征在于，所述步骤B中的图像区域信息生成步骤为：

a、在所述图像中确定一个坐标点，并计算出该坐标点距所述图像的边界的最大距离，以该坐标点为圆心、最大距离为半径确定圆形区域；

b、根据所述圆形区域确定一个大于或等于该区域的图像显示区域；

c、将步骤b确定的图像显示区域信息与所述标识信息绑定。

5、根据权利要求1所述的基于多图像文本的检索图像显示方法，其特征在于，所述图像标识信息包括图像名称、图像属性、标识名称或标识地址。

6、根据权利要求1所述的基于多图像文本的检索图像显示方法，其特征在于，所述图像文本为网页页面。

Images