CN110471658A - 一种图层的选择方法、系统及计算机存储介质 - Google Patents

一种图层的选择方法、系统及计算机存储介质 Download PDF

Info

Publication number
CN110471658A
CN110471658A CN201910617924.9A CN201910617924A CN110471658A CN 110471658 A CN110471658 A CN 110471658A CN 201910617924 A CN201910617924 A CN 201910617924A CN 110471658 A CN110471658 A CN 110471658A
Authority
CN
China
Prior art keywords
layer
coordinate
user
title
data
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.)
Granted
Application number
CN201910617924.9A
Other languages
English (en)
Other versions
CN110471658B (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.)
CHENGDU MIKE TECHNOLOGY Co Ltd
Original Assignee
CHENGDU MIKE 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 CHENGDU MIKE TECHNOLOGY Co Ltd filed Critical CHENGDU MIKE TECHNOLOGY Co Ltd
Priority to CN201910617924.9A priority Critical patent/CN110471658B/zh
Publication of CN110471658A publication Critical patent/CN110471658A/zh
Application granted granted Critical
Publication of CN110471658B publication Critical patent/CN110471658B/zh
Active legal-status Critical Current
Anticipated expiration legal-status Critical

Links

Classifications

    • 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/0487Interaction techniques based on graphical user interfaces [GUI] using specific features provided by the input device, e.g. functions controlled by the rotation of a mouse with dual sensing arrangements, or of the nature of the input device, e.g. tap gestures based on pressure sensed by a digitiser
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F8/00Arrangements for software engineering
    • G06F8/30Creation or generation of source code
    • G06F8/38Creation or generation of source code for implementing user interfaces

Landscapes

  • Engineering & Computer Science (AREA)
  • General Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • Human Computer Interaction (AREA)
  • Software Systems (AREA)
  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • User Interface Of Digital Computer (AREA)

Abstract

本发明提供了一种图层的选择方法、系统及计算机存储介质,涉及计算机应用技术领域,所述方法包括根据用户在浏览器页面中的鼠标点击坐标,并获取覆盖所述鼠标点击坐标位置的图层,判断图层的数量是否为多个,若是,则生成一个图层面板,该图层面板包含所述多个图层的图层名称,这样用户就可以基于这个图层面板选择自己所要选择图层对应的图层名称即可,系统就可以将用户选择的目标图层名称对应的图层选中。通过本发明可以有效减少用户针对重叠图层选择的操作步骤,节省用户的时间,从而极大的提高用户的设计工作效率。

Description

