CN116309940A - 一种基于动画弹窗组件的地图信息显示方法、设备及介质 - Google Patents
一种基于动画弹窗组件的地图信息显示方法、设备及介质 Download PDFInfo
- Publication number
- CN116309940A CN116309940A CN202310300910.0A CN202310300910A CN116309940A CN 116309940 A CN116309940 A CN 116309940A CN 202310300910 A CN202310300910 A CN 202310300910A CN 116309940 A CN116309940 A CN 116309940A
- Authority
- CN
- China
- Prior art keywords
- animation
- display
- popup
- popup window
- map information
- 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
Links
- 238000000034 method Methods 0.000 title claims abstract description 45
- 238000009877 rendering Methods 0.000 claims abstract description 12
- 230000007246 mechanism Effects 0.000 claims abstract description 11
- 230000000694 effects Effects 0.000 claims description 16
- 239000000725 suspension Substances 0.000 claims description 9
- 230000000712 assembly Effects 0.000 claims description 8
- 238000000429 assembly Methods 0.000 claims description 8
- 239000003086 colorant Substances 0.000 claims description 3
- 230000000007 visual effect Effects 0.000 description 9
- 238000010586 diagram Methods 0.000 description 8
- 238000004590 computer program Methods 0.000 description 7
- 230000006870 function Effects 0.000 description 5
- 230000009286 beneficial effect Effects 0.000 description 4
- 230000003993 interaction Effects 0.000 description 4
- 230000008569 process Effects 0.000 description 4
- 238000012545 processing Methods 0.000 description 4
- 238000012800 visualization Methods 0.000 description 4
- 238000013079 data visualisation Methods 0.000 description 3
- 230000005540 biological transmission Effects 0.000 description 2
- 239000002131 composite material Substances 0.000 description 2
- 238000011161 development Methods 0.000 description 2
- 238000005516 engineering process Methods 0.000 description 2
- 238000012986 modification Methods 0.000 description 2
- 230000004048 modification Effects 0.000 description 2
- 230000003287 optical effect Effects 0.000 description 2
- 230000003068 static effect Effects 0.000 description 2
- 230000008859 change Effects 0.000 description 1
- 238000004891 communication Methods 0.000 description 1
- 238000004090 dissolution Methods 0.000 description 1
- 238000004519 manufacturing process Methods 0.000 description 1
- 230000000750 progressive effect Effects 0.000 description 1
- 238000006467 substitution reaction Methods 0.000 description 1
- 230000001960 triggered effect Effects 0.000 description 1
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06T—IMAGE DATA PROCESSING OR GENERATION, IN GENERAL
- G06T11/00—2D [Two Dimensional] image generation
- G06T11/20—Drawing from basic elements, e.g. lines or circles
- G06T11/206—Drawing of charts or graphs
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06T—IMAGE DATA PROCESSING OR GENERATION, IN GENERAL
- G06T13/00—Animation
-
- Y—GENERAL TAGGING OF NEW TECHNOLOGICAL DEVELOPMENTS; GENERAL TAGGING OF CROSS-SECTIONAL TECHNOLOGIES SPANNING OVER SEVERAL SECTIONS OF THE IPC; TECHNICAL SUBJECTS COVERED BY FORMER USPC CROSS-REFERENCE ART COLLECTIONS [XRACs] AND DIGESTS
- Y02—TECHNOLOGIES OR APPLICATIONS FOR MITIGATION OR ADAPTATION AGAINST CLIMATE CHANGE
- Y02D—CLIMATE CHANGE MITIGATION TECHNOLOGIES IN INFORMATION AND COMMUNICATION TECHNOLOGIES [ICT], I.E. INFORMATION AND COMMUNICATION TECHNOLOGIES AIMING AT THE REDUCTION OF THEIR OWN ENERGY USE
- Y02D10/00—Energy efficient computing, e.g. low power processors, power management or thermal management
Landscapes
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- User Interface Of Digital Computer (AREA)
Abstract
本申请公开了一种基于动画弹窗组件的地图信息显示方法、设备及介质,方法包括:接收客户端发送的地图信息展示指令,并通过预设的openlayer地图引擎,加载地图信息展示指令对应的地图视图;确定地图信息展示指令对应的至少一个展示节点,以及展示节点在地图视图中对应的位置属性信息;根据位置属性信息,调用Animate动画库中预设的应用接口,将展示节点对应的动画弹窗组件展示于地图视图中;获取动画弹窗组件对应的数据元素,并通过插槽机制,将数据元素渲染至动画弹窗组件内部,实现展示节点对应的地图信息的展示。
Description
技术领域
本申请涉及计算机技术领域,具体涉及一种基于动画弹窗组件的地图信息显示方法、设备及介质。
背景技术
随着业务***的不断发展,对于业务的可视化操作性也提出了更高的要求,地图在数据可视化中得到了广泛应用。目前,通过地图实现数据可视化,只能实现一些较为简单的功能,而在面对多功能复杂交互的场景时可视化效果不佳,且操作较为繁琐,需要用户进行多次触发才能实现可视化交互。并且,大多数可视化组件需要定制开发,需进行长时间的重复编码工作,所使用的人力成本较大。
发明内容
为了解决上述问题,本申请提出了一种基于动画弹窗组件的地图信息显示方法,包括:
接收客户端发送的地图信息展示指令,并通过预设的openlayer地图引擎,加载所述地图信息展示指令对应的地图视图;
确定所述地图信息展示指令对应的至少一个展示节点,以及所述展示节点在所述地图视图中对应的位置属性信息;
根据所述位置属性信息,调用Animate动画库中预设的应用接口,将所述展示节点对应的动画弹窗组件展示于所述地图视图中;
获取所述动画弹窗组件对应的数据元素,并通过插槽机制,将所述数据元素渲染至所述动画弹窗组件内部,实现所述展示节点对应的地图信息的展示。
在本申请的一种实现方式中,确定所述地图信息展示指令对应的至少一个展示节点,具体包括:
在存在多个展示节点的情况下,根据所述地图信息展示指令,确定对应的所述多个展示节点之间的先后顺序,并按照所述先后顺序,生成所述地图信息展示指令对应的展示节点链。
在本申请的一种实现方式中,根据所述位置属性信息,调用预设的应用接口,将所述展示节点对应的动画弹窗组件展示于所述地图视图中,具体包括:
调用预设的应用接口,依次获取所述展示节点链中的多个展示节点对应的动画弹窗组件;
针对每个动画弹窗组件,根据所述动画弹窗组件所在展示节点对应的位置属性信息,确定所述动画弹窗组件的位置特征点;其中,所述位置特征点至少包括边界点;
将所述位置特征点展示于所述地图视图中,以绘制由所述位置特征点构成的动画弹窗组件对应的位置特征线,并根据所述位置特征线,确定所述展示节点对应的动画弹窗组件。
在本申请的一种实现方式中,根据所述位置特征线,确定所述展示节点对应的动画弹窗组件之前,所述方法还包括:
确定所述动画弹窗组件对应的容器属性,根据所述容器属性,将所述动画弹窗组件展示于所述地图视图中;其中,所述容器属性包括组件图标、传入动画效果、背景色、边框效果、阴影样式。
在本申请的一种实现方式中,将所述数据元素渲染至所述动画弹窗组件内部之后,所述方法还包括:
按照预设的时间间隔,对所述展示节点链中多个展示节点对应的动画弹窗组件进行切换操作;
在检测到存在切换操作时,分别确定所述多个展示节点对应的动画弹窗组件的组件状态,以根据所述组件状态,加载相应展示节点对应的动画弹窗组件。
在本申请的一种实现方式中,所述组件状态包括显式状态和隐式状态,分别确定所述多个展示节点对应的动画弹窗组件的组件状态,具体包括:
确定位于所述切换操作后的第一动画弹窗组件为显式状态,并确定位于所述切换操作前的第二动画弹窗组件,以及所述多个展示节点对应的动画弹窗组件中,除所述第一动画弹窗组件和所述第二动画弹窗组件之外的其他动画弹窗组件为隐式状态。
在本申请的一种实现方式中,对所述展示节点链中多个展示节点对应的动画弹窗组件进行切换操作,具体包括:
确定所述切换操作对应的动画切换效果,根据所述动画切换效果,对所述多个展示节点对应的动画弹窗组件进行切换操作。
在本申请的一种实现方式中,实现所述展示节点对应的地图信息的展示之后,所述方法还包括:
检测是否存在针对所述动画弹窗组件的鼠标悬浮操作;
若有,则将当前处于显式状态的动画弹窗组件转换为隐式状态,并获取所述鼠标悬浮操作对应的操作位置,根据所述操作位置,确定所述鼠标悬浮操作对应的指定展示节点;
将所述指定展示节点对应的动画弹窗组件设为显式状态,并加载所述动画弹窗组件至所述操作位置处。
本申请实施例提供了一种基于动画弹窗组件的地图信息显示设备,其特征在于,设备包括:
至少一个处理器;以及,
与所述至少一个处理器通信连接的存储器;其中,
所述存储器存储有可被所述至少一个处理器执行的指令,所述指令被所述至少一个处理器执行,以使所述至少一个处理器能够:
接收客户端发送的地图信息展示指令,并通过预设的openlayer地图引擎,加载所述地图信息展示指令对应的地图视图;
确定所述地图信息展示指令对应的至少一个展示节点,以及所述展示节点在所述地图视图中对应的位置属性信息;
根据所述位置属性信息,调用Animate动画库中预设的应用接口,将所述展示节点对应的动画弹窗组件展示于所述地图视图中;
获取所述动画弹窗组件对应的数据元素,并通过插槽机制,将所述数据元素渲染至所述动画弹窗组件内部,实现所述展示节点对应的地图信息的展示。
本申请实施例提供了一种非易失性计算机存储介质,存储有计算机可执行指令,其特征在于,所述计算机可执行指令设置为:
接收客户端发送的地图信息展示指令,并通过预设的openlayer地图引擎,加载所述地图信息展示指令对应的地图视图;
确定所述地图信息展示指令对应的至少一个展示节点,以及所述展示节点在所述地图视图中对应的位置属性信息;
根据所述位置属性信息,调用Animate动画库中预设的应用接口,将所述展示节点对应的动画弹窗组件展示于所述地图视图中;
获取所述动画弹窗组件对应的数据元素,并通过插槽机制,将所述数据元素渲染至所述动画弹窗组件内部,实现所述展示节点对应的地图信息的展示。
通过本申请提出的一种基于动画弹窗组件的地图信息显示方法能够带来如下有益效果:
通过展示节点对不同的动画弹窗组件进行区分,只需根据展示节点之间的关系便可实现不同弹窗组件之间的复杂交互,无需用户进行多次触发,效率更高。并且,通过动画库中已经封装好的动画弹窗组件,实现数据的可视化展示,无需定制开发相应的可视化组件,提高了开发效率的同时,也有效降低了人力成本。
附图说明
此处所说明的附图用来提供对本申请的进一步理解,构成本申请的一部分,本申请的示意性实施例及其说明用于解释本申请,并不构成对本申请的不当限定。在附图中:
图1为本申请实施例提供的一种基于动画弹窗组件的地图信息显示方法的流程示意图;
图2为本申请实施例提供的一种基于动画弹窗组件的地图信息显示设备的结构示意图。
具体实施方式
为使本申请的目的、技术方案和优点更加清楚,下面将结合本申请具体实施例及相应的附图对本申请技术方案进行清楚、完整地描述。显然,所描述的实施例仅是本申请一部分实施例,而不是全部的实施例。基于本申请中的实施例,本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例,都属于本申请保护的范围。
以下结合附图,详细说明本申请各实施例提供的技术方案。
如图1所示,本申请实施例提供的一种基于动画弹窗组件的地图信息显示方法,包括:
S101:接收客户端发送的地图信息展示指令,并通过预设的openlayer地图引擎,加载地图信息展示指令对应的地图视图。
常见的业务***通常需要借助于地图实现业务数据的可视化展示,比如,对于一个公交车运营***来说,需在地图上显示出各站牌停靠的公交线路,以及公交的运营时间、始发站、终点站等运营信息。因此,在业务***进行数据交互展示时,可以对地图进行触发操作来触发相应内容的展示。服务器可接收客户端发送的地图信息展示指令,并通过预设的openlayer地图引擎,加载地图信息展示指令对应的地图视图。需要说明的是,地图信息指令需指定具体的区域范围,这样服务器在接收到指令后可选择性展示地图视图,提高可视化区域的准确性。
S102:确定地图信息展示指令对应的至少一个展示节点,以及展示节点在地图视图中对应的位置属性信息。
地图信息展示指令用于表征用户的可视化需求,比如,展示区域A内21路公交的所有停靠站点,而在进行数据可视化时,每一停靠站点都需要相应的动画弹窗组件来承载站点运营信息,也就需要多个动画弹窗组件才能满足该地图信息展示指令对应的可视化需求。因此,在接收到地图信息展示指令后,需确定地图信息展示指令对应的至少一个展示节点,以及展示节点在地图视图中对应的位置属性信息,每个展示节点对应一个动画弹窗组件,若地图信息展示指令需要弹出多个不同地点或是不同层级的内容,则其对应的展示节点为多个。由于每个展示节点都对应有动画弹窗组件,还需确定展示节点在地图视图中对应的位置属性信息,即坐标信息。
根据上述内容可知,地图信息展示指令对应的可视化内容可以为复合内容,而复合内容在进行展示时可以依次展示,也可以直接展示。通常情况下,为保证可视化效果,不同展示节点对应的动画弹窗组件会以特定的顺序进行展示,比如,在获取某一路线公交的途径站点时,可按照站点顺序依次进行展示。因此,在存在多个展示节点的情况下,需根据地图信息展示指令,确定多个展示节点之间的先后顺序,并按照先后顺序,生成地图信息展示指令对应的展示节点链。如此,在进行各展示节点对应数据的可视化时,可以按照展示节点链依次进行展示,确保每一展示节点的数据都能够清晰展示给用户。
S103:根据位置属性信息,调用Animate动画库中预设的应用接口,将展示节点对应的动画弹窗组件展示于地图视图中。
在确定出展示节点以及其对应的位置属性信息后,需要借助动画弹窗组件实现内容的可视化,从而加载相应的动画弹窗组件至各展示节点对应的位置。
具体地,调用Animate动画库中预设的应用接口,依次获取展示节点链中的多个展示节点对应的动画弹窗组件。针对每个动画弹窗组件,根据动画弹窗组件所在展示节点对应的位置属性信息,确定动画弹窗组件的位置特征点。其中,位置特征点至少包括边界点。在确定出位置特征点后,便可将这些位置特征点展示于地图视图中,这样根据位置特征点,便可绘制出由位置特征点构成的位置特征线,而根据位置特征线,能够确定展示节点对应的动画弹窗组件的所在位置。
除动画弹窗组件的位置之外,本申请实施例还可对动画弹窗组件对应的容器属性进行配置,确定动画弹窗组件对应的容器属性之后,可根据容器属性,将动画弹窗组件展示于地图视图中。其中,容器属性包括组件图标、传入动画效果、背景色、边框效果、阴影样式。
S104:获取动画弹窗组件对应的数据元素,并通过插槽机制,将数据元素渲染至动画弹窗组件内部,实现展示节点对应的地图信息的展示。
上述内容仅是对动画弹窗组件的样式进行了确定,在此之后,本申请实施例还需要对动画弹窗组件具体的数据内容进行填充。服务器获取动画弹窗组件对应的数据元素,并通过插槽机制,将数据元素渲染至动画弹窗组件内部,实现展示节点对应的地图信息的展示。其中,在动画弹窗组件展示的是静态信息时,数据元素指的是前端元素,比如div、span、h1、video等标签元素,而动画弹窗组件还需展示动态信息时,除去上述前端元素,服务器还可从数据库等数据源中获取相应的动态数据填充至动画弹窗组件内部。
在一个实施例中,在存在多个展示节点的情况下,服务器需按照预设的时间间隔,对展示节点链中多个展示节点对应的动画弹窗组件进行切换操作,从而实现多个动画弹窗组件的轮换展示。当检测到切换操作时,需确定多个展示节点对应的动画弹窗组件的组件状态,从而根据组件状态,加载相应的展示节点对应的动画弹窗组件。
其中,位于切换操作后的第一动画弹窗组件为显式状态,位于切换操作前的第二动画弹窗组件,以及多个展示节点对应的动画弹窗组件中除第一动画弹窗组件和第二动画弹窗组件之外的其他动画弹窗组件为隐式状态。如此,无论是否进行了动画弹窗组件的切换,都保证了地图中始终只存在一个动画弹窗组件,避免了数据混淆现象。
服务器还可确定切换操作对应的动画切换效果,比如,溶解、飞入等,根据动画切换效果,能够实现多个动画弹窗组件之间的动态切换,提高可视化的美观性。
由于动画弹窗组件之间的切换间隔是固定的,如果用户存在获取某一特定展示节点数据的需求,本申请实施例还可支持动画弹窗组件的实时切换,保证用户能够及时获取到相应的业务数据。
具体地,服务器需检测是否存在针对动画弹窗组件的鼠标悬浮操作。如果有,则将当前处于显式状态的动画弹窗组件转换为隐式状态,并获取鼠标悬浮操作对应的操作位置,根据操作位置,确定鼠标悬浮操作对应的指定展示节点。在确定出指定展示节点后,需将该指定展示节点对应的动画弹窗组件设为显式状态,并加载动画弹窗组件至操作位置处。用户将鼠标悬浮于地图中任意展示节点的所在位置,都能够实时获取到该展示节点对应的业务数据,而在用户移除鼠标后,此时可直接定位到悬浮操作之前正在展示的某一动画弹窗组件,将该动画弹窗组件继续展示于对应的展示节点位置,直至完成地图信息展示指令所需展示的全部内容为止。
以上为本申请提出的方法实施例。基于同样的思路,本申请的一些实施例还提供了上述方法对应的设备和非易失性计算机存储介质。
图2为本申请实施例提供的一种基于动画弹窗组件的地图信息显示设备的结构示意图。如图2所示,包括:
至少一个处理器;以及,
至少一个处理器通信连接的存储器;其中,
存储器存储有可被至少一个处理器执行的指令,指令被至少一个处理器执行,以使至少一个处理器能够:
接收客户端发送的地图信息展示指令,并通过预设的openlayer地图引擎,加载地图信息展示指令对应的地图视图;
确定地图信息展示指令对应的至少一个展示节点,以及展示节点在地图视图中对应的位置属性信息;
根据位置属性信息,调用Animate动画库中预设的应用接口,将展示节点对应的动画弹窗组件展示于地图视图中;
获取动画弹窗组件对应的数据元素,并通过插槽机制,将数据元素渲染至动画弹窗组件内部,实现展示节点对应的地图信息的展示。
本申请实施例提供了一种非易失性计算机存储介质,存储有计算机可执行指令,计算机可执行指令设置为:
接收客户端发送的地图信息展示指令,并通过预设的openlayer地图引擎,加载地图信息展示指令对应的地图视图;
确定地图信息展示指令对应的至少一个展示节点,以及展示节点在地图视图中对应的位置属性信息;
根据位置属性信息,调用Animate动画库中预设的应用接口,将展示节点对应的动画弹窗组件展示于地图视图中;
获取动画弹窗组件对应的数据元素,并通过插槽机制,将数据元素渲染至动画弹窗组件内部,实现展示节点对应的地图信息的展示。
本申请中的各个实施例均采用递进的方式描述,各个实施例之间相同相似的部分互相参见即可,每个实施例重点说明的都是与其他实施例的不同之处。尤其,对于设备和介质实施例而言,由于其基本相似于方法实施例,所以描述的比较简单,相关之处参见方法实施例的部分说明即可。
本申请实施例提供的设备和介质与方法是一一对应的,因此,设备和介质也具有与其对应的方法类似的有益技术效果,由于上面已经对方法的有益技术效果进行了详细说明,因此,这里不再赘述设备和介质的有益技术效果。
本领域内的技术人员应明白,本申请的实施例可提供为方法、***、或计算机程序产品。因此,本申请可采用完全硬件实施例、完全软件实施例、或结合软件和硬件方面的实施例的形式。而且,本申请可采用在一个或多个其中包含有计算机可用程序代码的计算机可用存储介质(包括但不限于磁盘存储器、CD-ROM、光学存储器等)上实施的计算机程序产品的形式。
本申请是参照根据本申请实施例的方法、设备(***)、和计算机程序产品的流程图和/或方框图来描述的。应理解可由计算机程序指令实现流程图和/或方框图中的每一流程和/或方框、以及流程图和/或方框图中的流程和/或方框的结合。可提供这些计算机程序指令到通用计算机、专用计算机、嵌入式处理机或其他可编程数据处理设备的处理器以产生一个机器,使得通过计算机或其他可编程数据处理设备的处理器执行的指令产生用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的装置。
这些计算机程序指令也可存储在能引导计算机或其他可编程数据处理设备以特定方式工作的计算机可读存储器中,使得存储在该计算机可读存储器中的指令产生包括指令装置的制造品,该指令装置实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能。
这些计算机程序指令也可装载到计算机或其他可编程数据处理设备上,使得在计算机或其他可编程设备上执行一系列操作步骤以产生计算机实现的处理,从而在计算机或其他可编程设备上执行的指令提供用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的步骤。
在一个典型的配置中,计算设备包括一个或多个处理器(CPU)、输入/输出接口、网络接口和内存。
内存可能包括计算机可读介质中的非永久性存储器,随机存取存储器(RAM)和/或非易失性内存等形式,如只读存储器(ROM)或闪存(flash RAM)。内存是计算机可读介质的示例。
计算机可读介质包括永久性和非永久性、可移动和非可移动媒体可以由任何方法或技术来实现信息存储。信息可以是计算机可读指令、数据结构、程序的模块或其他数据。计算机的存储介质的例子包括,但不限于相变内存(PRAM)、静态随机存取存储器(SRAM)、动态随机存取存储器(DRAM)、其他类型的随机存取存储器(RAM)、只读存储器(ROM)、电可擦除可编程只读存储器(EEPROM)、快闪记忆体或其他内存技术、只读光盘只读存储器(CD-ROM)、数字多功能光盘(DVD)或其他光学存储、磁盒式磁带,磁带磁磁盘存储或其他磁性存储设备或任何其他非传输介质,可用于存储可以被计算设备访问的信息。按照本文中的界定,计算机可读介质不包括暂存电脑可读媒体(transitory media),如调制的数据信号和载波。
还需要说明的是,术语“包括”、“包含”或者其任何其他变体意在涵盖非排他性的包含,从而使得包括一系列要素的过程、方法、商品或者设备不仅包括那些要素,而且还包括没有明确列出的其他要素,或者是还包括为这种过程、方法、商品或者设备所固有的要素。在没有更多限制的情况下,由语句“包括一个……”限定的要素,并不排除在包括所述要素的过程、方法、商品或者设备中还存在另外的相同要素。
以上所述仅为本申请的实施例而已,并不用于限制本申请。对于本领域技术人员来说,本申请可以有各种更改和变化。凡在本申请的精神和原理之内所作的任何修改、等同替换、改进等,均应包含在本申请的权利要求范围之内。
Claims (10)
1.一种基于动画弹窗组件的地图信息显示方法,其特征在于,所述方法包括:
接收客户端发送的地图信息展示指令,并通过预设的openlayer地图引擎,加载所述地图信息展示指令对应的地图视图;
确定所述地图信息展示指令对应的至少一个展示节点,以及所述展示节点在所述地图视图中对应的位置属性信息;
根据所述位置属性信息,调用Animate动画库中预设的应用接口,将所述展示节点对应的动画弹窗组件展示于所述地图视图中;
获取所述动画弹窗组件对应的数据元素,并通过插槽机制,将所述数据元素渲染至所述动画弹窗组件内部,实现所述展示节点对应的地图信息的展示。
2.根据权利要求1所述的一种基于动画弹窗组件的地图信息显示方法,其特征在于,确定所述地图信息展示指令对应的至少一个展示节点,具体包括:
在存在多个展示节点的情况下,根据所述地图信息展示指令,确定对应的所述多个展示节点之间的先后顺序,并按照所述先后顺序,生成所述地图信息展示指令对应的展示节点链。
3.根据权利要求2所述的一种基于动画弹窗组件的地图信息显示方法,其特征在于,根据所述位置属性信息,调用预设的应用接口,将所述展示节点对应的动画弹窗组件展示于所述地图视图中,具体包括:
调用预设的应用接口,依次获取所述展示节点链中的多个展示节点对应的动画弹窗组件;
针对每个动画弹窗组件,根据所述动画弹窗组件所在展示节点对应的位置属性信息,确定所述动画弹窗组件的位置特征点;其中,所述位置特征点至少包括边界点;
将所述位置特征点展示于所述地图视图中,以绘制由所述位置特征点构成的动画弹窗组件对应的位置特征线,并根据所述位置特征线,确定所述展示节点对应的动画弹窗组件。
4.根据权利要求3所述的一种基于动画弹窗组件的地图信息显示方法,其特征在于,根据所述位置特征线,确定所述展示节点对应的动画弹窗组件之前,所述方法还包括:
确定所述动画弹窗组件对应的容器属性,根据所述容器属性,将所述动画弹窗组件展示于所述地图视图中;其中,所述容器属性包括组件图标、传入动画效果、背景色、边框效果、阴影样式。
5.根据权利要求2所述的一种基于动画弹窗组件的地图信息显示方法,其特征在于,将所述数据元素渲染至所述动画弹窗组件内部之后,所述方法还包括:
按照预设的时间间隔,对所述展示节点链中多个展示节点对应的动画弹窗组件进行切换操作;
在检测到存在切换操作时,分别确定所述多个展示节点对应的动画弹窗组件的组件状态,以根据所述组件状态,加载相应展示节点对应的动画弹窗组件。
6.根据权利要求5所述的一种基于动画弹窗组件的地图信息显示方法,其特征在于,所述组件状态包括显式状态和隐式状态,分别确定所述多个展示节点对应的动画弹窗组件的组件状态,具体包括:
确定位于所述切换操作后的第一动画弹窗组件为显式状态,并确定位于所述切换操作前的第二动画弹窗组件,以及所述多个展示节点对应的动画弹窗组件中,除所述第一动画弹窗组件和所述第二动画弹窗组件之外的其他动画弹窗组件为隐式状态。
7.根据权利要求5所述的一种基于动画弹窗组件的地图信息显示方法,其特征在于,对所述展示节点链中多个展示节点对应的动画弹窗组件进行切换操作,具体包括:
确定所述切换操作对应的动画切换效果,根据所述动画切换效果,对所述多个展示节点对应的动画弹窗组件进行切换操作。
8.根据权利要求1所述的一种基于动画弹窗组件的地图信息显示方法,其特征在于,实现所述展示节点对应的地图信息的展示之后,所述方法还包括:
检测是否存在针对所述动画弹窗组件的鼠标悬浮操作;
若有,则将当前处于显式状态的动画弹窗组件转换为隐式状态,并获取所述鼠标悬浮操作对应的操作位置,根据所述操作位置,确定所述鼠标悬浮操作对应的指定展示节点;
将所述指定展示节点对应的动画弹窗组件设为显式状态,并加载所述动画弹窗组件至所述操作位置处。
9.一种基于动画弹窗组件的地图信息显示设备,其特征在于,设备包括:
至少一个处理器;以及,
与所述至少一个处理器通信连接的存储器;其中,
所述存储器存储有可被所述至少一个处理器执行的指令,所述指令被所述至少一个处理器执行,以使所述至少一个处理器能够:
接收客户端发送的地图信息展示指令,并通过预设的openlayer地图引擎,加载所述地图信息展示指令对应的地图视图;
确定所述地图信息展示指令对应的至少一个展示节点,以及所述展示节点在所述地图视图中对应的位置属性信息;
根据所述位置属性信息,调用Animate动画库中预设的应用接口,将所述展示节点对应的动画弹窗组件展示于所述地图视图中;
获取所述动画弹窗组件对应的数据元素,并通过插槽机制,将所述数据元素渲染至所述动画弹窗组件内部,实现所述展示节点对应的地图信息的展示。
10.一种非易失性计算机存储介质,存储有计算机可执行指令,其特征在于,所述计算机可执行指令设置为:
接收客户端发送的地图信息展示指令,并通过预设的openlayer地图引擎,加载所述地图信息展示指令对应的地图视图;
确定所述地图信息展示指令对应的至少一个展示节点,以及所述展示节点在所述地图视图中对应的位置属性信息;
根据所述位置属性信息,调用Animate动画库中预设的应用接口,将所述展示节点对应的动画弹窗组件展示于所述地图视图中;
获取所述动画弹窗组件对应的数据元素,并通过插槽机制,将所述数据元素渲染至所述动画弹窗组件内部,实现所述展示节点对应的地图信息的展示。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202310300910.0A CN116309940B (zh) | 2023-03-22 | 2023-03-22 | 一种基于动画弹窗组件的地图信息显示方法、设备及介质 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202310300910.0A CN116309940B (zh) | 2023-03-22 | 2023-03-22 | 一种基于动画弹窗组件的地图信息显示方法、设备及介质 |
Publications (2)
Publication Number | Publication Date |
---|---|
CN116309940A true CN116309940A (zh) | 2023-06-23 |
CN116309940B CN116309940B (zh) | 2023-11-24 |
Family
ID=86781390
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN202310300910.0A Active CN116309940B (zh) | 2023-03-22 | 2023-03-22 | 一种基于动画弹窗组件的地图信息显示方法、设备及介质 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN116309940B (zh) |
Citations (10)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN101930780A (zh) * | 2009-06-23 | 2010-12-29 | 索尼公司 | 图像处理设备、图像处理方法和程序 |
CN107111833A (zh) * | 2014-10-17 | 2017-08-29 | 电子湾有限公司 | 快速3d模型适配和人体测量 |
CN110333924A (zh) * | 2019-06-12 | 2019-10-15 | 腾讯科技(深圳)有限公司 | 一种图像渐变调整方法、装置、设备及存储介质 |
CN111381920A (zh) * | 2020-02-17 | 2020-07-07 | 网易(杭州)网络有限公司 | 弹窗组件的显示方法、装置以及电子终端 |
CN111723221A (zh) * | 2020-06-19 | 2020-09-29 | 珠江水利委员会珠江水利科学研究院 | 基于分布式架构的海量遥感数据处理方法及*** |
CN112445995A (zh) * | 2020-11-30 | 2021-03-05 | 北京邮电大学 | WebGL下的场景融合展示方法及装置 |
CN112703534A (zh) * | 2018-11-20 | 2021-04-23 | 深圳市欢太科技有限公司 | 图像处理方法及相关产品 |
CN114820915A (zh) * | 2022-05-16 | 2022-07-29 | 网易(杭州)网络有限公司 | 渲染剪影光的方法、装置、存储介质及电子装置 |
CN114896525A (zh) * | 2022-06-09 | 2022-08-12 | 北京声智科技有限公司 | 信息显示方法、装置和电子设备 |
CN115309302A (zh) * | 2021-05-06 | 2022-11-08 | 阿里巴巴新加坡控股有限公司 | 图标展示方法、设备、程序产品及存储介质 |
-
2023
- 2023-03-22 CN CN202310300910.0A patent/CN116309940B/zh active Active
Patent Citations (10)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN101930780A (zh) * | 2009-06-23 | 2010-12-29 | 索尼公司 | 图像处理设备、图像处理方法和程序 |
CN107111833A (zh) * | 2014-10-17 | 2017-08-29 | 电子湾有限公司 | 快速3d模型适配和人体测量 |
CN112703534A (zh) * | 2018-11-20 | 2021-04-23 | 深圳市欢太科技有限公司 | 图像处理方法及相关产品 |
CN110333924A (zh) * | 2019-06-12 | 2019-10-15 | 腾讯科技(深圳)有限公司 | 一种图像渐变调整方法、装置、设备及存储介质 |
CN111381920A (zh) * | 2020-02-17 | 2020-07-07 | 网易(杭州)网络有限公司 | 弹窗组件的显示方法、装置以及电子终端 |
CN111723221A (zh) * | 2020-06-19 | 2020-09-29 | 珠江水利委员会珠江水利科学研究院 | 基于分布式架构的海量遥感数据处理方法及*** |
CN112445995A (zh) * | 2020-11-30 | 2021-03-05 | 北京邮电大学 | WebGL下的场景融合展示方法及装置 |
CN115309302A (zh) * | 2021-05-06 | 2022-11-08 | 阿里巴巴新加坡控股有限公司 | 图标展示方法、设备、程序产品及存储介质 |
CN114820915A (zh) * | 2022-05-16 | 2022-07-29 | 网易(杭州)网络有限公司 | 渲染剪影光的方法、装置、存储介质及电子装置 |
CN114896525A (zh) * | 2022-06-09 | 2022-08-12 | 北京声智科技有限公司 | 信息显示方法、装置和电子设备 |
Non-Patent Citations (3)
Title |
---|
哓番茄: "Openlayers 定位,添加自定义图标,点击图标弹框", pages 1 - 5, Retrieved from the Internet <URL:《https://www.cnblogs.com/Tohold/p/12850116.html》> * |
申晓霞: "基于深度信息和RGB图像的行为识别算法", 《模式识别与人工智能》, vol. 26, no. 8, pages 722 - 728 * |
郑州-在路上: "echarts实现地图定时切换散点与多图表级联联动详解", pages 1 - 25, Retrieved from the Internet <URL:《https://www.yisu.com/zixun/176828.html》> * |
Also Published As
Publication number | Publication date |
---|---|
CN116309940B (zh) | 2023-11-24 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
CN109634598B (zh) | 一种页面显示方法、装置、设备及存储介质 | |
CN109192054B (zh) | 一种地图区域合并的数据处理方法及装置 | |
CN107656759B (zh) | 一种用于用户界面的渲染方法和装置 | |
CN105786301B (zh) | 多窗口***下切换显示对象的方法及其装置 | |
CN105335132B (zh) | 一种自定义应用程序功能的方法、装置以及*** | |
CN110599396A (zh) | 信息处理方法及装置 | |
CN109614194A (zh) | 列表界面的显示方法、装置、设备及存储介质 | |
CN109582317B (zh) | 用于调试寄宿应用的方法和装置 | |
CN112905441A (zh) | 测试用例生成方法、测试方法、装置及设备 | |
CN115309516A (zh) | 一种应用生命周期的检测方法、装置及计算机设备 | |
CN110727825A (zh) | 动画播放的控制方法、装置、服务器和存储介质 | |
CN110119270B (zh) | 网页搭建方法、装置、设备和框架 | |
CN111782106A (zh) | 用于展示页面菜单栏的方法、装置、电子设备和可读介质 | |
CN107621951B (zh) | 一种视图层级优化的方法及装置 | |
CN116309940B (zh) | 一种基于动画弹窗组件的地图信息显示方法、设备及介质 | |
CN112579066A (zh) | 图表展示方法、装置、存储介质及设备 | |
CN111142990A (zh) | 一种微信小程序页面展示方法、装置、及存储介质 | |
CN116503529A (zh) | 渲染、3d画面控制方法、电子设备和计算机可读存储介质 | |
CN111475231A (zh) | 生成占位图的方法、装置、电子设备及可读介质 | |
CN116775174A (zh) | 一种基于用户界面框架的处理方法、装置、设备及介质 | |
CN107730572A (zh) | 一种图表渲染方法及装置 | |
US11797719B2 (en) | Dynamic preview generation in a product lifecycle management environment | |
CN112667410A (zh) | 跨进程通讯方法、终端及计算机可读存储介质 | |
CN112749282A (zh) | 知识图谱的展示方法、装置、设备及存储介质 | |
CN110989982A (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 | ||
GR01 | Patent grant | ||
GR01 | Patent grant |