CN112069339A - 背景图片处理及搜索结果展示方法、装置、设备和介质 - Google Patents

背景图片处理及搜索结果展示方法、装置、设备和介质 Download PDF

Info

Publication number
CN112069339A
CN112069339A CN202010923452.2A CN202010923452A CN112069339A CN 112069339 A CN112069339 A CN 112069339A CN 202010923452 A CN202010923452 A CN 202010923452A CN 112069339 A CN112069339 A CN 112069339A
Authority
CN
China
Prior art keywords
color
main
picture
target picture
colors
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.)
Pending
Application number
CN202010923452.2A
Other languages
English (en)
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.)
Beijing ByteDance Network Technology Co Ltd
Original Assignee
Beijing ByteDance Network Technology Co 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 Beijing ByteDance Network Technology Co Ltd filed Critical Beijing ByteDance Network Technology Co Ltd
Priority to CN202010923452.2A priority Critical patent/CN112069339A/zh
Publication of CN112069339A publication Critical patent/CN112069339A/zh
Pending legal-status Critical Current

Links

Images

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/50Information retrieval; Database structures therefor; File system structures therefor of still image data
    • G06F16/53Querying
    • G06F16/538Presentation of query results
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/50Information retrieval; Database structures therefor; File system structures therefor of still image data
    • G06F16/58Retrieval characterised by using metadata, e.g. metadata not derived from the content or metadata generated manually
    • G06F16/583Retrieval characterised by using metadata, e.g. metadata not derived from the content or metadata generated manually using metadata automatically derived from the content
    • G06F16/5838Retrieval characterised by using metadata, e.g. metadata not derived from the content or metadata generated manually using metadata automatically derived from the content using colour
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/50Information retrieval; Database structures therefor; File system structures therefor of still image data
    • G06F16/58Retrieval characterised by using metadata, e.g. metadata not derived from the content or metadata generated manually
    • G06F16/5866Retrieval characterised by using metadata, e.g. metadata not derived from the content or metadata generated manually using information manually generated, e.g. tags, keywords, comments, manually generated location and time information
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F18/00Pattern recognition
    • G06F18/20Analysing
    • G06F18/25Fusion techniques
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06VIMAGE OR VIDEO RECOGNITION OR UNDERSTANDING
    • G06V10/00Arrangements for image or video recognition or understanding
    • G06V10/40Extraction of image or video features
    • G06V10/56Extraction of image or video features relating to colour
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06VIMAGE OR VIDEO RECOGNITION OR UNDERSTANDING
    • G06V10/00Arrangements for image or video recognition or understanding
    • G06V10/70Arrangements for image or video recognition or understanding using pattern recognition or machine learning
    • G06V10/74Image or video pattern matching; Proximity measures in feature spaces
    • G06V10/75Organisation of the matching processes, e.g. simultaneous or sequential comparisons of image or video features; Coarse-fine approaches, e.g. multi-scale approaches; using context analysis; Selection of dictionaries
    • G06V10/751Comparing pixel values or logical combinations thereof, or feature values having positional relevance, e.g. template matching

Landscapes

  • Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • Data Mining & Analysis (AREA)
  • Databases & Information Systems (AREA)
  • General Engineering & Computer Science (AREA)
  • Library & Information Science (AREA)
  • Computer Vision & Pattern Recognition (AREA)
  • Artificial Intelligence (AREA)
  • Multimedia (AREA)
  • Evolutionary Computation (AREA)
  • Bioinformatics & Computational Biology (AREA)
  • Evolutionary Biology (AREA)
  • Health & Medical Sciences (AREA)
  • Computing Systems (AREA)
  • Bioinformatics & Cheminformatics (AREA)
  • General Health & Medical Sciences (AREA)
  • Medical Informatics (AREA)
  • Software Systems (AREA)
  • Life Sciences & Earth Sciences (AREA)
  • Image Processing (AREA)

Abstract

本公开提供了一种背景图片处理及搜索结果展示方法、装置、设备和介质,其中,该方法包括:从目标图片中提取至少两种主颜色;根据提取的所述主颜色的数量,将所述目标图片划分为若干个区块;针对提取的每个所述主颜色,根据该主颜色与各所述区块所包含像素的颜色之间的第一空间距离,确定所述主颜色对应的区块;根据预先定义的颜色值映射区间,确定各所述主颜色对应的调整颜色;根据各所述调整颜色及各所述主颜色对应的区块,生成内容展示背景图片。本公开实施例通过生成内容展示背景图片的方式,将背景色彩与页面中的目标图片进行视觉融合,提升了搜索结果展示品质和显示效果。

Description