一种图层的选择方法、系统及计算机存储介质
技术领域
本发明涉及计算机应用技术领域,尤其涉及一种图层的选择方法、系统及计算机存储介质。
背景技术
随着越来越多的软件以提高用户的交互感受为竞争手段,因此UI设计(指对软件的人机交互、操作逻辑、界面美观的整体设计,即用户界面设计)对于提高软件的市场竞争力显得尤为重要,完美的设计交付必然是软件产品迈向成功的一个里程碑。
然而在实际的工作中,设计工具中的设计稿在网页显示时,可能在某一点存在多个重叠的图层,通常默认只能选中最上面的图层,若用户所需要选择的目标图层并非最上面的图层,则用户需要不断切换选中的图层,从而增加用户的操作步骤,浪费用户的时间,从而降低用户的设计工作的效率。
发明内容
本发明实施例提供一种图层的选择方法、系统及计算机存储介质,主要旨在解决现有技术中由于用户在面对多个重叠图层选择时,需要不断切换才能选中目标图层,而导致增加用户的操作步骤,浪费用户的时间,降低用户的设计工作的效率的技术问题。通过本发明实施例使用户能够快速且准确地选中自己所需要的目标图层,提高设计工作的效率。
第一方面,本发明实施例提供了一种图层的选择方法,所述方法具体包括:
根据用户在浏览器页面中的鼠标点击坐标,获取覆盖所述鼠标点击坐标位置的图层的数量N,N为自然数;
若N≥2时,则生成一个图层面板,所述图层面板包含所述N个图层的图层名称;
响应于用户根据所述图层面板选择的目标图层名称,则将所述目标图层名称对应的目标图层选中。
优选的,所述根据用户在浏览器页面中的鼠标点击坐标,获取覆盖所述鼠标点击坐标的图层的数量N,N为自然数,具体包括:
获取用户在浏览器页面中的鼠标点击坐标;
计算所述鼠标点击坐标对应于预设的标准平面直角坐标系中的目标位置坐标;
将所述目标位置坐标分别与图层数据信息库中的每个图层数据进行匹配;
将匹配成功的N个图层数据生成一个图层数据数组,N为自然数,每个图层数据为所述图层数据数组中的一个元素;
统计所述图层数据数组的元素个数N。
优选的,所述将所述目标位置坐标分别与图层数据信息库中的每个图层数据进行匹配,具体包括:
每个所述图层数据均包括图层位置信息和图层名称,所述图层位置信息为图层数据信息库中的每个图层在预设的标准平面直角坐标系中的坐标函数,将所述目标位置坐标分别与图层数据信息库中的每个图层数据包含的坐标函数进行解析,若所述目标位置坐标满足图层数据信息库中的图层数据包含的坐标函数,则所述目标位置坐标与图层数据信息库中的图层数据匹配成功,否则匹配失败。
优选的,所述若N≥2时,则生成一个图层面板,所述图层面板包含所述N个图层的图层名称,具体包括:
若N≥2时,则提取所述匹配成功的N个图层数据中包含的N个图层名称;
基于所述N个图层名称生成一个图层面板,所述图层面板包含所述N个图层名称,每个图层名称对应一个图层。
优选的,所述响应于用户根据所述图层面板选择目标图层名称,则将所述目标图层名称对应的目标图层选中,之前还包括:
检测用户在浏览器页面中的鼠标指针;
当所述鼠标指针移动至所述图层面板的第一图层名称对应的选框范围内时,突出显示所述第一图层名称对应的图层,所述第一图层名称为所述N个图层名称中的任意一个。
优选的,所述若N≥2时,则生成一个图层面板,所述图层面板包含所述N个图层的图层名称,每个图层名称对应一个图层,之后还包括:
接收用户将所述图层面板拖动至浏览器页面的目标位置处的确定信息;
以及,响应于用户发送的针对所述图层面板的锁定请求,将所述图层面板固定在浏览器页面的目标位置。
优选的,所述图层的选择方法还包括:
若N=1时,则将覆盖所述鼠标点击坐标的图层选中;
或者,
若N=0时,则继续执行根据用户在浏览器页面中的鼠标点击坐标,获取覆盖所述鼠标点击坐标的图层的数量N,N为自然数。
第二方面,本发明提供了一种图层的选择系统,所述系统包括:
获取模块,用于根据用户在浏览器页面中的鼠标点击坐标,获取覆盖所述鼠标点击坐标位置的图层的数量N,N为自然数;
生成模块,用于若N≥2时,则生成一个图层面板,所述图层面板包含所述N个图层的图层名称;
图层选择模块,用于响应于用户根据所述图层面板选择的目标图层名称,则将所述目标图层名称对应的目标图层选中。
优选的,所述获取模块,具体包括:
获取单元,用于获取用户在浏览器页面中的鼠标点击坐标;
计算单元,用于计算所述鼠标点击坐标对应于预设的标准平面直角坐标系中的目标位置坐标;
匹配单元,用于将所述目标位置坐标分别与图层数据信息库中的每个图层数据进行匹配;
生成单元,用于将匹配成功的N个图层数据生成一个图层数据数组,N为自然数,每个图层数据为所述图层数据数组中的一个元素;
统计单元,用于统计所述图层数据数组的元素个数N。
优选的,所述匹配单元,具体包括:
解析子单元,每个所述图层数据均包括图层位置信息和图层名称,所述图层位置信息为图层数据信息库中的每个图层在预设的标准平面直角坐标系中的坐标函数,所述解析子单元用于将所述目标位置坐标分别与图层数据信息库中的每个图层数据包含的坐标函数进行解析;
确定子单元,用于若所述目标位置坐标满足图层数据信息库中的图层数据包含的坐标函数,则确定所述目标位置坐标与图层数据信息库中的图层数据匹配成功,否则确定所述目标位置坐标与图层数据信息库中的图层数据匹配失败。
优选的,生成模块,具体包括:
提取单元,用于若N≥2时,则提取所述匹配成功的N个图层数据中包含的N个图层名称;
图层面板生成单元,用于基于所述N个图层名称生成一个图层面板,所述图层面板包含所述N个图层名称,每个图层名称对应一个图层。
优选的,所述图层的选择系统还包括:
检测模块,用于检测用户在浏览器页面中的鼠标指针;
显示模块,用于当所述鼠标指针移动至所述图层面板的第一图层名称对应的选框范围内时,突出显示所述第一图层名称对应的图层,所述第一图层名称为所述N个图层名称中的任意一个。
优选的,所述图层的选择系统还包括:
接收模块,用于接收用户将所述图层面板拖动至浏览器页面的目标位置处的确定信息,所述目标位置为浏览器页面中的任意位置;
锁定模块,用于响应于用户发送的针对所述图层面板的锁定请求,所述锁定请求包括所述目标位置,将所述图层面板固定在浏览器页面的所述目标位置。
优选的,所述图层选择模块还用于若N=1时,则将覆盖所述鼠标点击坐标的图层选中;
或者,
若N=0时,则触发所述获取模块执行步骤:根据用户在浏览器页面中的鼠标点击坐标,获取覆盖所述鼠标点击坐标的图层的数量N,N为自然数。
第三方面,本发明还提供了一种计算机可读存储介质,所述计算机可读存储介质存储有计算机程序,所述计算机程序被处理器执行时实现上述方法实施例中记载的任何一种图层的选择方法的部分或全部步骤。
有益效果:本发明实施例与现有技术相比,主要根据用户在浏览器页面中的鼠标点击坐标,并获取覆盖所述鼠标点击坐标的图层,判断图层的数量是否为多个,若是,则生成一个图层面板,该图层面板包含所述多个图层的图层名称,这样用户就可以基于这个图层面板选择自己所要选择图层对应的图层名称即可,系统就可以将用户选择的目标图层名称对应的图层选中。通过本发明实施例可以有效减少用户针对重叠图层选择的操作步骤,节省用户的时间,从而极大的提高用户的设计工作效率。
附图说明
为了更清楚地说明本发明实施例或现有技术中的技术方案,下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍,显而易见地,下面描述中的附图仅仅是本发明的一些实施例,对于本领域普通技术人员来讲,在不付出创造性劳动的前提下,还可以根据这些附图获得其他的附图。
图1为本发明实施例提供的一种图层的选择方法的流程示意图;
图2为本发明实施例提供的一种图层的选择方法中的图层面板的结构示意图;
图3为本发明实施例提供另的一种图层的选择方法的流程示意图;
图4为本发明实施例提供的一种图层的选择系统的结构示意图。
具体实施方式
为了使本技术领域的人员更好地理解本发明方案,下面将结合本发明实施例中的附图,对本发明实施例中的技术方案进行清楚、完整地描述,显然,所描述的实施例仅仅是本发明一部分的实施例,而不是全部的实施例。基于本发明中的实施例,本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例,都应当属于本发明保护的范围。
下面将结合附图对本申请的实施例进行描述,但并非对本发明的限制。
实施例一
根据本发明的一个方面,提供了一种图层的选择方法,具体包括以下步骤,如图1所示:
步骤10,根据用户在浏览器页面中的鼠标点击坐标,获取覆盖所述鼠标点击坐标位置的图层的数量N,N为自然数;
需要说明的是,本发明实施例中的执行主体可以包括网元侧,即网管系统中可以监视和管理的最小单位,也可以包括服务器,该服务器具有大数据运算及处理的功能,例如分布式运算系统架构hadoop可以完成大数据量的运算。
通过JavaScript技术识别并收集用户在浏览器页面中的鼠标点击坐标,JavaScript是一种直译式脚本语言,其解释器被称为JavaScript引擎,为浏览器的一部分,广泛用于客户端的脚本语言。
进一步的,将收集的用户在浏览器页面中的鼠标点击坐标进行圆滑规范化处理,例如,假设前端JavaScript是以10个像素为坐标系的单位,若获取到的用户鼠标点击坐标为(23,101),对该坐标进行圆滑规范化处理,将其归入最近的坐标位置,即归入(20,100)对应的位置,这种处理方式有利于减少系统负担。
根据收集的鼠标点击坐标获取覆盖该坐标点位置的图层,具体的,系统将收集的鼠标点击坐标与系统存储的图层进行匹配,例如,若图层为一个标准圆形,在平面直角坐标系中,设有圆O,圆心O(a,b),坐标点P(x,y)是圆上任意一点,且满足以下关系式:
(x-a)2+(y-b)2=r2
其中,r为上述圆形的半径。
设上述收集的鼠标点击坐标在平面直角坐标系中的坐标点为P1(x1,y1),则坐标点P1(x1,y1)与圆(x-a)2+(y-b)2=r2的位置关系为:
⑴当(x1-a)2+(y1-b)2>r2时,则坐标点P1在圆外。
⑵当(x1-a)2+(y1-b)2=r2时,则坐标点P1在圆上。
⑶当(x1-a)2+(y1-b)2<r2时,则坐标点P1在圆内。
通过上述方法即可判断所述鼠标点击坐标是否在图层内,若所述鼠标点击坐标在图层内,即该图层为覆盖所述鼠标点击坐标位置的图层。
又例如,若图层为一个矩形,记P2(x2,y2)、P3(x3,y3)、P4(x4,y4),首先,假设已知的三个顶点构成的三角形里P3(x1,y1)是直角顶点;
然后根据以下公式可以算出第四个顶点:
P5=(x5,y5)=(x2+x3+x4-2*x3,y2+y3+y4-2*y3)
最后计算四个三角形的面积和|P1P2P3|+|P1P3P4|+|P1P4P5|+|P1P5P2|
将面积和|P1P2P3|+|P1P3P4|+|P1P4P5|+|P1P5P2|与所述矩形面积进行比较,如果一样大则表示坐标点P1(x1,y1)在矩形内(含边界),否则表示坐标点为P1(x1,y1)在矩形外,从而判断该矩形是否为覆盖所述鼠标点击坐标位置的图层。
进一步的,还可以利用在平面直角坐标系中从坐标点P1(x1,y1)处向平面直角坐标系的X轴发射一条射线,计算射线与图层图形的边的相交次数,如果次数为偶数,则坐标点P1(x1,y1)位于该图层的外面,如果次数为奇数,则坐标点P1(x1,y1)位于该图层内,由此判断该图层是否为覆盖所述鼠标点击坐标位置的图层。
步骤20,若N≥2时,则生成一个图层面板,所述图层面板包含所述N个图层的图层名称,每个图层名称对应一个图层;
根据上述方法,系统根据用户在浏览器页面中的鼠标点击坐标,获取覆盖所述鼠标点击坐标位置的图层,并统计获取的图层数量N,N为自然数。当N≥2时,表示在该鼠标点击坐标处,存在多个图层,在这样的情况下,用户想要选中自己的目标图层,可能需要不断切换选择的图层,才能选中目标图层,因此,在所述鼠标点击坐标处的图层数量为多个时,系统生成一个图层面板,该图层面板包含该多个图层的图层名称,每个图层名称对应一个图层。
如图2所示,为所述图层面板的结构示意图。
具体的,用户可以根据图层面板提供的图层名称列表,自由选择自己所需选择的目标图层名称,系统即可将该目标图层名称对应的图层选中。用户根据该列表选择一个自己所需的目标图层名称,系统根据该目标图层名称,将该目标图层名称对应的图层选中,从而用户可以实现在重叠图层中可以快速选择出自己所要选择的目标图层,从而有效的减少用户针对重叠图层选择的操作步骤,节省用户的时间,从而极大的提高了用户的设计工作效率。
进一步的,在图层面板上,用户还可对图层名称进行修改,便于区分不同图层,提高用户针对图层的选择效率。
步骤30,响应于用户根据所述图层面板选择的目标图层名称,则将所述目标图层名称对应的目标图层选中。
有益效果:本发明实施例与现有技术相比,主要根据用户在浏览器页面中的鼠标点击坐标,并获取覆盖所述鼠标点击坐标位置的图层,判断图层的数量是否为多个,若是,则生成一个图层面板,该图层面板包含所述多个图层的图层名称,这样用户就可以基于这个图层面板选择自己所要选择图层对应的图层名称即可,系统就可以将用户选择的目标图层名称对应的图层选中。通过本发明实施例可以有效减少用户针对重叠图层选择的操作步骤,节省用户的时间,从而极大的提高用户的设计工作效率。
实施例二
如图3所示,本发明实施例还提供了一种图层的选择方法,具体包括以下步骤:
步骤10,根据用户在浏览器页面中的鼠标点击坐标,获取覆盖所述鼠标点击坐标位置的图层的数量N,N为自然数;
进一步的,步骤10具体还可以包括以下步骤:
步骤101,获取用户在浏览器页面中的鼠标点击坐标;
步骤102,计算所述鼠标点击坐标对应于预设的标准平面直角坐标系中的目标位置坐标;
步骤103,将所述目标位置坐标分别与图层数据信息库中的每个图层数据进行匹配;
步骤104,将匹配成功的N个图层数据生成一个图层数据数组,N为自然数,每个图层数据为所述图层数据数组中的一个元素;
步骤105,统计所述图层数据数组的元素个数N。
需要说明的是,可以通过JavaScript技术识别并收集用户在浏览器页面中的鼠标点击坐标,计算该鼠标点击坐标对应于预设的标准平面直角坐标系中的目标位置坐标,预先设置标准平面直角坐标系,是为了使用户在浏览器页面中的鼠标点击坐标以及图层数据信息库中的图层数据包含的坐标信息,能够统一坐标尺寸的标准,便于判断上述用户在浏览器页面中的鼠标点击坐标是否位于图层数据信息库中的图层内,将覆盖了所述用户在浏览器页面中的鼠标点击坐标位置的图层对应的图层数据,生成一个图层数据数组,每个图层数据作为该数组的一个元素,从而统计该数组内的元素个数,即为覆盖所述用户在浏览器页面中的鼠标点击坐标位置的图层数量N。
进一步的,步骤103,将所述目标位置坐标分别与图层数据信息库中的每个图层数据进行匹配,具体的还可以包括:
每个所述图层数据均包括图层位置信息和图层名称,所述图层位置信息包括图层数据信息库中的每个图层在预设的标准平面直角坐标系中的坐标函数,将所述目标位置坐标分别与图层数据信息库中的每个图层数据包含的坐标函数进行解析,若所述目标位置坐标满足图层数据信息库中的图层数据包含的坐标函数,则所述目标位置坐标与图层数据信息库中的图层数据匹配成功,否则匹配失败。
需要说明的是,一个点如果在某个图像上,那么这个点的坐标一定满足该图像对应的图像函数的解析式,即这个点的坐标使函数解析式左右两边的值相等,或者,这个点的坐标使函数解析式的因变量小于该函数的函数值;反之,一个点的坐标如果满足某个图像对应的图像函数解析式,那么这个点一定在该函数对应的图像上。
通过上述方法即可判断所述目标位置坐标是否在某个图层内,若所述目标位置坐标满足某个图层数据的坐标函数,即所述目标位置坐标与该图层数据匹配成功,则表示所述目标位置坐标在该图层数据对应的图层内。通过预先设置每个图层对应的图像函数,将所述目标位置坐标分别与每个图像函数进行匹配,可快速且准确的找到覆盖用户在浏览器页面中的鼠标点击坐标位置的图层,提高匹配的效率,从而快速判断在该鼠标点击坐标处是否存在多个图层,如果是,则系统会根据检测出的多个图层的图层名称生成一个图层面板,供用户选择,提高系统的响应速度,从而有效的减少用户针对重叠图层选择的操作步骤,节省用户的时间,从而极大的提高用户的设计工作效率。
步骤20,若N≥2时,则生成一个图层面板,所述图层面板包含所述N个图层的图层名称,每个图层名称对应一个图层;
进一步的,步骤20还可以具体包括以下步骤:
步骤201,若N≥2时,则提取所述匹配成功的N个图层数据中包含的N个图层名称;
步骤202,基于所述N个图层名称生成一个图层面板,所述图层面板包含所述N个图层名称,每个图层名称对应一个图层。
具体的,每个所述图层数据均包括图层位置信息和图层名称,获取上述匹配成功的所有图层,并将这些匹配成功的图层对应的图层数据中包含的图层名称提取出来,根据提取出来的图层名称生成一个图层面板,具体的,可以包括一种提供图层名称的列表,以便供用户可以自由选择列表中的图层名称,进一步的,用户也可以在该列表中针对图层名称进行修改,便于区分不同图层。用户根据该列表选择一个自己所需的目标图层名称,系统根据该目标图层名称,将该目标图层名称对应的图层选中,从而用户可以实现在重叠图层中可以快速选择出自己所要选择的目标图层,从而有效的减少用户针对重叠图层选择的操作步骤,节省用户的时间,从而极大的提高用户的设计工作效率。
上述情况是在统计所述图层数据数组的元素个数为多个的情况,即,用户在浏览器页面中的鼠标点击坐标处,存在多个图层的情况。进一步的,还包括:若N=1时,则将覆盖所述鼠标点击坐标位置的图层选中。
当N=1时,即在所述鼠标点击坐标处只存在一个图层的情况,则系统将覆盖所述鼠标点击坐标位置的图层直接选中即可,而不用再生成图层面板供用户选择,减少服务器的处理时间,提高系统响应效率,同时也提高用户设计工作的效率。
进一步的,还包括:若N=0时,则返回继续执行步骤:根据用户在浏览器页面中的鼠标点击坐标,获取覆盖所述鼠标点击坐标位置的图层的数量N,N为自然数。
若N=0时,即在所述鼠标点击坐标处没有图层覆盖,则系统将返回继续执行步骤10,根据用户在浏览器页面中的鼠标点击坐标,获取覆盖所述鼠标点击坐标位置的图层的数量N,N为自然数,直至系统检测到用户在浏览器页面中的鼠标点击坐标处有覆盖的图层。
进一步的,在步骤20,若N≥2时,则生成一个图层面板,所述图层面板包含所述N个图层的图层名称,每个图层名称对应一个图层之后,所述图层的选择方法还包括:
步骤40,接收用户将所述图层面板拖动至浏览器页面的目标位置处的确定信息;
步骤50,响应于用户发送的针对所述图层面板的锁定请求,将所述图层面板固定在浏览器页面的目标位置。
需要说明的是,用户将生成的图层面板拖动至浏览器页面的目标位置处,这里的目标位置由用户自由选择,以便于避免所述图层面板遮挡住图层,不利于用户针对图层的选择操作,当用户将图层面板拖动至目标位置处,向系统发送锁定所述图层面板的“锁定请求”,系统将所述图层面板固定于所述目标位置,以便于每次触发针对上述同一图层面板时,该图层面板均会显示在固定的目标位置,而不需要用户每次都要调整图层面板的显示位置,提高用户对产品的使用黏性度和设计效率。
进一步的,在步骤30,响应于用户根据所述图层面板选择目标图层名称,则将所述目标图层名称对应的目标图层选中之前,所述图层的选择方法还包括:
步骤60,检测用户在浏览器页面中的鼠标指针;
步骤70,当所述鼠标指针移动至所述图层面板的第一图层名称对应的选框范围内时,突出显示所述第一图层名称对应的图层,所述第一图层名称为所述N个图层名称中的任意一个。
需要说明的是,检测用户在浏览器页面中的鼠标指针,当鼠标指针位于所述图层面板的第一图层名称对应的选框范围内时,突出显示所述第一图层名称对应的图层,例如,当鼠标指针位于某一图层名称上方时,突出显示该图层名称对应的图层边界,方便用户快速且直观的判断出该突出显示的图层是否是自己所要选择的目标图层,如果不是,只需继续移动鼠标,查看下一个图层,而不需要频繁的点击图层名称而多次切换所选中的图层,提高用户设计工作的效率和产品使用的黏性度。上述突出显示的方式也可以是将第一图层名称对应的图层以凸显的颜色加以区分,对此,本发明实施例不做具体的限定。
步骤30,响应于用户根据所述图层面板选择目标图层名称,则将所述目标图层名称对应的目标图层选中。
有益效果:本发明实施例与现有技术相比,主要根据用户在浏览器页面中的鼠标点击坐标,并获取覆盖所述鼠标点击坐标位置的图层,预先设置标准平面直角坐标系,计算所述鼠标点击坐标对应于预设的标准平面直角坐标系中的目标位置坐标,将所述目标位置坐标分别与图层数据信息库中的每个图层数据的图像函数进行解析,可快速且准确的找到覆盖用户在浏览器页面中的鼠标点击坐标位置的图层,从而快速判断在该鼠标点击坐标处是否存在多个图层,若是,则生成一个图层面板,该图层面板包含所述多个图层的图层名称,这样用户就可以基于这个图层面板选择自己所要选择图层对应的图层名称即可,系统就可以将用户选择的目标图层名称对应的图层选中。通过本发明实施例可以有效减少用户针对重叠图层选择的操作步骤,节省用户的时间,从而极大的提高用户的设计工作效率。同时,在所述鼠标点击坐标处只存在一个图层的情况下,系统将覆盖所述鼠标点击坐标位置的图层直接选中即可,而不用再生成图层面板供用户选择,减少服务器的处理时间,提高系统响应效率,进一步的提高用户设计工作的效率。同时,在用户根据图层面板目标图层名称之前,用户可通过移动鼠标查看即将选择的图层是否为目标图层,而不需要频繁的点击图层名称而多次切换所选中的图层,进一步的提高用户设计工作的效率。进一步,系统可将用户选择的图层面板显示的目标位置进行固定,以避免图层面板遮挡住图层,不利于用户针对图层的选择操作,且用户不需要每次针对同一图层面板都要调整其显示位置,进一步的提高产品设计效率。
实施例三
本发明实施例提供了一种图层的选择系统,如图4所示,图4为一种图层的选择系统400的结构示意图,所述系统具体包括:
获取模块410,用于根据用户在浏览器页面中的鼠标点击坐标,获取覆盖所述鼠标点击坐标位置的图层的数量N,N为自然数;
生成模块420,用于若N≥2时,则生成一个图层面板,所述图层面板包含所述N个图层的图层名称;
图层选择模块430,用于响应于用户根据所述图层面板选择的目标图层名称,则将所述目标图层名称对应的目标图层选中。
进一步的,所述获取模块410,具体包括:
获取单元,用于获取用户在浏览器页面中的鼠标点击坐标;
计算单元,用于计算所述鼠标点击坐标对应于预设的标准平面直角坐标系中的目标位置坐标;
匹配单元,用于将所述目标位置坐标分别与图层数据信息库中的每个图层数据进行匹配;
生成单元,用于将匹配成功的N个图层数据生成一个图层数据数组,N为自然数,每个图层数据为所述图层数据数组中的一个元素;
统计单元,用于统计所述图层数据数组的元素个数N。
进一步的,所述匹配单元,具体包括:
解析子单元,每个所述图层数据均包括图层位置信息和图层名称,所述图层位置信息为图层数据信息库中的每个图层在预设的标准平面直角坐标系中的坐标函数,所述解析子单元用于将所述目标位置坐标分别与图层数据信息库中的每个图层数据包含的坐标函数进行解析;
确定子单元,用于若所述目标位置坐标满足图层数据信息库中的图层数据包含的坐标函数,则确定所述目标位置坐标与图层数据信息库中的图层数据匹配成功,否则确定所述目标位置坐标分别与图层数据信息库中的每一个图层数据匹配失败。
进一步的,生成模块420,具体包括:
提取单元,用于若N≥2时,则提取所述匹配成功的N个图层数据中包含的N个图层名称;
图层面板生成单元,用于基于所述N个图层名称生成一个图层面板,所述图层面板包含所述N个图层名称,每个图层名称对应一个图层。
进一步的,所述图层的选择系统400还包括:
检测模块,用于检测用户在浏览器页面中的鼠标指针;
显示模块,用于当所述鼠标指针移动至所述图层面板的第一图层名称对应的选框范围内时,突出显示所述第一图层名称对应的图层,所述第一图层名称为所述N个图层名称中的任意一个。
进一步的,所述图层的选择系统400还包括:
接收模块,用于接收用户将所述图层面板拖动至浏览器页面的目标位置处的确定信息,所述目标位置为浏览器页面中的任意位置;
锁定模块,用于响应于用户发送的针对所述图层面板的锁定请求,所述锁定请求包括所述目标位置,将所述图层面板固定在浏览器页面的所述目标位置。
进一步的,所述图层选择模块430还用于若N=1时,则将覆盖所述鼠标点击坐标位置的图层选中;
或者,
若N=0时,则触发所述获取模块执行步骤:根据用户在浏览器页面中的鼠标点击坐标,获取覆盖所述鼠标点击坐标位置的图层的数量N,N为自然数。
本发明实施例一种图层的选择系统400是对应上述实施例一种图层的选择方法,在所述图层的选择系统400中还包括若干单元,用于对应上述一种图层的选择方法的相应步骤,实现相应的功能。由于上述实施例中已经对一种图层的选择方法的步骤进行了详细的说明,故在此系统400中不再赘述。
有益效果:本发明实施例与现有技术相比,主要根据用户在浏览器页面中的鼠标点击坐标,并获取覆盖所述鼠标点击坐标位置的图层,判断图层的数量是否为多个,若是,则生成一个图层面板,该图层面板包含所述多个图层的图层名称,这样用户就可以基于这个图层面板选择自己所要选择图层对应的图层名称即可,系统就可以将用户选择的目标图层名称对应的图层选中。通过本发明实施例可以有效减少用户针对重叠图层选择的操作步骤,节省用户的时间,从而极大的提高用户的设计工作效率。
实施例四
本发明实施例还提供了一种计算机可读存储介质,所述计算机可读存储介质存储有计算机程序,其特征在于,所述计算机程序被处理器执行时实现上述方法实施例中记载的任何一种图层的选择方法的部分或全部步骤。
需要说明的是,对于前述的各方法实施例,为了简单描述,故将其都表述为一系列的动作组合,但是本领域技术人员应该知悉,本发明并不受所描述的动作顺序的限制,因为依据本发明,某些步骤可以采用其他顺序或者同时进行。其次,本领域技术人员也应该知悉,说明书中所描述的实施例均属于优选实施例,所涉及的动作和模块并不一定是本发明所必须的。
在上述实施例中,对各个实施例的描述都各有侧重,某个实施例中没有详述的部分,可以参见其他实施例的相关描述。
另外,在本发明各个实施例中的各功能单元可以集成在一个处理单元中,也可以是各个单元单独物理存在,也可以两个或两个以上单元集成在一个单元中。上述集成的单元既可以采用硬件的形式实现,也可以采用软件功能单元的形式实现。
以上对本发明实施例进行了详细介绍,本文中应用了具体个例对本发明的原理及实施方式进行了阐述,以上实施例的说明只是用于帮助理解本发明的方法及其核心思想;同时,对于本领域的一般技术人员,依据本发明的思想,在具体实施方式及应用范围上均会有改变之处,综上所述,本说明书内容不应理解为对本发明的限制。