背景图片处理及搜索结果展示方法、装置、设备和介质
技术领域
本发明公开涉及计算机技术领域,具体而言,涉及一种背景图片处理及搜索结果展示方法、装置、设备和介质。
背景技术
目前,很多社交和资讯类APP(应用程序)中,都采用图文展示页面为用户提供信息。图文展示页面一般会搭配图片进行展现,丰富页面内容,组合样式更多样化。在一些图文展示页面中,以概要文字加图片介绍为主,通常用大图搭配摘要文字,吸引用户点击进入页面查看。
但是,目前的图文展示页面中图片和搜索结果展示背景分离,使得用户对展示内容很难有沉浸感,影响了搜索结果展示效果,降低了用户体验。
发明内容
本公开实施例至少提供一种背景图片处理及搜索结果展示方法、装置、设备和介质,可以将背景色彩与页面中的目标图片色彩视觉融合,达到提升页面设计品质感的效果。
第一方面,本公开实施例提供了一种背景图片处理方法,包括:
从目标图片中提取至少两种主颜色;
根据提取的所述主颜色的数量,将所述目标图片划分为若干个区块;
针对提取的每个所述主颜色,根据该主颜色与各所述区块颜色之间的第一空间距离,确定所述主颜色对应的区块;
根据预先定义的颜色值映射区间,确定各所述主颜色对应的调整颜色;
根据各所述调整颜色及各所述主颜色对应的区块,生成内容展示背景图片。
一种可选的实施方式中,从目标图片中提取至少两种主颜色,包括:
对所述目标图片进行模糊处理;
统计模糊处理后的目标图片中包括的各颜色对应的像素数量;
根据各颜色对应的像素数量,从目标图片中提取至少两种主颜色。
一种可选的实施方式中,根据统计的各颜色对应的像素数量,从目标图片中提取至少两种主颜色,包括:
根据统计的各颜色对应的像素数量,降序排列所述各颜色得到颜色集合;
从所述颜色集合中依次选择一种颜色,确定当前选择的颜色与主颜色列表中所包含的每一颜色之间的第二空间距离;
如果第二空间距离大于第一预设阈值,则将当前选择的颜色加入所述主颜色列表中。
一种可选的实施方式中,在确定选择出的颜色与所述颜色集合中其他颜色之间的第二空间距离之前,还包括:
确定选择出的颜色与目标颜色之间的第三空间距离;
如果所述第三空间距离小于第二预设阈值,则屏蔽选择出颜色。
一种可选的实施方式中,针对提取的每个所述主颜色,根据该主颜色与各所述区块颜色之间的第一空间距离,确定所述主颜色对应的区块,包括:
针对提取的每个所述主颜色,确定该主颜色与所述区块内各像素的颜色之间的第一空间距离;
在各所述像素中,统计与该主颜色之间的第一空间距离小于第三预设阈值的像素数量;
根据统计出的所述像素数量,确定当前主颜色对应的区块。
一种可选的实施方式中,所述主颜色采用以下任一种表示:红绿蓝RGB、色调饱和度明度HSV和色调饱和度亮度HSL;以及如果所述主颜色采用RGB表示,则
根据预先定义的颜色值映射区间,确定各所述主颜色对应的调整颜色,包括:
将所述主颜色从RGB空间转换为HSL空间;
根据预先定义的颜色值映射区间,将所述HSL空间内的饱和度值和亮度值分别映射到第一区间和第二区间得到映射后的HSL值;
将映射后的HSL值转换为RGB值;
采用转换得到的RGB值表示所述主颜色的调整颜色。
一种可选的实施方式中,根据各所述调整颜色及各所述主颜色对应的区块,生成内容展示背景图片,包括:
根据所述像素数量和各所述主颜色对应的调整颜色,利用线性渐变工具生成各所述主颜色对应的区块图片;
基于各所述主颜色对应的区块,对各所述主颜色对应的区块图片进行拼接,生成所述内容展示背景图片。
一种可选的实施方式中,从目标图片中提取至少两种主颜色之前,还包括:
分别确定所述目标图片的饱和度均值和灰度均值;
当所述目标图片饱和度均值和所述目标图片灰度均值小于第四预设阈值时,确定所述目标图片是灰度图;
当所述目标图片饱和度均值和/或所述目标图片灰度均值不小于所述第四预设阈值时,确定所述目标图片不是灰度图;
在确定所述目标图片不是灰度图片的情况下,执行所述从目标图片中提取至少两种主颜色特征的步骤。
一种可选的实施方式中,在从目标图片中提取至少两种主颜色之前,还包括:
对所述目标图片进行调色预处理,所述调色预处理包括以下至少一种:色阶调整处理、饱和度调整处理、颜色对比度处理和模糊处理。
第二方面,本公开实施例还提供一种搜索结果展示方法,包括:
基于获取的搜索关键词发起搜索请求;
获取与所述搜索关键词匹配的至少一个目标资源,所述目标资源中包含目标图片;
在搜索结果页面展示根据所述至少一个目标资源生成的搜索结果卡片,其中,所述搜索结果卡片的内容展示背景图片是基于所述目标图片生成的。
一种可选的实施方式中,所述内容展示背景图片颜色为流式渐变颜色,所述流式渐变颜色为根据所述目标图片的主颜色调整色生成的,所述内容展示背景图片颜色按照预定方向渐变为透明。
第三方面,本公开实施例还提供一种背景图片处理装置,包括:
提取单元,用于从目标图片中提取至少两种主颜色;
划分单元,用于根据提取的所述主颜色的数量,将所述目标图片划分为若干个区块;
第一确定单元,用于针对提取的每个所述主颜色,根据该主颜色与各所述区块颜色之间的第一空间距离,确定所述主颜色对应的区块;
第二确定单元,用于根据预先定义的颜色值映射区间,确定各所述主颜色对应的调整颜色;
创建单元,用于根据各所述调整颜色及各所述主颜色对应的区块,生成内容展示背景图片。
一种可选的实施方式中,所述装置还包括处理单元和统计单元,其中:
所述处理单元,用于对所述目标图片进行模糊处理;
所述统计单元,用于统计模糊处理后的目标图片中包括的各颜色对应的像素数量;
所述提取单元,用于根据各颜色对应的像素数量,从目标图片中提取至少两种主颜色。
一种可选的实施方式中,所述装置还包括排序单元,其中:
所述排序单元,用于根据统计的各颜色对应的像素数量,降序排列所述各颜色得到颜色集合;
所述提取单元,具体用于从所述颜色集合中依次选择一种颜色,确定当前选择的颜色与主颜色列表中所包含的每一颜色之间的第二空间距离;如果第二空间距离大于第一预设阈值,则将当前选择的颜色加入所述主颜色列表中。
一种可选的实施方式中,所述提取单元,还用于确定选择出的颜色与目标颜色之间的第三空间距离;如果所述第三空间距离小于第二预设阈值,则屏蔽选择出颜色。
一种可选的实施方式中,所述第一确定单元,具体用于针对提取的每个所述主颜色,确定该主颜色与所述区块内各像素的颜色之间的第一空间距离;在各所述像素中,统计与该主颜色之间的第一空间距离小于第三预设阈值的像素数量;根据统计出的所述像素数量,确定当前主颜色对应的区块。
一种可选的实施方式中,所述主颜色采用以下任一种表示:红绿蓝RGB、色调饱和度明度HSV和色调饱和度亮度HSL;以及如果所述主颜色采用RGB表示,则
所述第二确定单元,具体用于将所述主颜色从RGB空间转换为HSL空间;根据预先定义的颜色值映射区间,将所述HSL空间内的饱和度值和亮度值分别映射到第一区间和第二区间得到映射后的HSL值;将映射后的HSL值转换为RGB值;采用转换得到的RGB值表示所述主颜色的调整颜色。
一种可选的实施方式中,所述创建单元,具体用于根根据所述像素数量和各所述主颜色对应的调整颜色,利用线性渐变工具生成各所述主颜色对应的区块图片;
基于各所述主颜色对应的区块,对各所述主颜色对应的区块图片进行拼接,生成所述内容展示背景图片。
一种可选的实施方式中,所述装置还包括:所述第三确定单元,具体用于分别确定所述目标图片的饱和度均值和灰度均值;当所述目标图片饱和度均值和所述目标图片灰度均值小于第四预设阈值时,确定所述目标图片是灰度图;当所述目标图片饱和度均值和/或所述目标图片灰度均值不小于所述第四预设阈值时,确定所述目标图片不是灰度图;在确定所述目标图片不是灰度图片的情况下,执行所述从目标图片中提取至少两种主颜色特征的步骤。
一种可选的实施方式中,所述装置还包括:
预处理单元,用于对所述目标图片进行调色预处理,所述调色预处理包括以下至少一种:色阶调整处理、饱和度调整处理、颜色对比度处理和模糊处理。
第四方面,本公开实施例还提供一种搜索结果展示装置,包括:
搜索单元,用于基于获取的搜索关键词发起搜索请求;
获取单元,用于获取与所述搜索关键词匹配的至少一个目标资源,所述目标资源中包含目标图片;
展示单元,用于在搜索结果页面展示根据所述至少一个目标资源生成的搜索结果卡片,其中,所述搜索结果卡片的内容展示背景图片是基于所述目标图片生成的。
一种可选的实施方式中,所述内容展示背景图片颜色为流式渐变颜色,所述流式渐变颜色为根据所述目标图片的主颜色调整色生成的,所述内容展示背景图片颜色按照预定方向渐变为透明。
第五方面,本公开实施例还提供一种计算机设备,包括:处理器、存储器和总线,所述存储器存储有所述处理器可执行的机器可读指令,当计算机设备运行时,所述处理器与所述存储器之间通过总线通信,所述机器可读指令被所述处理器执行时执行上述第一方面或者第二方面中任一种可能的实施方式中的步骤。
第六方面,本公开实施例还提供一种计算机可读存储介质,该计算机可读存储介质上存储有计算机程序,该计算机程序被处理器运行时执行上述第一方面或者第二方面中任一种可能的实施方式中的步骤。
关于上述背景图片处理及搜索结果展示装置、设备及介质的效果描述参见上述背景图片处理及搜索结果展示方法的说明,这里不再赘述。
本公开实施例提供的背景图片处理及搜索结果展示方法、装置、设备和介质,通过从目标图片中提取主颜色,基于提取的主颜色的数量将目标图片划分为若干个区块,根据主颜色与划分的各个区块颜色之间的空间距离,确定主颜色对应的区块,根据预先定义的颜色映射区间对主颜色进行调整得到调整颜色,最后根据各调整颜色及各主颜色对应的区块,生成内容展示背景图片,与现有技术中页面背景色彩单一,导致视觉效果单调相比,上述过程中,由于根据目标图片的主颜色来生成内容展示背景图片,其背景色彩与目标图片进行视觉融合,提升了图片品质和显示效果。
进一步地,本公开实施例提供的背景图片处理及搜索结果展示方法、装置、设备和介质,还可以在提取目标图片之前进行预处理,包括色阶调整处理、饱和度调整处理、颜色对比度处理和模糊处理等,产生的模糊质感可以提升图片设计品质感。
进一步地,本公开实施例提供的背景图片处理及搜索结果展示方法、装置、设备和介质,还可以根据预先定义的目标颜色,对目标图片中的屏蔽色进行屏蔽处理,由此可以规避目标图片中显脏的色彩,避免了黑灰及比较深的不理想色彩,保证适配不同图片处理出来的效果都是轻量干净并且符合图片色彩氛围的背景效果。
为使本公开的上述目的、特征和优点能更明显易懂,下文特举较佳实施例,并配合所附附图,作详细说明如下。
附图说明
为了更清楚地说明本公开实施例的技术方案,下面将对实施例中所需要使用的附图作简单地介绍,此处的附图被并入说明书中并构成本说明书中的一部分,这些附图示出了符合本公开的实施例,并与说明书一起用于说明本公开的技术方案。应当理解,以下附图仅示出了本公开的某些实施例,因此不应被看作是对范围的限定,对于本领域普通技术人员来讲,在不付出创造性劳动的前提下,还可以根据这些附图获得其他相关的附图。
图1a示出了本公开实施例所提供的一种背景图片处理方法的流程图;
图1b示出了本公开实施例所提供的为目标图片划分区块拼接生成内容展示背景图片的效果示意图;
图2a示出了本公开实施例所提供的去除目标图片冗余色的一种方法流程图;
图2b示出了本公开实施例所提供的去除目标图片冗余色的另一种方法流程图;
图3a示出了本公开实施例所提供的调色处理中,色阶调整处理示意图;
图3b示出了本公开实施例所提供的调色处理中,饱和度调整处理示意图;
图3c示出了本公开实施例所提供的调色处理中,颜色对比度处理示意图;
图3d示出了本公开实施例所提供的调色处理中,模糊处理示意图;
图4示出了本公开实施例所提供的背景图片处理方法中,屏蔽不理想颜色具体方法的流程图;
图5示出了本公开实施例所提供的判断目标图片是否为灰度图的流程图;
图6示出了本公开实施例所提供的一种背景图片处理方法的应用流程图;
图7a示出了本公开实施例所提供的一种搜索结果展示方法的流程图;
图7b示出了根据本公开实施例提供的为客户端显示的搜索页面示意图;
图7c示出了根据本公开实施例提供的搜索结果页面应用背景图片处理方法进行处理后的一种可能的效果示意图;
图8示出了本公开实施例所提供的一种背景图片处理装置的示意图;
图9示出了本公开实施例所提供的一种搜索结果展示装置的示意图;
图10示出了本公开实施例所提供的一种计算机设备的示意图。
具体实施方式
首先,对本发明实施例中涉及的部分用语进行说明,以便于本领域技术人员理解。
RGB色彩模式(也翻译为“红绿蓝”)是工业界的一种颜色标准,是通过对红(Red)、绿(Green)、蓝(Blue)三个颜色通道的变化以及它们相互之间的叠加来得到各式各样的颜色的,RGB即是代表红、绿、蓝三个通道的颜色。
HSV(Hue,Saturation,Value)是根据颜色的直观特性创建的一种颜色空间,也称六角锥体模型(Hexcone Model),模型中颜色的参数分别是:色调(Hue),饱和度(Saturatio),明度(Value)。
HSL是一种将RGB色彩模型中的点在圆柱坐标系中的表示法。这两种表示法试图做到比基于笛卡尔坐标系的几何结构RGB更加直观。HSL即色相(Hue)、饱和度(Saturatio)、亮度(Lightness)。色相(H)是色彩的基本属性,就是平常所说的颜色名称,如红色、黄色等;饱和度(S)是指色彩的纯度,越高色彩越纯,低则逐渐变灰,取0-100%的数值;亮度(L),取0-100%。
LAB模式是一种色彩模式。LAB颜色模型弥补了RGB和CMYK两种色彩模式的不足。它是一种设备无关的颜色模型,也是一种基于生理特征的颜色模型。LAB颜色模型由三个要素组成,一个要素是亮度(Lightness),A和B是两个颜色通道。A包括的颜色是从深绿色(低亮度值)到灰色(中亮度值)再到亮粉红色(高亮度值);B是从亮蓝色(低亮度值)到灰色(中亮度值)再到黄色(高亮度值)。因此,这种颜色混合后将产生具有明亮效果的色彩。
为使本公开实施例的目的、技术方案和优点更加清楚,下面将结合本公开实施例中附图,对本公开实施例中的技术方案进行清楚、完整地描述,显然,所描述的实施例仅仅是本公开一部分实施例,而不是全部的实施例。通常在此处附图中描述和示出的本公开实施例的组件可以以各种不同的配置来布置和设计。因此,以下对在附图中提供的本公开的实施例的详细描述并非旨在限制要求保护的本公开的范围,而是仅仅表示本公开的选定实施例。基于本公开的实施例,本领域技术人员在没有做出创造性劳动的前提下所获得的所有其他实施例,都属于本公开保护的范围。
另外,本公开实施例中的说明书和权利要求书及上述附图中的术语“第一”、“第二”等是用于区别类似的对象,而不必用于描述特定的顺序或先后次序。应该理解这样使用的数据在适当情况下可以互换,以便这里描述的实施例能够以除了在这里图示或描述的内容以外的顺序实施。
在本文中提及的“多个或者若干个”是指两个或两个以上。“和/或”,描述关联对象的关联关系,表示可以存在三种关系,例如,A和/或B,可以表示:单独存在A,同时存在A和B,单独存在B这三种情况。字符“/”一般表示前后关联对象是一种“或”的关系。
经研究发现,通过信息流方式展示的页面通常采用大图搭配摘要文字的方式展示,以吸引用户点击进入页面查看。但是,由于页面背景色彩单一,且页面中的图片与背景分离,造成视觉效果单调,使得用户对展示内容很难有沉浸感,当图片颜色和背景颜色不搭配的时候还会有显脏的色彩,影响了搜索结果展示效果,降低了用户体验。
基于上述研究,本公开提供了一种背景图片处理及搜索结果展示方法、装置、设备和介质,其背景色彩与页面中的图片进行视觉融合,同时产生的模糊质感可以提升页面设计品质感。另外,还可以通过参数调整规避了显脏的色彩,避免了黑灰及比较深的不理想色彩,保证适配不同图片处理出来的效果都是轻量干净并且符合图片色彩氛围的背景效果。
针对以上方案所存在的缺陷,均是发明人在经过实践并仔细研究后得出的结果,因此,上述问题的发现过程以及下文中本公开针对上述问题所提出的解决方案,都应该是发明人在本公开过程中对本公开做出的贡献。
应注意到:相似的标号和字母在下面的附图中表示类似项,因此,一旦某一项在一个附图中被定义,则在随后的附图中不需要对其进行进一步定义和解释。
为便于对本实施例进行理解,首先对本公开实施例所公开的一种背景图片处理方法进行详细介绍,本公开实施例所提供的背景图片处理方法的执行主体一般为具有一定计算能力的计算机设备,该计算机设备例如包括:终端设备或服务器或其它处理设备,终端设备可以为用户设备(User Equipment,UE)、移动设备、用户终端、终端、蜂窝电话、无绳电话、个人数字处理(Personal Digital Assistant,PDA)、手持设备、计算设备、车载设备、可穿戴设备等。在一些可能的实现方式中,该背景图片处理方法可以通过处理器调用存储器中存储的计算机可读指令的方式来实现。
下面以执行主体为计算机设备为例对本公开实施例提供的背景图片处理方法加以说明。
实施例一
参见图1a所示,其为本公开实施例提供的一种背景图片处理方法的流程图,该方法包括步骤S101~S105,其中:
S101:从目标图片中提取至少两种主颜色。
根据本公开实施例,目标图片可以为页面中搭配文字展示的图片。如果页面中包含有多张图片,可以选取页面第一张图片作为目标图片,或者按照各图片的点击率选择点击率最高的图片作为目标图片,还可以人工指定目标图片等等。
一般来说,无论是灰度图片还是彩色图片可以采用二维数值矩阵来表示。其中,彩色图片可以用RGB(红绿蓝)三元组的二维矩阵来表示。通常,三元组的每个数值在0-255之间,0表示相应的基色在该像素中没有,而255则代表相应的基色在该像素中取得最大值,这种情况下每个像素可用三个字节来表示。
在图片处理中还可以采用HSV空间和HSL空间,HSV表达彩色图片的方式由三个部分组成:Hue(色调、色相);Saturation(饱和度、色彩纯净度);Value(明度)。HSL和HSV比较类似,HSL也有三个分量,hue(色相)、saturation(饱和度)、lightness(亮度)。三种不同的颜色模型可以任意转换。
基于上述描述,具体实施时,主颜色可以采用RGB(红绿蓝)、HSV(色调饱和度明度)和HSL(色调饱和度亮度)中的任一种表示。当采用HSV或者HSL表示主颜色时,可以将目标图片的主颜色从RGB空间转换为HSV空间或者HSL空间,得到相应的HSV或者HSL。
根据上述描述可知,目标图片中的每一个像素可以采用RGB、HSV或者HSL中的任一种来表示。基于此,在本步骤中,可以统计目标图片中包括的各颜色对应的像素数量,根据各颜色对应的像素数量,从目标图片中提取至少两种主颜色。
在一个实施例中,针对每一种颜色,可以根据其在目标图片中对应的像素数量进行排序,并依序选择出N种颜色作为目标图片的主颜色,其中,N为大于等于1的整数。
S102:根据提取的主颜色的数量,将目标图片划分为若干个区块。
本步骤中,可以按照以下公式将目标图片划分为若干个区块:N/2*N/2,其中,N表示提取的主颜色,N为大于等于1的整数。具体实施时,可以根据实际需要或者经验值来设定N值,本公开实施例对此不进行限定。
在一种实施方式中,主颜色的数量可以与目标图片所要划分的区块数量相同。例如,可以设定N=4,在主颜色的数量为4的情况下,如图1b所示,可以将目标图片分成2×2区块。
S103:针对提取的每个主颜色,根据该主颜色与各区块所包含像素的颜色之间的第一空间距离,确定主颜色对应的区块。
具体实施时,针对提取的每个主颜色,确定该主颜色与区块内各像素的颜色之间的第一空间距离;在各像素中,统计与该主颜色之间的第一空间距离小于第三预设阈值的像素数量;根据统计出的像素数量,确定当前主颜色对应的区块。
例如,针对步骤S101中提取的N个主颜色,逐区块逐像素计算主颜色与当前区块所包含像素的LAB空间距离,分别统计每个区块中所包含像素颜色与主颜色之间的LAB空间距离小于预设阈值的像素数量,取包含满足上述条件的像素数量最多的区块作为该主颜色对应的区块。
例如,以步骤S101中提取4个主颜色,分别为A,B,C和D为例,如图1b所示,将目标图片划分为区块1,区块2,区块3和区块4,针对区块1中包含的每一像素,分别计算该像素与A之间的LAB空间距离,并统计区块1中,与A之间的LAB空间距离小于预设阈值的像素数量,本例中,假设区块1中共有105个像素与A之间的LAB空间距离小于预设阈值,采用相同的方法,还可以分别统计出区块1中包含的与B、C和D之间的LAB空间距离小于预设阈值的像素数量,假设分别为22,312和86,同理,可以跟别统计出区块2,区块3和区块4中包含的与A、B、C和D之间的LAB空间距离小于预设阈值的像素数量,统计结果如表1所示:
表1
区块1 区块2 区块3 区块4
A 105 22 312 86
B 523 110 20 5
C 45 26 85 426
D 16 458 52 236
根据表1,可以确定出主颜色A对应的区块为区块3,主颜色B对应的区块为区块1,主颜色C对应的区块为区块4,主颜色D对应的区块为区块2。
S104:根据预先定义的颜色值映射区间,确定各主颜色对应的调整颜色。
本步骤中,可以按照以下公式将主颜色映射到预先定义的颜色值映射区间,其中,颜色映射区间可以根据经验值进行设定:V_target=(Vmax'-Vmin')/(Vmax-Vmin)×Value+Vmin'。其中:Vmin'和Vmax'为预先定义的颜色值映射区间的下限值和上限值,Vmax和Vmin为主颜色值现在所属区间的上限值和下限值,Value为主颜色值。
一般来说,目标图片通常采用RGB颜色模型进行表示,即以主颜色为RGB为例,在一种实施方式中,可以按照以下流程确定主颜色的调整颜色:
步骤1、将主颜色从RGB空间转换为HSL空间。
步骤2、根据预先定义的颜色映射区间,将HSL空间内的饱和度值和亮度值分别映射到第一区间和第二区间得到映射后的HSL值。
步骤3、将映射后的HSL值转换为RGB值。
步骤4、采用转换得到的RGB值表示主颜色的调整颜色。
具体实施时,主颜色调整色可以将不同感官颜色统一到同一感官之内,同时将颜色控制在设计需要的区间范围之内,去除了显脏色彩,利用调整颜色生成的内容展示背景图片的效果图,进一步提高目标图片显示颜色的品质。
例如,可以将自定义N个主颜色从RGB空间转换为HSL空间,通常来说,转换后的饱和度值和亮度值的表示区间为0~100,利用上述公式V_target=(Vmax'-Vmin')/(Vmax-Vmin)×Value+Vmin',将HSL空间内的饱和度值和亮度值分别映射到50-100区间内和80-100区间内。
以当前饱和度值Value为58,当前亮度值Value为65为例,利用上述公式计算出映射后的饱和度值为:V_target=(Vmax'-Vmin')/(Vmax-Vmin)×Value+Vmin'=(100-50)/(100-0)×58+50=79,计算出映射后亮度值为V_target=(Vmax'-Vmin')/(Vmax-Vmin)×Value+Vmin'=(100-80)/(100-0)×65+80=93,最后将映射后的HSL值转换为RGB值表示;采用转换得到的RGB值为主颜色的调整颜色。
S105:根据各调整颜色及各主颜色对应的区块,生成内容展示背景图片。
一种实施方式中,可以根据像素数量和各主颜色对应的调整颜色,利用线性渐变工具生成各主颜色对应的区块图片;基于各主颜色对应的区块,对各主颜色对应的区块图片进行拼接,生成内容展示背景图片。
具体实施时,针对每一主颜色,确定步骤S103中统计出的该主颜色对应区块中包含的满足条件的像素数量和步骤S104中确定出的各主颜色对应的调整颜色,利用CSS(层叠样式表,Cascading Style Sheets)的linear-gradient API(线性渐变应用程序接口)生成各主颜色对应的区块图片,具体地,可以将满足条件的像素数量作为CSS的线性渐变API的输入参数生成各主颜色对应的区块图片,基于各主颜色对应的区块,可以根据区块标识对各主颜色对应的区块图片进行拼接,生成内容展示背景图片。其中,区块标识可以是序号或者位置信息,例如,上例中,主颜色A对应的区块为区块3,主颜色B对应的区块为区块1,主颜色C对应的区块为区块4,主颜色D对应的区块为区块2,以区块3中包含的主颜色A的像素数量313作为CSS线性渐变API的输入参数,生成主颜色A对应的区块图片3,采用相同的方法,可以分别得到主颜色B对应的区块图片1,主颜色C对应的区块图片1和主颜色D对应的区块图片2,根据区块图片对应的区块在目标图片中的相应位置进行拼接后得到内容展示背景图片。
通过上述步骤S101~S105对目标图片进行处理,可以将背景色彩与页面中的目标图片进行视觉融合,增加了搜索结果展示内容的视觉沉浸效果,从而提升了搜索结果展示背景的品质和显示效果。
实施例二
上述步骤S101中,对于目标图片中出现的每一种颜色的像素均进行统计,通常在目标图片中存在一些色彩接近的颜色,这些色彩接近的颜色在视觉效果上并不会产生质的改变,为了避免由于提取的N中主颜色色彩接近导致展示的背景图片颜色显示效果单调,本公开实施例中,在确定主颜色的过程中,还可以进一步排除色彩接近的冗余色。
在一个实施例中,基于步骤S101中统计出的目标图片中包括的各颜色对应的像素数量,可以按照图2a所示的流程去除冗余色。
S21:根据统计的各颜色对应的像素数量,降序排列各颜色得到颜色集合。
本步骤中,针对目标图片中包含的每一种颜色对应的像素数量,根据该颜色在目标图片中对应的像素数量由大到小的顺序降序排列,得到颜色集合。
S22:从颜色集合中依次选择一种颜色,确定当前选择的颜色与主颜色列表中所包含的每一颜色之间的第二空间距离。
本步骤中,按照颜色集合中各个颜色的排列顺序依次从颜色集合中选择出一种颜色,并计算当前选择的颜色与颜色列表中所包含的每一颜色之间的第二空间距离,初始时,主颜色列表为空,则将排序第一的颜色直接加入到主颜色列表中。
S23:如果第二空间距离大于第一预设阈值,则将当前选择的颜色加入主颜色列表中。
从颜色集合中排序第二的颜色开始,分别确定其与主颜色列表中包含的每一颜色之间的第二空间距离,并与第一预设阈值进行比较,如果大于第一预设阈值,则将其加入主颜色列表中,如果不大于第一预设阈值,则将其从颜色集合中删除。
在一个实施例中,可以按照如下流程去除目标图片中的冗余色,如图2b所示,包括以下步骤:
S201:根据统计的各颜色对应的像素数量,降序排列各颜色得到颜色集合。
S202:依序遍历得到的颜色集合。
本步骤中,根据步骤S201中得到的颜色集合中所包含颜色的排列顺序,依序进行遍历。
S203:确定当前遍历的颜色与主颜色列表中所包含颜色之间的第二空间距离。
本步骤中,计算当前遍历的的颜色与主颜色列表中所包含颜色之间的第二空间距离。在一个实施例中,第二空间距离可以采用LAB距离表示。
应当理解,初始时,由于尚未选择颜色,因此,可以直接将排序第一的颜色作为主颜色加入主颜色列表中。具体实施时,依次计算颜色集合中的其他颜色与主颜色列表中的颜色(即已经确定出的主颜色)之间的LAB距离。
S204:判断当前遍历的颜色与主颜色列表中的任一颜色之间的第二空间距离是否大于第一预设阈值,如果是,执行步骤S205,否则,执行步骤S206。
具体实施时,如果确定选择出的颜色与任一其他颜色之间的第二空间距离小于第一预设阈值,则确定该选择出的颜色为冗余色,否则,确定该选择出的颜色为主颜色。
S205:将当前遍历的颜色加入主颜色列表中,流程结束。
本步骤中,如果判断出当前遍历的颜色与主颜色列表中所包含的任一颜色之间的第二空间距离均大于第一预设阈值时,则确定当前遍历的颜色为主颜色并将其加入主颜色列表中。
S206:判断选择出的主颜色特征值数量是否达到预设数量,如果是,执行步骤S207,如果否,执行步骤S202。
S207:流程结束。
通过执行上述流程,可以选择出N个主颜色。
在一个实施例中,为了提升搜索结果展示背景的质感,具体实施时,在步骤S101中统计目标图片中包括的各颜色对应的像素数量之前,可以对目标图片进行模糊处理,以使基于目标图片得到的搜索结果展示背景图片具有毛玻璃模糊效果,提升搜索结果展示背景图片的显示品质和显示效果。
具体实施中,可以采用预设大小的滤波核对邻域内的像素使用线性运算平滑加权求和的方法对目标图片进行模糊处理。其中,滤波核的大小可以根据实际需要或者经验值进行设定,本发明实施例对此不进行限定。
例如,可以预定义5×5大小的滤波核对目标图片的像素使用线性运算平滑加权求和进行模糊处理;对模糊处理后的目标图片逐像素统计包含的颜色种类,并统计出每一种颜色对应的像素数量并按降序排列;针对从颜色集合中选择出的任一颜色,确定选择出的颜色与颜色集合中的其他颜色之间的LAB空间距离,若选择出的颜色与颜色集合中的其他颜色之间的LAB空间距离大于第一预设阈值,则将当前选择出的颜色加入主颜色列表中,重复上述过程直到主颜色列表中包含的主颜色个数达到设定个数N。
实施例三
具体实施时,为了进一步提升基于目标图片得到的搜索结果展示背景图片的显示品质和显示效果,实施例三在实施例一和实施例二的基础上,增加了对目标图片进行预处理和/或屏蔽不理想颜色的处理步骤。
这种实施方式中,在从目标图片中提取至少两种主颜色之前,可以对目标图片进行调色预处理和/或屏蔽不理想颜色,例如,可以通过参数调整规避显脏的色彩,避免黑灰及比较深的不理想色彩,保证适配不同图片处理出来的效果都是轻量干净并且符合主图色彩氛围的背景效果。
在一种实施方式中,调色处理可以包括图3a所示的色阶调整处理、图3b所示的饱和度调整处理、图3c所示的颜色对比度处理和图3d所示的模糊处理。
例如,在色阶调整处理步骤中,可以将色阶输出部分调整为180-255使页面整体变亮。在饱和度调整处理步骤中,可以将饱和度+70以提高整体的颜色纯度,略微提高明度值+10以平衡视觉效果。在颜色度对比处理步骤中,可以调整曲线略微提升图片对比,最后进行模糊处理,得到预处理后的目标图片。
参见图4所示,其为本公开实施例所提供的背景图片处理方法中,屏蔽不理想颜色具体方法的流程图,可以包括以下步骤:
S401:确定选择出的颜色与目标颜色之间的第三空间距离。
具体实施时,基于步骤S201和S202中得到的按照各颜色对应的像素数量降序排列的各颜色得到颜色集合,针对从颜色集合中选择出的任一颜色,确定当前选择出的颜色与目标颜色之间的第三空间距离,其中,目标颜色可以为自定义的屏蔽色。在一个实施例中,第三空间距离可以采用LAB距离进行表示。
S402:判断第三空间距离是否小于第二预设阈值,如果否,执行步骤S403;如果是,执行步骤S404。
S403:保留当前选择出的颜色,流程结束。
S404:屏蔽当前选择出的颜色。
具体实施时,可以从颜色集合中删除当前选择出的颜色,即根据预先定义的屏蔽色屏蔽目标图片中不理想的颜色。通过上述处理,在颜色集合中保留的颜色可以规避显脏的色彩,并避免黑灰及比较深的不理想色彩等。
实施例四
本公开实施例提供的背景图片处理方法目的是将图片背景色彩与页面中的图片色彩视觉融合,达到提升页面设计品质感的效果,因此其对于彩色图片的处理效果更好。为了保证基于目标图片得到的搜索结果展示背景图片的显示品质和显示效果,具体实施时,针对当前显示页面中包含的目标图片,可以按照图5所示的流程判断目标图片是否为灰度图,在判断出目标图片不是灰度图的情况,采用上述实施例一~实施例三及其组合提供的方法进行目标图片与搜索结果展示背景图片进行视觉融合处理。
参见图5,其为本公开实施例中判断目标图片是否为灰度图的实施流程示意图,所述方法包括步骤S501~S505,其中:
S501:确定目标图片的饱和度均值。
在一个实施例中,可以将目标图片从RGB空间转换到HSV空间,分离HSV通道为H通道、S通道、V通道,提取S通道值,根据S通道值计算S通道像素均值,得到目标图片的饱和度均值。
S502:确定目标图片的灰度均值。
本步骤中,分离目标图片RGB通道为R通道、G通道、B通道,并计算目标图片RGB三通道均值,遍历每一通道,计算该通道内目标图片包含的每个像素与RGB三通道均值之间的曼哈顿距离,将目标图片包含的所有像素对应的曼哈顿距离求和平均后,得到目标图片的灰度均值。
S503:判断目标图片的饱和度均值和灰度均值是否小于第四预设阈值,如果是,执行步骤S504,如果否,执行步骤S505。
本步骤中,当目标图片饱和度均值和目标图片灰度均值小于预设阈值时,则执行S504;当目标图片饱和度均值和/或目标图片灰度均值不小于预设阈值时,则顺序执行S505。
S504:确定目标图片是灰度图,流程结束。
本步骤中,在确定目标图片不是灰度图片的情况下,执行从目标图片中提取至少两种主颜色特征的步骤,即步骤S101。
S505:确定目标图片不是灰度图。
本步骤中,如果目标图片的饱和度均值和灰度均值中至少一个不小于第四预设阈值,则确定目标图片不是灰度图。
为了更好地理解本公开实施例,以下结合判断图片是否为灰度图的流程和屏蔽不理想颜色方法的流程对本公开实施例的实施过程进行说明,参见图6所示,包括步骤S601~S612,其中:
S601:确定当前显示页面中包含的目标图片。
S602:判断输入的目标图片是否为灰度图。
本步骤中,判断输入的目标图片是否为灰度图的实施流程与图5中判断目标图片是否为灰度图的流程图的实施流程相同,其具体实施方式可以参见步骤S501~S505的实施,这里不再赘述。若目标图片不是灰度图,则顺序执行S604;若目标图片是灰度图,则顺序执行S603。
S603:根据预设模板匹配出背景图片,流程结束。
S604:对目标图片进行调色处理。
本步骤中,调色处理具体过程可以参照图3a图3b图3c,这里不再赘述。
S605:统计目标图片中包括的各颜色对应的像素数量。
S606:根据统计的各颜色对应的像素数量,降序排列各颜色得到颜色集合。
S607:从得到的颜色集合中屏蔽目标图片中的不理想颜色。
本步骤中,屏蔽目标图片中的不理想颜色实施流程与图4中屏蔽不理想颜色的实施流程相同,其具体实施方式可以参见步骤S401~S404的实施,这里不再赘述。
S608:从目标图片中提取至少两种主颜色。
本步骤中,从目标图片中提取至少一种主颜色具体过程参照步骤S202~步骤S205,这里不再赘述。
S609:根据提取的主颜色的数量,将目标图片划分为若干个区块。
本步骤中,根据提取的主颜色的数量,将目标图片划分为若干个区块具体过程参照步骤S102,这里不再赘述。
S610:针对提取的每个主颜色,根据该主颜色与各区块的颜色之间的第一空间距离,确定主颜色对应的区块。
本步骤中,针对提取的每个主颜色,根据该主颜色与各区块的颜色之间的第一空间距离,确定主颜色对应的区块具体过程参照步骤S103,这里不再赘述。
S611:根据预先定义的颜色值映射区间,确定各主颜色对应的调整颜色。
本步骤中,具体过程参照步骤S104,这里不再赘述。
S612:根据各调整颜色及各主颜色对应的区块,生成内容展示背景图片。
本步骤中,根据各调整颜色及各主颜色对应的区块,生成内容展示背景图片具体过程参照步骤S105,这里不再赘述。
根据本公开实施例提供的背景图片处理方法生成内容展示背景图片之后,可以将其叠加到现有的页面背景上进行显示。需要说明的是,本公开实施例提供的背景图片处理方法可以应用于采用信息流方式在页面中展示信息,特别是在卡片式设计的信息流中,响应于用户发起的搜索请求,在搜索结果页面以聚合卡片方式展示相关搜索结果等,根据主卡片中的目标图片,生成主卡片的显示背景图片。
实施例五
参照图7a所示,为本公开实施例提供的一种搜索结果展示方法的流程图,包括以下步骤:
S701:基于获取的搜索关键词发起搜索请求。
具体实施时,用户根据自身需求通过客户端应用程序提交搜索请求,在提交的搜索请求中携带有搜索关键词。需要说明的是,用户可以通过文字、语音或者图片等任一种方式提交搜索请求,本公开实施例对此不仅行限定。如图7b所示,其为客户端显示的搜索页面示意图,用户在搜索页面中显示的搜索框输入搜索关键词并提交,客户端基于用户提交的搜索关键词向服务器发起搜索请求,以用户输入的搜索关键词为“大鱼海棠”为例。
S702:获取与搜索关键词匹配的至少一个目标资源,目标资源中包括目标图片。
具体实施时,服务器在接收到客户端发送的搜索请求中,根据其中携带的搜索关键词“大鱼海棠”查找匹配的目标资源,其中,服务器匹配到的目标资源可以包括多种类型,例如,可以是与“大鱼海棠”相关的视频资源,图片资源,音乐资源和资讯资源等等,匹配到的目标资源中包括目标图片。
S703:在搜索结果页面展示根据至少一个目标资源生成的搜索结果卡片。
其中,搜索结果卡片的内容展示背景图片是基于目标图片生成的。具体实施时,内容展示背景图片颜色可以为流式渐变颜色,所述流式渐变颜色为根据目标图片的主颜色调整色生成的,内容展示背景图片颜色按照预定方向渐变为透明。
具体实施时,针对步骤S702中获取的不同类型的目标资源,可以生成不同的搜索结果卡片。
例如,在一个实施例中,服务器根据查找到的、不同类型的目标资源生成若干个搜索结果卡片,具体实施时,针对每一搜索结果可以生成相应的搜索结果卡片,或者可以将多个搜索结果聚合生成一个搜索结果卡片,本公开实施例对此不进行限定。在搜索结果卡片包含有目标图片的情况下,服务器还可以根据目标图片采用本公开实施例提供的背景图片处理方法生成该搜索结果卡片的内容展示背景图片,将包含了内容展示背景图片的搜索结果卡片发送给客户端,由客户端向用户在搜索结果页面进行展示。如图7c所示,其为搜索结果页面应用背景图片处理方法进行处理后的一种可能的效果示意图。
在另一实施例中,服务器在根据搜索关键词查找到匹配的至少一个目标资源之后,可以将查找到的至少一个目标资源发送给客户端,由客户端生成若干个搜索结果卡片,具体实施时,针对每一搜索结果可以生成相应的搜索结果卡片,或者可以将多个搜索结果聚合生成一个搜索结果卡片,本公开实施例对此不进行限定。在搜索结果卡片包含有目标图片的情况下,客户端根据目标图片采用本公开实施例提供的背景图片处理方法生成该搜索结果卡片的内容展示背景图片并在搜索结果页面展示。
本实施例基于获取的搜索关键词,获取与搜索关键词匹配的至少一个目标资源,在搜索结果页面展示根据各目标资源生成的搜索结果,针对搜索结果中包括的主搜索结果,在服务端匹配目标资源并根据目标资源中包含的目标图片生成内容展示背景图片,在页面中展示,其展示结果能够显著区分主搜索结果和其他搜索结果,为用户提供高效获取信息效率的同时,背景色彩与页面中的目标图片色彩视觉融合,为用户提供舒适的视觉体验。
本领域技术人员可以理解,在具体实施方式的上述方法中,各步骤的撰写顺序并不意味着严格的执行顺序而对实施过程构成任何限定,各步骤的具体执行顺序应当以其功能和可能的内在逻辑确定。
基于同一发明构思,本公开实施例中还提供了与背景图片处理方法对应的背景图片处理装置,由于本公开实施例中的装置解决问题的原理与本公开实施例上述背景图片处理方法相似,因此装置的实施可以参见方法的实施,重复之处不再赘述。
实施例六
参照图8所示,为本公开实施例六提供的一种背景图片处理装置的示意图,该装置包括:
提取单元801,用于从目标图片中提取至少两种主颜色;
划分单元802,用于根据提取的所述主颜色的数量,将所述目标图片划分为若干个区块;
第一确定单元803,用于针对提取的每个所述主颜色,根据该主颜色与各所述区块颜色之间的第一空间距离,确定所述主颜色对应的区块;
第二确定单元804,用于根据预先定义的颜色值映射区间,确定各所述主颜色对应的调整颜色;
创建单元805,用于根据各所述调整颜色及各所述主颜色对应的区块,生成内容展示背景图片。
一种可能的实施方式中,所述装置还包括处理单元和统计单元,其中:
所述处理单元,用于对所述目标图片进行模糊处理;
所述统计单元,用于统计模糊处理后的目标图片中包括的各颜色对应的像素数量;
所述提取单元801,用于根据各颜色对应的像素数量,从目标图片中提取至少两种主颜色。
一种可能的实施方式中,所述装置还包括排序单元,其中:
所述排序单元,用于根据统计的各颜色对应的像素数量,降序排列所述各颜色得到颜色集合;
所述提取单元801,具体用于从所述颜色集合中依次选择一种颜色,确定当前选择的颜色与主颜色列表中所包含的每一颜色之间的第二空间距离;如果第二空间距离大于第一预设阈值,则将当前选择的颜色加入所述主颜色列表中。
一种可能的实施方式中,所述提取单元801,还用于确定选择出的颜色与目标颜色之间的第三空间距离;如果所述第三空间距离小于第二预设阈值,则屏蔽选择出颜色。
一种可能的实施方式中,所述第一确定单元803,具体用于针对提取的每个所述主颜色,确定该主颜色与所述区块内各像素的颜色之间的第一空间距离;在各所述像素中,统计与该主颜色之间的第一空间距离小于第三预设阈值的像素数量;根据统计出的所述像素数量,确定当前主颜色对应的区块。
一种可能的实施方式中,所述主颜色采用以下任一种表示:红绿蓝RGB、色调饱和度明度HSV和色调饱和度亮度HSL;以及如果所述主颜色采用RGB表示,则
所述第二确定单元804,具体用于将所述主颜色从RGB空间转换为HSL空间;根据预先定义的颜色值映射区间,将所述HSL空间内的饱和度值和亮度值分别映射到第一区间和第二区间得到映射后的HSL值;将映射后的HSL值转换为RGB值;采用转换得到的RGB值表示所述主颜色的调整颜色。
一种可能的实施方式中,所述创建单元805,具体用于根据所述像素数量和各所述主颜色对应的调整颜色,利用线性渐变工具生成各所述主颜色对应的区块图片;
基于各所述主颜色对应的区块,对各所述主颜色对应的区块图片进行拼接,生成所述内容展示背景图片。
一种可能的实施方式中,所述装置还包括:所述第三确定单元,具体用于分别确定所述目标图片的饱和度均值和灰度均值;当所述目标图片饱和度均值和所述目标图片灰度均值小于第四预设阈值时,确定所述目标图片是灰度图;当所述目标图片饱和度均值和/或所述目标图片灰度均值不小于所述第四预设阈值时,确定所述目标图片不是灰度图;在确定所述目标图片不是灰度图片的情况下,执行所述从目标图片中提取至少两种主颜色特征的步骤。
一种可选的实施方式中,所述装置还包括:
预处理单元,用于对所述目标图片进行调色预处理,所述调色预处理包括以下至少一种:色阶调整处理、饱和度调整处理、颜色对比度处理和模糊处理。
实施例七
本公开实施例中还提供了与搜索结果展示方法对应的搜索结果展示装置,由于本公开实施例中的装置解决问题的原理与本公开实施例上述搜索结果展示方法相似,因此装置的实施可以参见方法的实施,重复之处不再赘述。
参照图9所示,为本公开实施例七提供的一种搜索结果展示装置的示意图,所述装置包括:
搜索单元901,用于基于获取的搜索关键词发起搜索请求;
获取单元902,用于获取与所述搜索关键词匹配的至少一个目标资源,所述目标资源中包含目标图片;
展示单元903,用于在搜索结果页面展示根据所述至少一个目标资源生成的搜索结果卡片,其中,所述搜索结果卡片的内容展示背景图片是基于所述目标图片生成的。
其中,所述内容展示背景图片颜色为流式渐变颜色,所述流式渐变颜色为根据所述目标图片的主颜色调整色生成的,所述内容展示背景图片颜色按照预定方向渐变为透明。
关于装置中的各单元的处理流程、以及各单元之间的交互流程的描述可以参照上述方法实施例中的相关说明,这里不再详述。
实施例八
基于同一技术构思,本申请实施例还提供了一种计算机设备。参照图10所示,为本申请实施例提供的计算机设备结构示意图,包括处理器101、存储器102、和总线103。其中,存储器102用于存储执行指令,包括内存1021和外部存储器1022;这里的内存1021也称内存储器,用于暂时存放处理器101中的运算数据,以及与硬盘等外部存储器1022交换的数据,处理器101通过内存1021与外部存储器1022进行数据交换,当计算机设备运行时,处理器101与存储器102之间通过总线103通信,使得处理器101在执行上述方法实施例中所提及的执行指令。
本公开实施例还提供一种计算机可读存储介质,该计算机可读存储介质上存储有计算机程序,该计算机程序被处理器运行时执行上述方法实施例中所述的背景图片处理或搜索结果展示方法的步骤。其中,该存储介质可以是易失性或非易失的计算机可读取存储介质。
本公开实施例所提供的背景图片处理方法或搜索结果展示方法的计算机程序产品,包括存储了程序代码的计算机可读存储介质,所述程序代码包括的指令可用于执行上述方法实施例中所述的背景图片处理方法或搜索结果展示方法的步骤,具体可参见上述方法实施例,在此不再赘述。
本公开实施例还提供一种计算机程序,该计算机程序被处理器执行时实现前述实施例的任一种方法。该计算机程序产品可以具体通过硬件、软件或其结合的方式实现。在一个可选实施例中,所述计算机程序产品具体体现为计算机存储介质,在另一个可选实施例中,计算机程序产品具体体现为软件产品,例如软件开发包(Software Development Kit,SDK)等等。
所属领域的技术人员可以清楚地了解到,为描述的方便和简洁,上述描述的***和装置的具体工作过程,可以参考前述方法实施例中的对应过程,在此不再赘述。在本公开所提供的几个实施例中,应该理解到,所揭露的装置和方法,可以通过其它的方式实现。以上所描述的装置实施例仅仅是示意性的,例如,所述单元的划分,仅仅为一种逻辑功能划分,实际实现时可以有另外的划分方式,又例如,多个单元或组件可以结合或者可以集成到另一个***,或一些特征可以忽略,或不执行。另一点,所显示或讨论的相互之间的耦合或直接耦合或通信连接可以是通过一些通信接口,装置或单元的间接耦合或通信连接,可以是电性,机械或其它的形式。
所述作为分离部件说明的单元可以是或者也可以不是物理上分开的,作为单元显示的部件可以是或者也可以不是物理单元,即可以位于一个地方,或者也可以分布到多个网络单元上。可以根据实际的需要选择其中的部分或者全部单元来实现本实施例方案的目的。
另外,在本公开各个实施例中的各功能单元可以集成在一个处理单元中,也可以是各个单元单独物理存在,也可以两个或两个以上单元集成在一个单元中。
所述功能如果以软件功能单元的形式实现并作为独立的产品销售或使用时,可以存储在一个处理器可执行的非易失的计算机可读取存储介质中。基于这样的理解,本公开的技术方案本质上或者说对现有技术做出贡献的部分或者该技术方案的部分可以以软件产品的形式体现出来,该计算机软件产品存储在一个存储介质中,包括若干指令用以使得一台计算机设备(可以是个人计算机,服务器,或者网络设备等)执行本公开各个实施例所述方法的全部或部分步骤。而前述的存储介质包括:U盘、移动硬盘、只读存储器(Read-OnlyMemory,ROM)、随机存取存储器(Random Access Memory,RAM)、磁碟或者光盘等各种可以存储程序代码的介质。
最后应说明的是:以上所述实施例,仅为本公开的具体实施方式,用以说明本公开的技术方案,而非对其限制,本公开的保护范围并不局限于此,尽管参照前述实施例对本公开进行了详细的说明,本领域的普通技术人员应当理解:任何熟悉本技术领域的技术人员在本公开揭露的技术范围内,其依然可以对前述实施例所记载的技术方案进行修改或可轻易想到变化,或者对其中部分技术特征进行等同替换;而这些修改、变化或者替换,并不使相应技术方案的本质脱离本公开实施例技术方案的精神和范围,都应涵盖在本公开的保护范围之内。因此,本公开的保护范围应所述以权利要求的保护范围为准。

Claims (15)

1.一种背景图片处理方法,其特征在于,包括:
从目标图片中提取至少两种主颜色;
根据提取的所述主颜色的数量,将所述目标图片划分为若干个区块;
针对提取的每个所述主颜色,根据该主颜色与各所述区块所包含像素的颜色之间的第一空间距离,确定所述主颜色对应的区块;
根据预先定义的颜色值映射区间,确定各所述主颜色对应的调整颜色;
根据各所述调整颜色及各所述主颜色对应的区块,生成内容展示背景图片。
2.根据权利要求1所述的方法,其特征在于,从目标图片中提取至少两种主颜色,包括:
对所述目标图片进行模糊处理;
统计模糊处理后的目标图片中包括的各颜色对应的像素数量;
根据各颜色对应的像素数量,从目标图片中提取至少两种主颜色。
3.根据权利要求2所述的方法,其特征在于,根据统计的各颜色对应的像素数量,从目标图片中提取至少两种主颜色,包括:
根据统计的各颜色对应的像素数量,降序排列所述各颜色得到颜色集合;
从所述颜色集合中依次选择一种颜色,确定当前选择的颜色与主颜色列表中所包含的每一颜色之间的第二空间距离;
如果第二空间距离大于第一预设阈值,则将当前选择的颜色加入所述主颜色列表中。
4.根据权利要求3所述的方法,其特征在于,在确定选择出的颜色与所述颜色集合中其他颜色之间的第二空间距离之前,还包括:
确定选择出的颜色与目标颜色之间的第三空间距离;
如果所述第三空间距离小于第二预设阈值,则屏蔽选择出颜色。
5.根据权利要求1所述的方法,其特征在于,针对提取的每个所述主颜色,根据该主颜色与各所述区块所包含像素的颜色之间的第一空间距离,确定所述主颜色对应的区块,包括:
针对提取的每个所述主颜色,确定该主颜色与所述区块内各像素的颜色之间的第一空间距离;
在各所述像素中,统计与该主颜色之间的第一空间距离小于第三预设阈值的像素数量;
根据统计出的所述像素数量,确定当前主颜色对应的区块。
6.根据权利要求1所述的方法,其特征在于,所述主颜色采用以下任一种表示:红绿蓝RGB、色调饱和度明度HSV和色调饱和度亮度HSL;以及如果所述主颜色采用RGB表示,则
根据预先定义的颜色值映射区间,确定各所述主颜色对应的调整颜色,包括:
将所述主颜色从RGB空间转换为HSL空间;
根据预先定义的颜色值映射区间,将所述HSL空间内的饱和度值和亮度值分别映射到第一区间和第二区间得到映射后的HSL值;
将映射后的HSL值转换为RGB值;
采用转换得到的RGB值表示所述主颜色的调整颜色。
7.根据权利要求5所述的方法,其特征在于,根据各所述调整颜色及各所述主颜色对应的区块,生成内容展示背景图片,包括:
根据所述像素数量和各所述主颜色对应的调整颜色,利用线性渐变工具生成各所述主颜色对应的区块图片;
基于各所述主颜色对应的区块,对各所述主颜色对应的区块图片进行拼接,生成所述内容展示背景图片。
8.根据权利要求1所述的方法,其特征在于,从目标图片中提取至少两种主颜色之前,还包括:
分别确定所述目标图片的饱和度均值和灰度均值;
当所述目标图片饱和度均值和所述目标图片灰度均值小于第四预设阈值时,确定所述目标图片是灰度图;
当所述目标图片饱和度均值和/或所述目标图片灰度均值不小于所述第四预设阈值时,确定所述目标图片不是灰度图。
9.根据权利要求1~8所述的方法,其特征在于,在从目标图片中提取至少两种主颜色之前,还包括:
对所述目标图片进行调色预处理,所述调色预处理包括以下至少一种:色阶调整处理、饱和度调整处理、颜色对比度处理和模糊处理。
10.一种搜索结果展示方法,其特征在于,包括:
基于获取的搜索关键词发起搜索请求;
获取与所述搜索关键词匹配的至少一个目标资源,所述目标资源中包含目标图片;
在搜索结果页面展示根据所述至少一个目标资源生成的搜索结果卡片,其中,所述搜索结果卡片的内容展示背景图片是基于所述目标图片生成的。
11.根据权利要求10所述的方法,其特征在于,所述内容展示背景图片颜色为流式渐变颜色,所述流式渐变颜色为根据所述目标图片的主颜色调整色生成的,所述内容展示背景图片颜色按照预定方向渐变为透明。
12.一种背景图片处理装置,其特征在于,包括:
提取单元,用于从目标图片中提取至少两种主颜色;
划分单元,用于根据提取的所述主颜色的数量,将所述目标图片划分为若干个区块;
第一确定单元,用于针对提取的每个所述主颜色,根据该主颜色与各所述区块颜色之间的第一空间距离,确定所述主颜色对应的区块;
第二确定单元,用于根据预先定义的颜色值映射区间,确定各所述主颜色对应的调整颜色;
创建单元,用于根据各所述调整颜色及各所述主颜色对应的区块,生成内容展示背景图片。
13.一种搜索结果展示装置,其特征在于,包括:
搜索单元,用于基于获取的搜索关键词发起搜索请求;
获取单元,用于获取与所述搜索关键词匹配的至少一个目标资源,所述目标资源中包含目标图片;
展示单元,用于在搜索结果页面展示根据所述至少一个目标资源生成的搜索结果卡片,其中,所述搜索结果卡片的内容展示背景图片是基于所述目标图片生成的。
14.一种计算机设备,其特征在于,包括:处理器、存储器和总线,所述存储器存储有所述处理器可执行的机器可读指令,当计算机设备运行时,所述处理器与所述存储器之间通过总线通信,所述机器可读指令被所述处理器执行时执行如权利要求1至9任一所述的一种背景图片处理方法的步骤,或者权利要求10或11所述的搜索结果展示方法的步骤。
15.一种计算机可读存储介质,其特征在于,该计算机可读存储介质上存储有计算机程序,该计算机程序被处理器运行时执行如权利要求1至9任一所述的一种背景图片处理方法的步骤,或者权利要求10或11所述的搜索结果展示方法的步骤。
CN202010923452.2A 2020-09-04 2020-09-04 背景图片处理及搜索结果展示方法、装置、设备和介质 Pending CN112069339A (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN202010923452.2A CN112069339A (zh) 2020-09-04 2020-09-04 背景图片处理及搜索结果展示方法、装置、设备和介质

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN202010923452.2A CN112069339A (zh) 2020-09-04 2020-09-04 背景图片处理及搜索结果展示方法、装置、设备和介质

Publications (1)

Publication Number Publication Date
CN112069339A true CN112069339A (zh) 2020-12-11

Family

ID=73665564

Family Applications (1)

Application Number Title Priority Date Filing Date
CN202010923452.2A Pending CN112069339A (zh) 2020-09-04 2020-09-04 背景图片处理及搜索结果展示方法、装置、设备和介质

Country Status (1)

Country Link
CN (1) CN112069339A (zh)

Cited By (8)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN113031675A (zh) * 2021-03-05 2021-06-25 中南大学 一种可见光自适应调控方法、***、装置和存储介质
CN113592963A (zh) * 2021-07-08 2021-11-02 深圳Tcl新技术有限公司 图像生成方法、装置、计算机设备和计算机可读存储介质
CN113742025A (zh) * 2021-09-17 2021-12-03 北京字跳网络技术有限公司 页面生成方法、装置、设备和存储介质
WO2022142222A1 (zh) * 2020-12-30 2022-07-07 北京搜狗科技发展有限公司 一种应用程序设置方法及装置
WO2023093721A1 (zh) * 2021-11-26 2023-06-01 维沃移动通信有限公司 资源召回方法、装置及网络侧设备
CN116401359A (zh) * 2023-06-09 2023-07-07 深圳前海环融联易信息科技服务有限公司 文档抽取方法及装置、介质、设备
WO2023185431A1 (zh) * 2022-03-29 2023-10-05 北京字跳网络技术有限公司 卡片的显示方法、装置、电子设备、存储介质和程序产品
WO2024099284A1 (zh) * 2022-11-07 2024-05-16 北京字跳网络技术有限公司 页面显示方法、装置、设备、存储介质和程序产品

Citations (5)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN104965631A (zh) * 2015-05-26 2015-10-07 深圳市万普拉斯科技有限公司 桌面配色方法、装置及智能终端
CN106934838A (zh) * 2017-02-08 2017-07-07 广州阿里巴巴文学信息技术有限公司 图片展示方法、设备及可编程设备
CN304333123S (zh) * 2017-10-27
CN109947973A (zh) * 2018-09-21 2019-06-28 北京字节跳动网络技术有限公司 展示区域的背景配置方法、装置、设备及可读介质
CN111242836A (zh) * 2018-11-29 2020-06-05 阿里巴巴集团控股有限公司 目标图像生成以及广告图像生成的方法、装置和设备

Patent Citations (5)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN304333123S (zh) * 2017-10-27
CN104965631A (zh) * 2015-05-26 2015-10-07 深圳市万普拉斯科技有限公司 桌面配色方法、装置及智能终端
CN106934838A (zh) * 2017-02-08 2017-07-07 广州阿里巴巴文学信息技术有限公司 图片展示方法、设备及可编程设备
CN109947973A (zh) * 2018-09-21 2019-06-28 北京字节跳动网络技术有限公司 展示区域的背景配置方法、装置、设备及可读介质
CN111242836A (zh) * 2018-11-29 2020-06-05 阿里巴巴集团控股有限公司 目标图像生成以及广告图像生成的方法、装置和设备

Cited By (10)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
WO2022142222A1 (zh) * 2020-12-30 2022-07-07 北京搜狗科技发展有限公司 一种应用程序设置方法及装置
CN113031675A (zh) * 2021-03-05 2021-06-25 中南大学 一种可见光自适应调控方法、***、装置和存储介质
CN113031675B (zh) * 2021-03-05 2022-03-29 中南大学 一种可见光自适应调控方法、***、装置和存储介质
CN113592963A (zh) * 2021-07-08 2021-11-02 深圳Tcl新技术有限公司 图像生成方法、装置、计算机设备和计算机可读存储介质
CN113592963B (zh) * 2021-07-08 2024-06-04 深圳Tcl新技术有限公司 图像生成方法、装置、计算机设备和计算机可读存储介质
CN113742025A (zh) * 2021-09-17 2021-12-03 北京字跳网络技术有限公司 页面生成方法、装置、设备和存储介质
WO2023093721A1 (zh) * 2021-11-26 2023-06-01 维沃移动通信有限公司 资源召回方法、装置及网络侧设备
WO2023185431A1 (zh) * 2022-03-29 2023-10-05 北京字跳网络技术有限公司 卡片的显示方法、装置、电子设备、存储介质和程序产品
WO2024099284A1 (zh) * 2022-11-07 2024-05-16 北京字跳网络技术有限公司 页面显示方法、装置、设备、存储介质和程序产品
CN116401359A (zh) * 2023-06-09 2023-07-07 深圳前海环融联易信息科技服务有限公司 文档抽取方法及装置、介质、设备

Similar Documents

Publication Publication Date Title
CN112069339A (zh) 背景图片处理及搜索结果展示方法、装置、设备和介质
CN110780873B (zh) 界面颜色适配方法、装置、计算机设备及存储介质
CN112069341A (zh) 背景图片生成及搜索结果展示方法、装置、设备和介质
KR20200014842A (ko) 이미지 조명 방법, 장치, 전자 기기 및 저장 매체
CN105354248A (zh) 基于灰度的分布式图像底层特征识别方法及***
JP2005202469A (ja) 画像処理装置、画像処理方法、およびプログラム
JP2005151282A (ja) 画像処理装置、画像処理方法、およびプログラム
US11347792B2 (en) Video abstract generating method, apparatus, and storage medium
CN110990617B (zh) 一种图片标记方法、装置、设备及存储介质
CN108806638B (zh) 一种图像的显示方法及其装置
CN105981360A (zh) 图像处理设备、图像处理***、图像处理方法和记录介质
WO2023005743A1 (zh) 图像处理方法及装置、计算机设备、存储介质和计算机程序产品
CN112328345A (zh) 用于确定主题色的方法、装置、电子设备及可读存储介质
CN109064525A (zh) 一种图片格式转换方法、装置、设备和存储介质
CN110020645A (zh) 一种图像处理方法及装置、一种计算设备及存储介质
JP2006031688A (ja) 画像加工装置、画像加工方法及び画像加工プログラム
WO2016197705A1 (zh) 一种图像处理方法和装置
Li et al. Directive local color transfer based on dynamic look-up table
CN117112090A (zh) 业务页面主题生成方法、装置、计算机设备、介质和产品
CN111369431A (zh) 图像的处理方法、装置、可读介质和电子设备
CN114707013A (zh) 图像配色方法与装置、终端及可读存储介质
CN114494467A (zh) 图像色彩迁移方法、装置、电子设备和存储介质
CN111338627B (zh) 前端网页主题颜色调节方法及装置
WO2020166596A1 (ja) 画像処理システム及びプログラム
CN115147259A (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
CB02 Change of applicant information

Address after: 100041 B-0035, 2 floor, 3 building, 30 Shixing street, Shijingshan District, Beijing.

Applicant after: Douyin Vision Co.,Ltd.

Address before: 100041 B-0035, 2 floor, 3 building, 30 Shixing street, Shijingshan District, Beijing.

Applicant before: Tiktok vision (Beijing) Co.,Ltd.

Address after: 100041 B-0035, 2 floor, 3 building, 30 Shixing street, Shijingshan District, Beijing.

Applicant after: Tiktok vision (Beijing) Co.,Ltd.

Address before: 100041 B-0035, 2 floor, 3 building, 30 Shixing street, Shijingshan District, Beijing.

Applicant before: BEIJING BYTEDANCE NETWORK TECHNOLOGY Co.,Ltd.

CB02 Change of applicant information