Claims (10)

1.一种图层的选择方法,其特征在于,所述方法包括:
根据用户在浏览器页面中的鼠标点击坐标,获取覆盖所述鼠标点击坐标位置的图层的数量N,N为自然数;
若N≥2时,则生成一个图层面板,所述图层面板包含所述N个图层的图层名称,每个图层名称对应一个图层;
响应于用户根据所述图层面板选择的目标图层名称,则将所述目标图层名称对应的目标图层选中。
2.根据权利要求1所述的图层的选择方法,其特征在于,所述根据用户在浏览器页面中的鼠标点击坐标,获取覆盖所述鼠标点击坐标的图层的数量N,N为自然数,具体包括:
获取用户在浏览器页面中的鼠标点击坐标;
计算所述鼠标点击坐标对应于预设的标准平面直角坐标系中的目标位置坐标;
将所述目标位置坐标分别与图层数据信息库中的每个图层数据进行匹配;
将匹配成功的N个图层数据生成一个图层数据数组,N为自然数,每个图层数据为所述图层数据数组中的一个元素;
统计所述图层数据数组的元素个数N。
3.根据权利要求2所述的图层的选择方法,其特征在于,所述将所述目标位置坐标分别与图层数据信息库中的每个图层数据进行匹配,具体包括:
每个所述图层数据均包括图层位置信息和图层名称,所述图层位置信息包括图层数据信息库中的每个图层在预设的标准平面直角坐标系中的坐标函数,将所述目标位置坐标分别与图层数据信息库中的每个图层数据包含的坐标函数进行解析,若所述目标位置坐标满足图层数据信息库中的图层数据包含的坐标函数,则所述目标位置坐标与图层数据信息库中的图层数据匹配成功,否则匹配失败。
4.根据权利要求3所述的图层的选择方法,其特征在于,所述若N≥2时,则生成一个图层面板,所述图层面板包含所述N个图层的图层名称,具体包括:
若N≥2时,则提取所述匹配成功的N个图层数据中包含的N个图层名称;
基于所述N个图层名称生成一个图层面板,所述图层面板包含所述N个图层名称,每个图层名称对应一个图层。
5.根据权利要求1-4任一项所述的图层的选择方法,其特征在于,所述响应于用户根据所述图层面板选择目标图层名称,则将所述目标图层名称对应的目标图层选中,之前还包括:
检测用户在浏览器页面中的鼠标指针;
当所述鼠标指针移动至所述图层面板的第一图层名称对应的选框范围内时,突出显示所述第一图层名称对应的图层,所述第一图层名称为所述N个图层名称中的任意一个。
6.根据权利要求5所述的图层的选择方法,其特征在于,所述若N≥2时,则生成一个图层面板,所述图层面板包含所述N个图层的图层名称,每个图层名称对应一个图层,之后还包括:
接收用户将所述图层面板拖动至浏览器页面的目标位置处的确定信息;
以及,响应于用户发送的针对所述图层面板的锁定请求,将所述图层面板固定在浏览器页面的目标位置。
7.根据权利要求1所述的图层的选择方法,其特征在于,所述方法还包括:
若N=1时,则将覆盖所述鼠标点击坐标的图层选中;
或者,
若N=0时,则返回继续执行步骤:根据用户在浏览器页面中的鼠标点击坐标,获取覆盖所述鼠标点击坐标的图层的数量N,N为自然数。
8.一种图层的选择系统,其特征在于,所述系统具体包括:
获取模块,用于根据用户在浏览器页面中的鼠标点击坐标,获取覆盖所述鼠标点击坐标位置的图层的数量N,N为自然数;
生成模块,用于若N≥2时,则生成一个图层面板,所述图层面板包含所述N个图层的图层名称;
图层选择模块,用于响应于用户根据所述图层面板选择的目标图层名称,则将所述目标图层名称对应的目标图层选中。
9.根据权利要求8所述的图层的选择系统,其特征在于,所述获取模块,具体包括:
获取单元,用于获取用户在浏览器页面中的鼠标点击坐标;
计算单元,用于计算所述鼠标点击坐标对应于预设的标准平面直角坐标系中的目标位置坐标;
匹配单元,用于将所述目标位置坐标分别与图层数据信息库中的每个图层数据进行匹配;
生成单元,用于将匹配成功的N个图层数据生成一个图层数据数组,N为自然数,每个图层数据为所述图层数据数组中的一个元素;
统计单元,用于统计所述图层数据数组的元素个数N。
10.一种计算机可读存储介质,所述计算机可读存储介质存储有计算机程序,其特征在于,执行所述计算机程序时实现如权利要求1至7任一项所述的一种图层的选择方法的步骤。
CN201910617924.9A 2019-07-10 2019-07-10 一种图层的选择方法、系统及计算机存储介质 Active CN110471658B (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN201910617924.9A CN110471658B (zh) 2019-07-10 2019-07-10 一种图层的选择方法、系统及计算机存储介质

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN201910617924.9A CN110471658B (zh) 2019-07-10 2019-07-10 一种图层的选择方法、系统及计算机存储介质

Publications (2)

Publication Number Publication Date
CN110471658A true CN110471658A (zh) 2019-11-19
CN110471658B CN110471658B (zh) 2023-04-28

Family

ID=68507574

Family Applications (1)

Application Number Title Priority Date Filing Date
CN201910617924.9A Active CN110471658B (zh) 2019-07-10 2019-07-10 一种图层的选择方法、系统及计算机存储介质

Country Status (1)

Country Link
CN (1) CN110471658B (zh)

Cited By (5)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN111580729A (zh) * 2020-04-22 2020-08-25 江西博微新技术有限公司 一种重叠图元选中的处理方法、系统、可读存储介质及电子设备
CN111782114A (zh) * 2020-06-15 2020-10-16 广州视源电子科技股份有限公司 文稿编辑应用中的元素展示方法、装置、设备及介质
CN113485707A (zh) * 2021-07-26 2021-10-08 亿览在线网络技术(北京)有限公司 一种ui界面自动校对的方法
CN113641288A (zh) * 2021-10-10 2021-11-12 北京易言科技有限公司 基于汉字构成单元的汉字拼接和调整方法、装置
CN113703652A (zh) * 2021-08-31 2021-11-26 重庆杰夫与友文化创意有限公司 图像处理方法、系统及存储介质

Citations (14)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20040216036A1 (en) * 2002-09-13 2004-10-28 Yahoo! Inc. Browser user interface
US20080059889A1 (en) * 2006-09-01 2008-03-06 Cheryl Parker System and Method of Overlaying and Integrating Data with Geographic Mapping Applications
CN103888685A (zh) * 2014-03-28 2014-06-25 广东威创视讯科技股份有限公司 拼接显示装置显示控制方法及系统
CN103995090A (zh) * 2014-06-06 2014-08-20 重庆大学 产品工业设计表达材质用户体验测试方法及其体验测试仪
US20140380246A1 (en) * 2013-06-24 2014-12-25 Aol Inc. Systems and methods for multi-layer user content navigation
AU2015243058A1 (en) * 2002-09-26 2015-11-05 Kenji Yoshida Information reproduction i/o method using dot pattern, information reproduction device, mobile information i/o device, and electronic toy
CN105847980A (zh) * 2016-03-29 2016-08-10 青岛海信电器股份有限公司 一种控制信号转发方法、装置和电视机
CN106502506A (zh) * 2016-11-01 2017-03-15 上海爱数信息技术股份有限公司 网页中文档的标注方法、系统及电子设备
CN106814932A (zh) * 2016-11-29 2017-06-09 深圳市金立通信设备有限公司 一种桌面壁纸显示方法及终端
CN106815029A (zh) * 2017-01-24 2017-06-09 南京仁谷系统集成有限公司 一种使用Qt进行二维图层的绘制及事件处理方法
CN106873824A (zh) * 2016-12-31 2017-06-20 歌尔科技有限公司 使用触摸屏模拟鼠标操作的方法和装置及头戴显示设备
CN107203383A (zh) * 2017-05-25 2017-09-26 努比亚技术有限公司 一种用户界面调整方法及移动终端
CN108256167A (zh) * 2017-12-25 2018-07-06 巧夺天宫(深圳)科技有限公司 一种浮动图层设计系统、设计方法及电子设备
CN109388461A (zh) * 2018-09-27 2019-02-26 青岛海信电器股份有限公司 屏幕画面截图中识别物体的显示方法、装置及显示终端

Patent Citations (14)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20040216036A1 (en) * 2002-09-13 2004-10-28 Yahoo! Inc. Browser user interface
AU2015243058A1 (en) * 2002-09-26 2015-11-05 Kenji Yoshida Information reproduction i/o method using dot pattern, information reproduction device, mobile information i/o device, and electronic toy
US20080059889A1 (en) * 2006-09-01 2008-03-06 Cheryl Parker System and Method of Overlaying and Integrating Data with Geographic Mapping Applications
US20140380246A1 (en) * 2013-06-24 2014-12-25 Aol Inc. Systems and methods for multi-layer user content navigation
CN103888685A (zh) * 2014-03-28 2014-06-25 广东威创视讯科技股份有限公司 拼接显示装置显示控制方法及系统
CN103995090A (zh) * 2014-06-06 2014-08-20 重庆大学 产品工业设计表达材质用户体验测试方法及其体验测试仪
CN105847980A (zh) * 2016-03-29 2016-08-10 青岛海信电器股份有限公司 一种控制信号转发方法、装置和电视机
CN106502506A (zh) * 2016-11-01 2017-03-15 上海爱数信息技术股份有限公司 网页中文档的标注方法、系统及电子设备
CN106814932A (zh) * 2016-11-29 2017-06-09 深圳市金立通信设备有限公司 一种桌面壁纸显示方法及终端
CN106873824A (zh) * 2016-12-31 2017-06-20 歌尔科技有限公司 使用触摸屏模拟鼠标操作的方法和装置及头戴显示设备
CN106815029A (zh) * 2017-01-24 2017-06-09 南京仁谷系统集成有限公司 一种使用Qt进行二维图层的绘制及事件处理方法
CN107203383A (zh) * 2017-05-25 2017-09-26 努比亚技术有限公司 一种用户界面调整方法及移动终端
CN108256167A (zh) * 2017-12-25 2018-07-06 巧夺天宫(深圳)科技有限公司 一种浮动图层设计系统、设计方法及电子设备
CN109388461A (zh) * 2018-09-27 2019-02-26 青岛海信电器股份有限公司 屏幕画面截图中识别物体的显示方法、装置及显示终端

Non-Patent Citations (5)

* Cited by examiner, † Cited by third party
Title
SIMON MEERS: "Haptic Gaze-Tracking Based Perception of Graphical User Interfaces", 《2007 11TH INTERNATIONAL CONFERENCE INFORMATION VISUALIZATION (IV "07)》 *
SRIRAM SUBRAMANIAN: "Multi-layer interaction for digital tables", 《UIST "06: PROCEEDINGS OF THE 19TH ANNUAL ACM SYMPOSIUM ON USER INTERFACE SOFTWARE AND TECHNOLOGY》 *
张岩: "基于地形影像可视化技术研究", 《中国优秀硕士学位论文全文数据库 (基础科学辑)》 *
彭立彪: "基于WEB的网页动画引擎IDE系统的设计与实现", 《中国优秀硕士学位论文全文数据库 (信息科技辑)》 *
胖胖的河马君X: "「Sketch超实用教程」图层上的优雅技巧", 《HTTPS://BAIJIAHAO.BAIDU.COM/S?ID=1637335981736154360&WFR=SPIDER&FOR=PC》 *

Cited By (6)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN111580729A (zh) * 2020-04-22 2020-08-25 江西博微新技术有限公司 一种重叠图元选中的处理方法、系统、可读存储介质及电子设备
CN111580729B (zh) * 2020-04-22 2021-07-13 江西博微新技术有限公司 一种重叠图元选中的处理方法、系统、可读存储介质及电子设备
CN111782114A (zh) * 2020-06-15 2020-10-16 广州视源电子科技股份有限公司 文稿编辑应用中的元素展示方法、装置、设备及介质
CN113485707A (zh) * 2021-07-26 2021-10-08 亿览在线网络技术(北京)有限公司 一种ui界面自动校对的方法
CN113703652A (zh) * 2021-08-31 2021-11-26 重庆杰夫与友文化创意有限公司 图像处理方法、系统及存储介质
CN113641288A (zh) * 2021-10-10 2021-11-12 北京易言科技有限公司 基于汉字构成单元的汉字拼接和调整方法、装置

Also Published As

Publication number Publication date
CN110471658B (zh) 2023-04-28

Similar Documents

Publication Publication Date Title
CN110471658A (zh) 一种图层的选择方法、系统及计算机存储介质
US20230152962A1 (en) Techniques for image-based search using touch controls
JP5062819B2 (ja) 画像処理装置、画像処理方法、プログラムおよび記録媒体
US8533173B2 (en) Generating search query suggestions
US20110197116A1 (en) Method and apparatus for selecting hyperlinks
US20150007024A1 (en) Method and apparatus for generating image file
USRE48715E1 (en) Organizing media items based on metadata similarities
CN107066188B (zh) 一种发送截屏图片的方法及终端
CA2862431A1 (en) Method of displaying input during a collaboration session and interactive board employing same
CN102855068B (zh) 界面操作控制方法、装置及电子设备
CN104217150A (zh) 一种用于调用应用的方法与装置
CN103064627A (zh) 一种应用程序管理方法及装置
US20190385030A1 (en) Page analysis method and apparatus
CN108307068A (zh) 副屏显示界面切换方法、移动终端及存储介质
CN106201204A (zh) 启动应用功能的方法和装置
CN107577404B (zh) 信息处理方法、装置和电子设备
CN109542553A (zh) 用户界面ui元素的信息抓取方法及装置、及存储介质
US8688677B2 (en) Search-highlighter system and method
WO2022156817A1 (zh) 内容提取方法、装置
WO2017045277A1 (zh) 搜索方法、装置、设备及非易失性计算机存储介质
CN103513873B (zh) 页面显示方法和电子设备
CN105607832B (zh) 一种信息处理方法及电子设备
CN105242820A (zh) 一种基于直观视觉的医疗信息触控搜索方法
CN114489414A (zh) 文件处理方法及装置
KR102213861B1 (ko) 스케치 검색 시스템, 사용자 장치, 서비스 제공 장치, 그 서비스 방법 및 컴퓨터 프로그램이 기록된 기록매체

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