CN113468452A - 遥感数据可视化界面交互方法、装置及电子设备 - Google Patents

遥感数据可视化界面交互方法、装置及电子设备 Download PDF

Info

Publication number
CN113468452A
CN113468452A CN202111029533.9A CN202111029533A CN113468452A CN 113468452 A CN113468452 A CN 113468452A CN 202111029533 A CN202111029533 A CN 202111029533A CN 113468452 A CN113468452 A CN 113468452A
Authority
CN
China
Prior art keywords
stacking area
current data
display area
data module
module
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
CN202111029533.9A
Other languages
English (en)
Other versions
CN113468452B (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 Guoxing Aerospace Technology Co.,Ltd.
Original Assignee
Chengdu Guoxing Aerospace 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 Guoxing Aerospace Technology Co ltd filed Critical Chengdu Guoxing Aerospace Technology Co ltd
Priority to CN202111029533.9A priority Critical patent/CN113468452B/zh
Publication of CN113468452A publication Critical patent/CN113468452A/zh
Application granted granted Critical
Publication of CN113468452B publication Critical patent/CN113468452B/zh
Active legal-status Critical Current
Anticipated expiration legal-status Critical

Links

Images

Classifications

    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/90—Details of database functions independent of the retrieved data types
    • G06F16/95—Retrieval from the web
    • G06F16/957—Browsing optimisation, e.g. caching or content distillation
    • G06F16/9577—Optimising the visualization of content, e.g. distillation of HTML documents
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/90—Details of database functions independent of the retrieved data types
    • G06F16/95—Retrieval from the web
    • G06F16/958—Organisation or management of web site content, e.g. publishing, maintaining pages or automatic linking
    • G06F16/986—Document structures and storage, e.g. HTML extensions
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00—Input 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/01—Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0484—Interaction techniques based on graphical user interfaces [GUI] for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range
    • G06F3/04845—Interaction techniques based on graphical user interfaces [GUI] for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range for image manipulation, e.g. dragging, rotation, expansion or change of colour

Landscapes

  • Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • Databases & Information Systems (AREA)
  • General Engineering & Computer Science (AREA)
  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • Data Mining & Analysis (AREA)
  • Human Computer Interaction (AREA)
  • User Interface Of Digital Computer (AREA)

Abstract

本申请提供一种遥感数据可视化界面交互方法、装置及电子设备，用于改善对网页进行布局的空间利用率较低的问题。该方法包括：判断网页页面的窗口中是否出现靠近堆叠区域的滑动操作，窗口包括堆叠区域；若是，则控制展示区域向靠近堆叠区域进行移动，控制展示区域中的多个数据模块跟随展示区域向靠近堆叠区域进行移动，并将展示区域中的多个数据模块依次移动到堆叠区域，且停留在堆叠区域；数据模块用于展示文字、图片和/或视频的数据信息；若窗口中出现远离堆叠区域的滑动操作，则控制展示区域向远离堆叠区域进行移动，并控制堆叠区域中的多个数据模块依次跟随展示区域向远离堆叠区域进行移动。

Description

遥感数据可视化界面交互方法、装置及电子设备
技术领域
本申请涉及人机交互、图形用户界面（Graphical User Interface，GUI）交互和数据可视化的技术领域，具体而言，涉及一种遥感数据可视化界面交互方法、装置及电子设备。
背景技术
遥感影像（Remote Sensing Image）是指记录各种地物电磁波大小的胶片或照片，主要分为航空像片和卫星相片。
超文本标记语言（Hyper Text Markup Language，HTML），是一种标准通用标记语言，包括一系列标签。HTML通过标签将网络上的文档格式统一，使分散的因特网（Internet）资源连接为一个逻辑整体，HTML通过标记符号来标记要显示的网页中的各个部分。
目前的横向布局、纵向布局、流式布局、瀑布流布局等等自动布局方法存在很多问题，其中，横向布局是依赖于HTML中的行内元素标签实现的自动布局，此处的行内元素标签例如：img标签和span标签等；纵向布局是依赖于HTML中的块级元素标签实现的自动布局，此处的块级元素标签例如：div标签和li标签等，而流式布局和瀑布流布局是依赖于层叠样式表（Cascading Style Sheets，CSS）的浮动样式实现的自动布局。上述的这些自动布局方法大都依赖于浏览器提供的某些特定的层叠样式表样式来实现自动布局，存在滚动后超出范围将被切割导致不美观、布局对象不够紧凑或者存在空白位置等等问题，也就是说，使用目前的自动布局方法对网页进行布局的空间利用率较低。
发明内容
本申请实施例的目的在于提供一种遥感数据可视化界面交互方法、装置及电子设备，用于改善对网页进行布局的空间利用率较低的问题。
本申请实施例提供了一种遥感数据可视化界面交互方法，包括：判断网页页面的窗口中是否出现靠近堆叠区域的滑动操作，窗口包括堆叠区域；若是，则控制展示区域向靠近堆叠区域进行移动，控制展示区域中的多个数据模块跟随展示区域向靠近堆叠区域进行移动，并将展示区域中的多个数据模块依次移动到堆叠区域，且停留在堆叠区域；数据模块用于展示文字、图片和/或视频的数据信息；若窗口中出现远离堆叠区域的滑动操作，则控制展示区域向远离堆叠区域进行移动，并控制堆叠区域中的多个数据模块依次跟随展示区域向远离堆叠区域进行移动。在上述的实现过程中，通过网页页面的窗口中出现靠近堆叠区域的滑动操作时，就控制展示区域中的多个数据模块跟随展示区域向靠近堆叠区域进行移动，并依次移动到堆叠区域，且停留在堆叠区域；其中，在控制展示区域中的多个数据模块依次移动到堆叠区域和/或控制堆叠区域中的多个数据模块依次跟随展示区域向远离堆叠区域进行移动的过程中，同时逐渐改变数据模块的尺寸和/或不透明度。也就是说，因为窗口的尺寸限制，在窗口范围可展示的数据模块数量有限，从而当需要查看未被展示的数据模块时，可通过滑动操作直接将展示区域中的数据模块依次移动到堆叠区域，从而使得展示区域中之前未在窗口中展示的数据模块在窗口的可视范围内进行展示，且展示区域中的多个数据模块在滚动展示之后停留在堆叠区域，而不是被切割，有效地提高了对网页进行布局的空间利用率。
可选地，在本申请实施例中，还包括：获取展示区域的原始位置，以及展示区域中的当前数据模块与堆叠区域的原始距离Yi，Yi大于或等于0；其中，展示区域的原始位置是未出现任何滑动操作前的位置，展示区域中的当前数据模块与堆叠区域的原始距离是未出现任何滑动操作前的距离；确定滑动操作过程展示区域相对展示区域的原始位置所移动的相对距离变量S，S大于或等于0，展示区域的原始位置是未出现任何滑动操作前的位置；根据相对距离变量S与原始距离Yi之间的关系，改变当前数据模块的尺寸和/或不透明度。在上述的实现过程中，通过根据相对距离变量S与原始距离Yi之间的关系，改变当前数据模块的尺寸和/或不透明度，从而动态地表示出当前数据模块正在变化的过程，有效地避免了滚动后超出范围将被切割导致不美观的问题。
可选地，在本申请实施例中，还包括：当S=Yi时，若窗口中出现靠近堆叠区域的滑动操作，则控制当前数据模块停留在堆叠区域，不再跟随展示区域继续移动；当S=Yi时，若窗口中出现远离堆叠区域的滑动操作，则控制堆叠区域中的当前数据模块跟随展示区域向远离堆叠区域进行移动。在上述的实现过程中，通过S=Yi且窗口中出现靠近堆叠区域的滑动操作来判断是否让堆叠区域中的当前数据模块是否继续移动，有效地避免了滚动后超出范围将被切割导致不美观的问题。
可选地，在本申请实施例中，根据相对距离变量S与原始距离Yi之间的关系，改变当前数据模块的尺寸和/或不透明度，包括：若S<Yi时，则控制当前数据模块的不透明度变为100%；若Yi≤S≤(Yi+H)时，则根据预设不透明度调整方式改变当前数据模块的不透明度；若S>(Yi+H)时，则控制当前数据模块的不透明度变为0；其中，H表示当前数据模块的移动方向上所占尺寸，H大于0。
可选地，在本申请实施例中，根据预设不透明度调整方式改变当前数据模块的不透明度，包括：根据公式anime1=（H+Yi-S）/H计算当前数据模块随着滑动操作变化的不透明度动态比例参数；其中，anime1表示当前数据模块随着滑动操作变化的不透明度动态比例参数；根据不透明度动态比例参数改变当前数据模块的不透明度，其中，改变后的当前数据模块的不透明度等于当前数据模块的原始不透明度乘以当前数据模块的不透明度动态比例参数，当前数据模块的原始不透明度为100%。
可选地，在本申请实施例中，根据相对距离变量S与原始距离Yi之间的关系，改变当前数据模块的尺寸和/或不透明度，包括：若S＜Yi时，则控制当前数据模块的尺寸为原始预设尺寸；若Yi≤S≤(Yi+H)时，则根据预设尺寸调整方式改变当前数据模块的尺寸；若S>(Yi+H)时，则控制当前数据模块的尺寸与当S=(Yi+H)时改变后的当前数据模块的尺寸一致；其中，H表示当前数据模块的移动方向上所占尺寸，H大于0。
可选地，在本申请实施例中，根据预设尺寸调整方式改变当前数据模块的尺寸，包括：根据公式anime2=（H+Yi-S）/H计算当前数据模块随着滑动操作变化的尺寸动态比例参数；其中，anime2表示当前数据模块随着滑动操作变化的尺寸动态比例参数；根据当前数据模块随着滑动操作变化的尺寸动态比例参数改变当前数据模块的尺寸，其中，改变后的当前数据模块的尺寸等于当前数据模块的原始预设尺寸乘以（α×anime2+β），当前数据模块的原始预设尺寸大于0，α及β为预设参数，且0<β<1,α+β=1。
可选地，在本申请实施例中，在判断网页页面的窗口中是否出现靠近堆叠区域的滑动操作之前，还包括：将展示区域中的多个数据模块的层级沿靠近堆叠区域的方向依次递减设置，层级用于表征多个数据模块之间的遮挡关系，以使当窗口中出现靠近堆叠区域的滑动操作，堆叠区域中的当前数据模块逐步被向靠近堆叠区域移动的下一个数据模块部分遮挡并直至全部遮挡，直至下一个数据模块停留在堆叠区域。在上述的实现过程中，通过将展示区域中的多个数据模块的层级沿靠近堆叠区域的方向依次递减设置，从而使得所展示的视觉效果为堆叠区域中的当前数据模块逐渐下层，且不会影响用户观看所移动的下一个数据模块所展示的数据信息，有效地提高了对网页进行布局的效率。
本申请实施例还提供了一种遥感数据可视化界面交互装置，包括：滑动操作判断模块，用于判断网页页面的窗口中是否出现靠近堆叠区域的滑动操作，窗口包括堆叠区域；靠近操作移动模块，用于若网页页面的窗口中出现靠近堆叠区域的滑动操作，则控制展示区域向靠近堆叠区域进行移动，控制展示区域中的多个数据模块跟随展示区域向靠近堆叠区域进行移动，并将展示区域中的多个数据模块依次移动到堆叠区域，且停留在堆叠区域；数据模块用于展示文字、图片和/或视频的数据信息；远离操作移动模块，用于若窗口中出现远离堆叠区域的滑动操作，则控制展示区域向远离堆叠区域进行移动，并控制堆叠区域中的多个数据模块依次跟随展示区域向远离堆叠区域进行移动；参数控制模块，用于在靠近操作移动模块控制展示区域中的多个数据模块依次移动到堆叠区域和/或远离操作移动模块控制堆叠区域中的多个数据模块依次跟随展示区域向远离堆叠区域进行移动的过程中，同时逐渐改变数据模块的尺寸和/或不透明度。
可选地，在本申请实施例中，还包括：位置距离获取模块，用于获取展示区域的原始位置，以及展示区域中的当前数据模块与堆叠区域的原始距离Yi，Yi大于或等于0；其中，展示区域的原始位置是未出现任何滑动操作前的位置，展示区域中的当前数据模块与堆叠区域的原始距离是未出现任何滑动操作前的距离；相对距离确定模块，用于确定滑动操作过程展示区域相对展示区域的原始位置所移动的相对距离变量S，S大于或等于0，展示区域的原始位置是未出现任何滑动操作前的位置；尺寸透明改变模块，用于根据相对距离变量S与原始距离Yi之间的关系，改变当前数据模块的尺寸和/或不透明度。
可选地，在本申请实施例中，还包括：靠近滑动操作模块，用于当S=Yi时，若窗口中出现靠近堆叠区域的滑动操作，则控制当前数据模块停留在堆叠区域不再跟随展示区域继续移动；远离滑动操作模块，用于当S=Yi时，若窗口中出现远离堆叠区域的滑动操作，则控制堆叠区域中的当前数据模块跟随展示区域向远离堆叠区域进行移动。
可选地，在本申请实施例中，尺寸透明改变模块，包括：第一透明改变模块，用于若S<Yi时，则控制当前数据模块的不透明度变为100%；第二透明改变模块，用于若Yi≤S≤(Yi+H)时，则根据预设不透明度调整方式改变当前数据模块的不透明度；第三透明改变模块，用于若S>(Yi+H)时，则控制当前数据模块的不透明度变为0；其中，H表示当前数据模块的移动方向上所占尺寸，H大于0。
可选地，在本申请实施例中，第二透明改变模块，包括：第一参数计算模块，用于根据公式anime1=（H+Yi-S）/H计算当前数据模块随着滑动操作变化的不透明度动态比例参数；其中，anime1表示当前数据模块随着滑动操作变化的不透明度动态比例参数；不透明度改变模块，用于根据不透明度动态比例参数改变当前数据模块的不透明度，其中，改变后的当前数据模块的不透明度等于当前数据模块的原始不透明度乘以当前数据模块的不透明度动态比例参数，当前数据模块的原始不透明度为100%。
可选地，在本申请实施例中，尺寸透明改变模块，包括：第一尺寸改变模块，用于若S＜Yi时，则控制当前数据模块的尺寸为原始预设尺寸；第二尺寸改变模块，用于若Yi≤S≤(Yi+H)时，则根据预设尺寸调整方式改变当前数据模块的尺寸；第三尺寸改变模块，用于若S>(Yi+H)时，则控制当前数据模块的尺寸与当S=(Yi+H)时改变后的当前数据模块的尺寸一致；其中，H表示当前数据模块的移动方向上所占尺寸，H大于0。
可选地，在本申请实施例中，第二尺寸改变模块，包括：第二参数计算模块，用于根据公式anime2=（H+Yi-S）/H计算当前数据模块随着滑动操作变化的尺寸动态比例参数；其中，anime2表示当前数据模块随着滑动操作变化的尺寸动态比例参数；模块尺寸改变模块，用于根据当前数据模块随着滑动操作变化的尺寸动态比例参数改变当前数据模块的尺寸，其中，改变后的当前数据模块的尺寸等于当前数据模块的原始预设尺寸乘以（α×anime2+β），当前数据模块的原始预设尺寸大于0，α及β为预设参数，且0<β<1,α+β=1。
可选地，在本申请实施例中，还包括：模块层级设置模块，用于将展示区域中的多个数据模块的层级沿靠近堆叠区域的方向依次递减设置，层级用于表征多个数据模块之间的遮挡关系，以使当窗口中出现靠近堆叠区域的滑动操作，堆叠区域中的当前数据模块逐步被向靠近堆叠区域移动的下一个数据模块部分遮挡并直至全部遮挡，直至下一个数据模块停留在堆叠区域。
本申请实施例还提供了一种遥感数据可视化界面交互电子设备，包括：处理器和存储器，存储器存储有处理器可执行的机器可读指令，机器可读指令被处理器执行时执行如上面描述的方法。
本申请实施例还提供了一种计算机可读存储介质，该计算机可读存储介质上存储有计算机程序，该计算机程序被处理器运行时执行如上面描述的方法。
附图说明
为了更清楚地说明本申请实施例的技术方案，下面将对本申请实施例中所需要使用的附图作简单地介绍，应当理解，以下附图仅示出了本申请的某些实施例，因此不应被看作是对范围的限定，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他相关的附图。
图1示出的本申请实施例提供的遥感数据可视化界面交互方法的流程示意图；
图2示出的本申请实施例提供的在网页页面中的两个窗口示意图；
图3示出的本申请实施例提供的靠近堆叠区域的滑动操作的示意图；
图4示出的本申请实施例提供根据步骤S236或S246步骤S272方案采用当前数据模块中的不同基点改变其当前数据模块的尺寸过程示意图；
图5示出的本申请实施例提供的遥感数据可视化界面交互装置的结构示意图。
具体实施方式
下面将结合本申请实施例中的附图，对本申请实施例中的技术方案进行清楚、完整的描述。
在介绍本申请实施例提供的遥感数据可视化界面交互方法之前，先介绍本申请实施例中所涉及的一些概念：
JavaScript是一种直译式脚本语言，也是一种动态类型、弱类型、基于原型的用户终端脚本语言，内置支持类型；该语言的解释器或解析器被称为JavaScript引擎，JavaScript是一种广泛用于用户终端中浏览器的脚本语言。
需要说明的是，本申请实施例提供的遥感数据可视化界面交互方法可以被电子设备执行，这里的电子设备是指具有执行计算机程序功能的设备终端或者上述的服务器，设备终端例如：智能手机、个人电脑（personal computer，PC）、平板电脑、个人数字助理（personal digital assistant，PDA）或者移动上网设备（mobile Internet device，MID）等；服务器例如：x86服务器以及非x86服务器，非x86服务器包括：大型机、小型机和UNIX服务器。
下面介绍该遥感数据可视化界面交互方法适用的应用场景，这里的应用场景包括但不限于：前端工程师在开发应用系统的网页页面时，使用该遥感数据可视化界面交互方法加速网页页面的开发过程，并提高对网页页面进行布局的空间利用率，或者，使用该遥感数据可视化界面交互方法对遥感数据进行可视化时，例如在屏幕上显示遥感数据，可以有效利用屏幕上有限的屏幕尺寸，并让不再展示的窗口进入并停留在堆叠区域。
请参见图1示出的本申请实施例提供的遥感数据可视化界面交互方法的流程示意图；该遥感数据可视化界面交互方法的主要思路是，当网页页面的窗口中出现靠近堆叠区域的滑动操作时，就控制展示区域中的多个数据模块跟随展示区域向靠近堆叠区域进行移动，并将展示区域中的多个数据模块依次移动到堆叠区域，且停留在堆叠区域。也就是说，因为窗口的尺寸限制，在窗口范围可展示的数据模块数量有限，从而当需要查看未被展示的数据模块时，可通过滑动操作直接将展示区域中的数据模块依次移动到堆叠区域，从而使得展示区域中之前未在窗口中展示的数据模块在窗口的可视范围内进行展示，且展示区域中的多个数据模块在滚动展示之后停留在堆叠区域，而不是被切割，有效地提高了对网页进行布局的空间利用率。上述的遥感数据可视化界面交互方法可以包括：
步骤S110：判断网页页面的窗口中是否出现靠近堆叠区域的滑动操作，窗口包括堆叠区域。
请参见图2示出的本申请实施例提供的在网页页面中的两个窗口示意图；此处的窗口是指HTML网页页面中设置的用于展示信息的块（Block）元素区域，具体例如div标签等元素。在具体的实施过程中，可以在网页页面中设置一个窗口，也可以在网页页面中设置多个窗口，每个窗口均是包括多个数据模块的矩形框。需要说明的是，上述的展示区域和堆叠区域均是视觉概念上的虚拟区域，并非在具体实践中用代码可视化的区域，因此图中的这两个区域使用虚线表示，上述的展示区域可以包括多个用于视觉上展示的数据模块，堆叠区域是用于视觉上堆叠数据模块的区域，本申请实施例中的数据模块指真正需要展示图片数据、文字信息或者视频等等数据信息。在具体实践过程中，还可以在窗口中一侧还设置一个滚动条，该滚动条可以直观地表示出展示区域中还有未被展示在窗口中的数据模块，当然也可以根据具体情况不设置滚动条。
可以理解的是，在步骤S110之前，即判断网页页面的窗口中是否出现靠近堆叠区域的滑动操作之前，还可以将堆叠区域设置在靠近窗口边缘的一侧；多个数据模块设置在堆叠区域的同一侧，且多个数据模块沿远离堆叠区域方向依次设置在展示区域中。在一种实施方式中，堆叠区域为矩形，多个数据模块沿远离堆叠区域方向依次间隔设置在堆叠区域任一边缘的同一侧。
可以理解的是，在步骤S110之前，即判断网页页面的窗口中是否出现靠近堆叠区域的滑动操作之前，还可以设置每个数据模块的层级，具体例如：将展示区域中的多个数据模块的层级沿靠近堆叠区域的方向依次递减设置，如将最靠近堆叠区域的数据模块的层级设置为最低（假设层级最低为0），且沿着远离堆叠区域的方向依次对数据模块的层级呈递增设置（那么可以依次设置为1、2、……N等等）。参照图2中的右侧窗口（堆叠区域位于窗口中靠近窗口上边缘区域，数据模块沿远离堆叠区域向下依次设置，且各数据模块的层级沿远离堆叠区域呈递增设置），此处的层级用于表征多个数据模块之间的遮挡关系，以使当窗口中出现靠近堆叠区域的滑动操作，堆叠区域中的当前数据模块逐步被向靠近堆叠区域移动的下一个数据模块部分遮挡并直至全部遮挡，直至下一个数据模块停留在堆叠区域。
上述步骤S110的实施方式例如：第一种实施方式，电子设备是以触屏的滑动操作与人进行交互的；以图2中右边的窗口为例（堆叠区域位于窗口中靠近窗口上边缘区域，数据模块沿远离堆叠区域向下依次设置），若网页页面中右边的窗口中是否出现靠近堆叠区域的滑动操作，即右边的窗口中出现向上的滑动操作，那么可以响应该窗口中的向上滑动操作。可以使用JavaScript脚本语言将窗口中的每个数据模块都添加监听事件（addEventListener）滑动（scroll，又译为滚动）函数，其具体响应动作将在下面进行详细地说明。当然在具体实施过程中，也可以根据具体情况使用其它的编程语言来添加监听事件，并在响应监听事件后作出相应的动作，可以使用的编程语言包括但不限于：C、C++、Java、BASIC、LISP、Shell、Perl、Ruby、Python和PHP等等。第二种实施方式，电子设备是以鼠标的滚动操作与人进行交互的，那么第一种实施方式中的向上滑动操作对应的是鼠标的向下滚动操作，第二种实施方式的技术原理与第一种实施方式类似，因此便不再赘述。
可以理解的是，上述的数据模块中展示的数据可以是任意领域的数据，例如：可以是无人机采集天气相关的点云数据，也可以是高光谱遥感卫星采集的地理遥感数据，还可以是空间规划和布局等等数据。上述的数据模块中展示的数据可以是任意形式的数据，例如可以是文字表格形式展示的数据，也可以是图片图形形式展示的数据，也可以是视频音频形式展示的数据等等。
在步骤S110之后，执行步骤S120：若网页页面的窗口中出现靠近堆叠区域的滑动操作，则控制展示区域向靠近堆叠区域进行移动，控制展示区域中的多个数据模块跟随展示区域向靠近堆叠区域进行移动，并将展示区域中的多个数据模块依次移动到堆叠区域，且停留在堆叠区域。
其中，上述的数据模块可以用于展示文字、图片和/或视频等等数据信息。数据模块的具体形状也可以根据具体情况进行设置，例如：将数据模块设置为正方形或者矩形等等，或者，将数据模块设置为带有至少一个圆角的矩形等等。
请参见图3示出的本申请实施例提供的靠近堆叠区域的滑动操作的示意图；在图3的每一子图中左侧示出了四个或五个数据模块，每个数据模块在移动方向上所占尺寸均是H，假设当前数据模块是数据模块1，那么当前数据模块的移动方向上所占尺寸为H，且仅示出了获取数据模块1与堆叠区域的原始距离Y1，获取数据模块2与堆叠区域的原始距离Y2，获取数据模块3与堆叠区域的原始距离Y3，其余的数据模块与堆叠区域的原始距离以此类推；在一种实施方式中，堆叠区域为矩形；各数据模块为矩形；数据模块与堆叠区域的原始距离是指未出现任何滑动操作前，沿移动方向上数据模块上靠近堆叠区域的边缘与堆叠区域上远离数据模块的边缘之间的距离（即未出现任何滑动操作前，数据模块与堆叠区域的原始距离是指沿移动方向上，若数据模块位于堆叠区域的下方同一侧，数据模块顶部边缘与堆叠区域顶部边缘之间的原始距离），或者数据模块与堆叠区域的原始距离是指未出现任何滑动操作前，沿移动方向上数据模块上远离堆叠区域的边缘与堆叠区域上靠近数据模块的边缘之间的距离（若数据模块位于堆叠区域的下方同一侧，即未出现任何滑动操作前，数据模块与堆叠区域的原始距离是指沿移动方向上，数据模块底部边缘与堆叠区域底部边缘之间的原始距离）。在滑动操作过程中，展示区域相对展示区域的原始位置逐渐移动，且展示区域所移动的相对距离变量为S，即展示区域在滑动操作前后的相对移动距离。
上述步骤S120的实施方式例如：先获取展示区域的原始位置，以及展示区域中的当前数据模块与堆叠区域的原始距离Yi，Yi大于或等于0；其中，展示区域的原始位置是未出现任何滑动操作前的位置，展示区域中的当前数据模块与堆叠区域的原始距离是未出现任何滑动操作前的距离。然后，确定滑动操作过程展示区域相对展示区域的原始位置所移动的相对距离变量S，S大于或等于0，展示区域的原始位置是未出现任何滑动操作前的位置。当S=Yi时，若窗口中出现靠近堆叠区域的滑动操作，则控制当前数据模块停留在堆叠区域不再跟随展示区域继续移动。具体以数据模块1为例进行说明，若S=Y1且靠近堆叠区域的滑动操作仍然在继续，那么就让数据模块1停留在堆叠区域中，不再跟随展示区域继续移动，数据模块2和3等等的移动方式以此类推。与此同时，在靠近堆叠区域的滑动操作过程中，还可以根据S与Yi之间的关系改变当前数据模块的不透明度和/或尺寸大小，改变不透明度和/或尺寸大小的具体过程将在下面具体的描述。
在步骤S110之后，执行步骤S130：若窗口中出现远离堆叠区域的滑动操作，则控制展示区域向远离堆叠区域进行移动，并控制堆叠区域中的多个数据模块依次跟随展示区域向远离堆叠区域进行移动。
上述步骤S130的实施方式例如：此处的远离堆叠区域的滑动操作与上面靠近堆叠区域的滑动操作是类似的，已经获取了未出现滑动操作前展示区域的原始位置，以及未出现滑动操作前展示区域中的当前数据模块与堆叠区域的原始距离Yi，Yi大于或等于0。然后，确定滑动操作过程展示区域相对展示区域的原始位置所移动的相对距离变量S，S大于或等于0。请参照图3的逆向变化过程，即由第4子图依次变化为第3子图、第2子图和第1子图，在变化到第2子图中，当S=Y1时，若窗口中出现远离堆叠区域的滑动操作，则控制堆叠区域中的当前数据模块跟随展示区域向远离堆叠区域进行移动，最终，直到展示区域移动至第1子图中当S=0时为止。与此同时，在远离堆叠区域的滑动操作过程中，还可以根据S与Yi之间的关系改变当前数据模块的不透明度和/或尺寸大小，改变不透明度和/或尺寸大小的具体过程将在下面具体的描述。
在上述的实现过程中，当网页页面的窗口中出现靠近堆叠区域的滑动操作时，就控制展示区域中的多个数据模块跟随展示区域向靠近堆叠区域进行移动，并将展示区域中的多个数据模块依次移动到堆叠区域，且停留在堆叠区域。也就是说，因为窗口的尺寸限制，在窗口范围可展示的数据模块数量有限，从而当需要查看未被展示的数据模块时，可通过滑动操作直接将展示区域中的数据模块依次移动到堆叠区域，从而使得展示区域中之前未在窗口中展示的数据模块在窗口的可视范围内进行展示，且展示区域中的多个数据模块在滚动展示之后停留在堆叠区域，而不是被切割，有效地提高了对网页进行布局的空间利用率。
可选地，请参照图3，在控制展示区域和数据模块移动的同时，即在控制展示区域中的多个数据模块依次移动到堆叠区域和/或控制堆叠区域中的多个数据模块依次跟随展示区域向远离堆叠区域进行移动的过程中，同时逐渐改变数据模块的尺寸和/或不透明度，这个过程可以包括：
步骤S210：获取展示区域的原始位置，以及展示区域中的当前数据模块与堆叠区域的原始距离Yi，Yi大于或等于0，展示区域的原始位置是未出现滑动操作前的位置，展示区域中的当前数据模块与堆叠区域的原始距离是未出现任何滑动操作前的距离。
上述的步骤S210的实施方式例如：请参照图3第1子图中示出的未出现滑动操作前展示区域的原始位置，以及未出现滑动操作前展示区域中的当前数据模块与堆叠区域的原始距离Y1、Y2和Y3等等，很明显地，Y1、Y2和Y3均是大于0的。当然在具体的实施过程中，也可以将Y1设置为0，即将数据模块1的顶部边缘与堆叠区域的顶部边缘对齐即可。
步骤S220：确定滑动操作过程展示区域相对展示区域的原始位置所移动的相对距离变量S，S大于或等于0。
上述步骤S220的实施方式例如：请参照图3中的第2、3和4子图中示出的滑动操作过程展示区域相对展示区域的原始位置所移动的相对距离变量S，当沿移动方向上相邻数据模块之间的间隔距离R为零时，第1子图中的S=0，第2子图中的S=Y1，第3子图中的S<Y1+H，第4子图中的S=Y1+H。
其中，上述的步骤S210和步骤S220的执行顺序可以不作限制，可以步骤S210先执行且步骤S220后执行，也可以步骤S220先执行且步骤S210后执行，当然也可以步骤S210和步骤S220并行执行，即步骤S210和步骤S220一起执行。
在步骤S210和步骤S220之后，执行步骤S230：根据相对距离变量S与原始距离Yi之间的关系，改变当前数据模块的尺寸和/或不透明度。
上述步骤S230的实施方式有很多种，包括但不限于如下几种：
第一种实施方式，根据S与Yi之间的关系，只改变当前数据模块的不透明度，该实施方式可以包括：
步骤S231：若S<Yi，则控制当前数据模块的不透明度变为100%。
上述步骤S231的实施方式例如：请参照图3，在图3的第一子图变为第二子图时，S是小于Y1的；若S<Y1，则控制当前数据模块1的不透明度变为100%，即让数据模块1所有颜色全部展示出来，一点也不隐藏。
步骤S232：若Yi≤S≤(Yi+H)，则根据预设不透明度调整方式改变当前数据模块的不透明度。
上述步骤S232的实施方式例如：根据公式anime1=（H+Yi-S）/H计算当前数据模块随着滑动操作变化的不透明度动态比例参数；其中，anime1表示当前数据模块随着滑动操作变化的不透明度动态比例参数；根据不透明度动态比例参数改变当前数据模块的不透明度，其中，改变后的当前数据模块的不透明度等于当前数据模块的原始不透明度乘以当前数据模块的不透明度动态比例参数，当前数据模块的原始不透明度为100%。
步骤S233：若S>(Yi+H)，则控制当前数据模块的不透明度变为0。
上述步骤S233的实施方式例如：请参照图3中的第4子图中S=(Yi+H)时，仍然出现靠近堆叠区域的滑动操作，即当S>(Yi+H)时，就将数据模块1变为全透明，即完全隐藏起来。其中，H表示当前数据模块的移动方向上所占尺寸，H大于0。
第二种实施方式，根据S与Yi之间的关系，只改变当前数据模块的尺寸，可以理解的是，可以根据不同的基点来改变数据模块的尺寸，不同基点改变尺寸的过程将在下面详细地说明。该实施方式可以包括：
步骤S235：若S＜Yi，则控制当前数据模块的尺寸为原始预设尺寸。
上述步骤S235的实施方式例如：请参照图3，在图3的第一子图变为第二子图时，S是小于Y1的；若S<Y1，则控制当前数据模块的尺寸为原始预设尺寸，即让数据模块1的尺寸不变，保持原尺寸。
步骤S236：若Yi≤S≤(Yi+H)，则根据预设尺寸调整方式改变当前数据模块的尺寸。
上述步骤S236的实施方式例如：根据公式anime2=（H+Yi-S）/H计算当前数据模块随着滑动操作变化的尺寸动态比例参数；其中，anime2表示当前数据模块随着滑动操作变化的尺寸动态比例参数。根据当前数据模块随着滑动操作变化的尺寸动态比例参数改变当前数据模块的尺寸，其中，改变后的当前数据模块的尺寸等于当前数据模块的原始预设尺寸乘以（α×anime2+β），当前数据模块的原始预设尺寸大于0，α及β为预设参数，且0<β<1,α+β=1。
步骤S237：若S>(Yi+H)，则控制当前数据模块的尺寸与当S=(Yi+H)时改变后的当前数据模块的尺寸一致。
上述步骤S237的实施方式例如：请参照图3中的第4子图中S=(Yi+H)时，仍然出现靠近堆叠区域的滑动操作，即当S>(Yi+H)时，就将当前数据模块的尺寸设置为与当S=(Yi+H)时改变后的当前数据模块的尺寸一致，即保持当前数据模块在第4子图中的尺寸不变。其中，H表示当前数据模块的移动方向上所占尺寸，H大于0。
第三种实施方式，根据S与Yi之间的关系，同时改变当前数据模块的不透明度和尺寸，该实施方式中改变当前数据模块的不透明度是与上面第一种实施方式是类似的，该实施方式中改变当前数据模块的尺寸是与上面第二种实施方式是类似的，因此，此处就不再赘述重复出现的定义和术语。
步骤S240：获取展示区域的原始位置，以及展示区域中的当前数据模块与堆叠区域的原始距离Yi，Yi大于或等于0，展示区域的原始位置是未出现滑动操作前的位置，展示区域中的当前数据模块与堆叠区域的原始距离是未出现任何滑动操作前的距离。
其中，该步骤S240的实施原理和实施方式与步骤S210的实施原理和实施方式是类似的，因此，这里不再说明其实施原理和实施方式，如有不清楚的地方，可以参考对步骤S210的描述。
步骤S250：确定滑动操作过程展示区域相对展示区域的原始位置所移动的相对距离变量S，S大于或等于0。
上述步骤S250的实施方式还例如：请参照图3中的第2、3和4子图中示出的滑动操作过程展示区域相对展示区域的原始位置所移动的相对距离变量S，当沿移动方向上相邻数据模块之间的间隔距离R≥0时，第1子图中的S=0，第2子图中的S=Y1+R，第3子图中的S<Y1+H+R，第4子图中的S=Y1+H+R。
其中，上述的步骤S240和步骤S250的执行顺序可以不作限制，可以步骤S240先执行且步骤S250后执行，也可以步骤S250先执行且步骤S240后执行，当然也可以步骤S240和步骤S250并行执行，即步骤S240和步骤S250一起执行。
在步骤S240和步骤S250之后，执行步骤S260：根据相对距离变量S与原始距离Yi之间的关系，改变当前数据模块的尺寸和/或不透明度。
上述步骤S260的实施方式有很多种，包括但不限于如下几种：
第一种实施方式，根据S与Yi之间的关系，只改变当前数据模块的不透明度，该实施方式可以包括：
步骤S261：若S<（Yi+R），则控制当前数据模块的不透明度变为100%。
上述步骤S261的实施方式例如：请参照图3，在图3的第一子图变为第二子图时，S是小于（Yi+R）的；若S<（Yi+R），则控制当前数据模块1的不透明度变为100%，即让数据模块1所有颜色全部展示出来，一点也不隐藏。
步骤S262：若（Yi+R）≤S≤(Yi+H+R)，则根据预设不透明度调整方式改变当前数据模块的不透明度。
上述步骤S262的实施方式例如：根据公式anime1=（H+R +Yi-S）/（H+R）计算当前数据模块随着滑动操作变化的不透明度动态比例参数；其中，anime1表示当前数据模块随着滑动操作变化的不透明度动态比例参数；根据不透明度动态比例参数改变当前数据模块的不透明度，其中，改变后的当前数据模块的不透明度等于当前数据模块的原始不透明度乘以当前数据模块的不透明度动态比例参数，当前数据模块的原始不透明度为100%。
步骤S263：若S>(Yi+H+R)，则控制当前数据模块的不透明度变为0。
上述步骤S263的实施方式例如：请参照图3中的第4子图中S=(Yi+H+R)时，仍然出现靠近堆叠区域的滑动操作，即当S>(Yi+H+R)时，就将数据模块1变为全透明，即完全隐藏起来。其中，H表示当前数据模块的移动方向上所占尺寸，H大于0；R表示在移动方向上相邻数据模块之间的间距，在移动方向上任两相邻数据模块之间的间距相等，R≥0。
第二种实施方式，根据S与Yi之间的关系，只改变当前数据模块的尺寸，可以理解的是，可以根据不同的基点来改变数据模块的尺寸，不同基点改变尺寸的过程将在下面详细地说明。该实施方式可以包括：
步骤S271：若S＜（Yi+R），则控制当前数据模块的尺寸为原始预设尺寸。
上述步骤S271的实施方式例如：请参照图3，在图3的第一子图变为第二子图时，S是小于（Yi+R）的；若S<（Yi+R），则控制当前数据模块的尺寸为原始预设尺寸，即让数据模块1的尺寸不变，保持原尺寸。
步骤S272：若（Yi+R）≤S≤(Yi+H+R)，则根据预设尺寸调整方式改变当前数据模块的尺寸。
上述步骤S272的实施方式例如：根据公式anime2=（H+R +Yi-S）/（H+R）计算当前数据模块随着滑动操作变化的尺寸动态比例参数；其中，anime2表示当前数据模块随着滑动操作变化的尺寸动态比例参数。根据当前数据模块随着滑动操作变化的尺寸动态比例参数改变当前数据模块的尺寸，其中，改变后的当前数据模块的尺寸等于当前数据模块的原始预设尺寸乘以（α×anime2+β），当前数据模块的原始预设尺寸大于0，α及β为预设参数，且0<β<1,α+β=1。
步骤S273：若S>(Yi+H+R)，则控制当前数据模块的尺寸与当S=(Yi+H+R)时改变后的当前数据模块的尺寸一致。
上述步骤S273的实施方式例如：请参照图3中的第4子图中S=(Yi+H+R)时，仍然出现靠近堆叠区域的滑动操作，即当S>(Yi+H+R)时，就将当前数据模块的尺寸设置为与当S=(Yi+H+R)时改变后的当前数据模块的尺寸一致，即保持当前数据模块在第4子图中的尺寸不变。其中，H表示当前数据模块的移动方向上所占尺寸，H大于0；R表示在移动方向上相邻数据模块之间的间距，在移动方向上任两相邻数据模块之间的间距相等，R≥0。
第三种实施方式，根据S与Yi之间的关系，同时改变当前数据模块的不透明度和尺寸，该实施方式中改变当前数据模块的不透明度是与上面第一种实施方式或第三种实施方式是相同或类似的，该实施方式中改变当前数据模块的尺寸是与上面第二种实施方式或第四种实施方式是相同或类似的，因此，此处就不再赘述。
请参见图4示出的本申请实施例提供根据步骤S236或步骤S272采用当前数据模块中的不同基点改变其当前数据模块的尺寸过程示意图；可以理解的是，在具体的实施过程中，可以根据不同的基点来改变数据模块的尺寸，数据模块中的不同的基点有很多种情况，具体例如：数据模块中的（左上基点、中上基点、右上基点、左中基点、中心基点（图未示出）、右中基点、左下基点、中下基点和右下基点）等等。在图3中示出的效果是基于中数据模块中的上基点来变化的，从视觉效果上来讲，基于不同的基点来改变数据模块的尺寸有更快或者更慢地被后面的数据模块遮挡的效果，具体例如：数据模块1在基于中下基点来改变数据模块的尺寸在靠近堆叠区域的过程中，相比于基于中上基点来改变数据模块的尺寸就会更快地被数据模块2所遮挡。
请参见图5示出的本申请实施例提供的遥感数据可视化界面交互装置的结构示意图。本申请实施例提供了一种遥感数据可视化界面交互装置300，包括：
滑动操作判断模块310，用于判断网页页面的窗口中是否出现靠近堆叠区域的滑动操作，窗口包括堆叠区域。
靠近操作移动模块320，用于若网页页面的窗口中出现靠近堆叠区域的滑动操作，则控制展示区域向靠近堆叠区域进行移动，控制展示区域中的多个数据模块跟随展示区域向靠近堆叠区域进行移动，并将展示区域中的多个数据模块依次移动到堆叠区域，且停留在堆叠区域；数据模块用于展示文字、图片和/或视频的数据信息。
远离操作移动模块330，用于若窗口中出现远离堆叠区域的滑动操作，则控制展示区域向远离堆叠区域进行移动，并控制堆叠区域中的多个数据模块依次跟随展示区域向远离堆叠区域进行移动。
参数控制模块340，用于在靠近操作移动模块控制展示区域中的多个数据模块依次移动到堆叠区域和/或远离操作移动模块控制堆叠区域中的多个数据模块依次跟随展示区域向远离堆叠区域进行移动的过程中，同时逐渐改变数据模块的尺寸和/或不透明度。
可选地，在本申请实施例中，还包括：
位置距离获取模块，用于获取展示区域的原始位置，以及展示区域中的当前数据模块与堆叠区域的原始距离Yi，Yi大于或等于0；其中，展示区域的原始位置是未出现任何滑动操作前的位置，展示区域中的当前数据模块与堆叠区域的原始距离是未出现任何滑动操作前的距离。
相对距离确定模块，用于确定滑动操作过程展示区域相对展示区域的原始位置所移动的相对距离变量S，S大于或等于0，展示区域的原始位置是未出现任何滑动操作前的位置。
尺寸透明改变模块，用于根据相对距离变量S与原始距离Yi之间的关系，改变当前数据模块的尺寸和/或不透明度。
可选地，在本申请实施例中，该遥感数据可视化界面交互装置，还包括：
靠近滑动操作模块，用于当S=Yi时，若窗口中出现靠近堆叠区域的滑动操作，则控制当前数据模块停留在堆叠区域不再跟随展示区域继续移动。
远离滑动操作模块，用于当S=Yi时，若窗口中出现远离堆叠区域的滑动操作，则控制堆叠区域中的当前数据模块跟随展示区域向远离堆叠区域进行移动。
可选地，在本申请实施例中，尺寸透明改变模块，包括：
第一透明改变模块，用于若S<Yi，则控制当前数据模块的不透明度变为100%。
第二透明改变模块，用于若Yi≤S≤(Yi+H)，则根据预设不透明度调整方式改变当前数据模块的不透明度。
第三透明改变模块，用于若S>(Yi+H)，则控制当前数据模块的不透明度变为0；其中，H表示当前数据模块的移动方向上所占尺寸，H大于0。
可选地，在本申请实施例中，第二透明改变模块，包括：
第一参数计算模块，用于根据公式anime1=（H+Yi-S）/H计算当前数据模块随着滑动操作变化的不透明度动态比例参数；其中，anime1表示当前数据模块随着滑动操作变化的不透明度动态比例参数。
不透明度改变模块，用于根据不透明度动态比例参数改变当前数据模块的不透明度，其中，改变后的当前数据模块的不透明度等于当前数据模块的原始不透明度乘以当前数据模块的不透明度动态比例参数，当前数据模块的原始不透明度为100%。
可选地，在本申请实施例中，尺寸透明改变模块，还可以包括：
第一尺寸改变模块，用于若S＜Yi，则控制当前数据模块的尺寸为原始预设尺寸。
第二尺寸改变模块，用于若Yi≤S≤(Yi+H)时，则根据预设尺寸调整方式改变当前数据模块的尺寸。
第三尺寸改变模块，用于若S>(Yi+H)时，则控制当前数据模块的尺寸与当S=(Yi+H)时改变后的当前数据模块的尺寸一致；其中，H表示当前数据模块的移动方向上所占尺寸，H大于0。
可选地，在本申请实施例中，第二尺寸改变模块，包括：
第二参数计算模块，用于根据公式anime2=（H+Yi-S）/H计算当前数据模块随着滑动操作变化的尺寸动态比例参数；其中，anime2表示当前数据模块随着滑动操作变化的尺寸动态比例参数。
模块尺寸改变模块，用于根据当前数据模块随着滑动操作变化的尺寸动态比例参数改变当前数据模块的尺寸，其中，改变后的当前数据模块的尺寸等于当前数据模块的原始预设尺寸乘以（α×anime2+β），当前数据模块的原始预设尺寸大于0，α及β为预设参数，且0<β<1,α+β=1。
可选地，在本申请实施例中，遥感数据可视化界面交互装置，还可以包括：
模块层级设置模块，用于将展示区域中的多个数据模块的层级沿靠近堆叠区域的方向依次递减设置，层级用于表征多个数据模块之间的遮挡关系，以使当窗口中出现靠近堆叠区域的滑动操作，堆叠区域中的当前数据模块逐步被向靠近堆叠区域移动的下一个数据模块部分遮挡并直至全部遮挡，直至下一个数据模块停留在堆叠区域。
应理解的是，该装置与上述的遥感数据可视化界面交互方法实施例对应，能够执行上述方法实施例涉及的各个步骤，该装置具体的功能可以参见上文中的描述，为避免重复，此处适当省略详细描述。该装置包括至少一个能以软件或固件（firmware）的形式存储于存储器中或固化在装置的操作系统（operating system，OS）中的软件功能模块。
本申请实施例提供的一种遥感数据可视化界面交互电子设备，包括：处理器和存储器，存储器存储有处理器可执行的机器可读指令，机器可读指令被处理器执行时执行如上的方法。
本申请实施例还提供了一种计算机可读存储介质，该计算机可读存储介质上存储有计算机程序，该计算机程序被处理器运行时执行如上的方法。
其中，计算机可读存储介质可以由任何类型的易失性或非易失性存储设备或者它们的组合实现，如静态随机存取存储器（Static Random Access Memory, 简称SRAM），电可擦除可编程只读存储器（Electrically Erasable Programmable Read-Only Memory, 简称EEPROM），可擦除可编程只读存储器（Erasable Programmable Read Only Memory, 简称EPROM），可编程只读存储器（Programmable Read-Only Memory, 简称PROM），只读存储器（Read-Only Memory, 简称ROM），磁存储器，快闪存储器，磁盘或光盘。
本申请实施例提供的几个实施例中，应该理解到，所揭露的装置和方法，也可以通过其他的方式实现。以上所描述的装置实施例仅是示意性的，例如，附图中的流程图和框图显示了根据本申请实施例的多个实施例的装置、方法和计算机程序产品的可能实现的体系架构、功能和操作。在这点上，流程图或框图中的每个方框可以代表一个模块、程序段或代码的一部分，模块、程序段或代码的一部分包含一个或多个用于实现规定的逻辑功能的可执行指令。也应当注意，在有些作为替换的实现方式中，方框中所标注的功能也可以和附图中所标注的发生顺序不同。例如，两个连续的方框实际上可以基本并行地执行，它们有时也可以按相反的顺序执行，这主要根据所涉及的功能而定。
另外，在本申请实施例中的各个实施例的各功能模块可以集成在一起形成一个独立的部分，也可以是各个模块单独存在，也可以两个或两个以上模块集成形成一个独立的部分。
在本文中，诸如第一和第二等之类的关系术语仅仅用来将一个实体或者操作与另一个实体或操作区分开来，而不一定要求或者暗示这些实体或操作之间存在任何这种实际的关系或者顺序。
以上的描述，仅为本申请实施例的可选实施方式，但本申请实施例的保护范围并不局限于此，任何熟悉本技术领域的技术人员在本申请实施例揭露的技术范围内，可轻易想到变化或替换，都应涵盖在本申请实施例的保护范围之内。

Claims (10)

1.一种遥感数据可视化界面交互方法，其特征在于，包括：
判断网页页面的窗口中是否出现靠近堆叠区域的滑动操作，所述窗口包括所述堆叠区域；
若是，则控制展示区域向靠近所述堆叠区域进行移动，控制所述展示区域中的多个数据模块跟随所述展示区域向靠近所述堆叠区域进行移动，并将所述展示区域中的多个数据模块依次移动到所述堆叠区域，且停留在所述堆叠区域；所述数据模块用于展示文字、图片和/或视频的数据信息；
若所述窗口中出现远离所述堆叠区域的滑动操作，则控制所述展示区域向远离所述堆叠区域进行移动，并控制所述堆叠区域中的多个数据模块依次跟随所述展示区域向远离所述堆叠区域进行移动；
其中，在控制所述展示区域中的多个数据模块依次移动到所述堆叠区域和/或控制所述堆叠区域中的多个数据模块依次跟随所述展示区域向远离所述堆叠区域进行移动的过程中，同时逐渐改变所述数据模块的尺寸和/或不透明度。
2.根据权利要求1所述的遥感数据可视化界面交互方法，其特征在于，还包括：
获取所述展示区域的原始位置，以及所述展示区域中的当前数据模块与所述堆叠区域的原始距离Yi，Yi大于或等于0；其中，所述展示区域的原始位置是未出现任何滑动操作前的位置，所述展示区域中的当前数据模块与所述堆叠区域的原始距离是未出现任何滑动操作前的距离；
确定所述滑动操作过程所述展示区域相对所述展示区域的原始位置所移动的相对距离变量S，S大于或等于0，所述展示区域的原始位置是未出现任何滑动操作前的位置；
根据所述相对距离变量S与所述原始距离Yi之间的关系，改变所述当前数据模块的尺寸和/或不透明度。
3.根据权利要求2所述的遥感数据可视化界面交互方法，其特征在于，还包括：
当S=Yi时，若所述窗口中出现靠近所述堆叠区域的滑动操作，则控制所述当前数据模块停留在所述堆叠区域，不再跟随所述展示区域继续移动；
当S=Yi时，若所述窗口中出现远离所述堆叠区域的滑动操作，则控制所述堆叠区域中的当前数据模块跟随所述展示区域向远离所述堆叠区域进行移动。
4.根据权利要求2所述的遥感数据可视化界面交互方法，其特征在于，所述根据所述相对距离变量S与所述原始距离Yi之间的关系，改变所述当前数据模块的尺寸和/或不透明度，包括：
若S<Yi时，则控制所述当前数据模块的不透明度变为100%；
若Yi≤S≤(Yi+H)时，则根据预设不透明度调整方式改变所述当前数据模块的不透明度；
若S>(Yi+H)时，则控制所述当前数据模块的不透明度变为0；
其中，H表示所述当前数据模块的移动方向上所占尺寸，H大于0。
5.根据权利要求4所述的遥感数据可视化界面交互方法，其特征在于，所述根据预设不透明度调整方式改变所述当前数据模块的不透明度，包括：
根据公式anime1=（H+Yi-S）/H计算所述当前数据模块随着滑动操作变化的不透明度动态比例参数；其中，anime1表示所述当前数据模块随着滑动操作变化的不透明度动态比例参数；
根据所述不透明度动态比例参数改变所述当前数据模块的不透明度，其中，改变后的所述当前数据模块的不透明度等于所述当前数据模块的原始不透明度乘以所述当前数据模块的不透明度动态比例参数，所述当前数据模块的原始不透明度为100%。
6.根据权利要求2所述的遥感数据可视化界面交互方法，其特征在于，所述根据所述相对距离变量S与所述原始距离Yi之间的关系，改变所述当前数据模块的尺寸和/或不透明度，包括：
若S＜Yi时，则控制所述当前数据模块的尺寸为原始预设尺寸；
若Yi≤S≤(Yi+H)时，则根据预设尺寸调整方式改变所述当前数据模块的尺寸；
若S>(Yi+H)时，则控制所述当前数据模块的尺寸与当S=(Yi+H)时改变后的所述当前数据模块的尺寸一致；
其中，H表示所述当前数据模块的移动方向上所占尺寸，H大于0。
7.根据权利要求6所述的遥感数据可视化界面交互方法，其特征在于，所述根据预设尺寸调整方式改变所述当前数据模块的尺寸，包括：
根据公式anime2=（H+Yi-S）/H计算所述当前数据模块随着滑动操作变化的尺寸动态比例参数；其中，anime2表示所述当前数据模块随着滑动操作变化的尺寸动态比例参数；
根据所述当前数据模块随着滑动操作变化的尺寸动态比例参数改变所述当前数据模块的尺寸，其中，改变后的所述当前数据模块的尺寸等于所述当前数据模块的原始预设尺寸乘以（α×anime2+β），所述当前数据模块的原始预设尺寸大于0，α及β为预设参数，且0<β<1,α+β=1。
8.根据权利要求1-7任一所述的遥感数据可视化界面交互方法，其特征在于，在所述判断网页页面的窗口中是否出现靠近堆叠区域的滑动操作之前，还包括：
将所述展示区域中的多个数据模块的层级沿靠近所述堆叠区域的方向依次递减设置，所述层级用于表征所述多个数据模块之间的遮挡关系，以使当所述窗口中出现靠近所述堆叠区域的滑动操作，所述堆叠区域中的当前数据模块逐步被向靠近所述堆叠区域移动的下一个数据模块部分遮挡并直至全部遮挡，直至所述下一个数据模块停留在所述堆叠区域。
9.一种遥感数据可视化界面交互装置，其特征在于，包括：
滑动操作判断模块，用于判断网页页面的窗口中是否出现靠近堆叠区域的滑动操作，所述窗口包括所述堆叠区域；
靠近操作移动模块，用于若网页页面的窗口中出现靠近堆叠区域的滑动操作，则控制展示区域向靠近所述堆叠区域进行移动，控制所述展示区域中的多个数据模块跟随所述展示区域向靠近所述堆叠区域进行移动，并将展示区域中的多个数据模块依次移动到所述堆叠区域，且停留在所述堆叠区域；所述数据模块用于展示文字、图片和/或视频的数据信息；
远离操作移动模块，用于若所述窗口中出现远离所述堆叠区域的滑动操作，则控制所述展示区域向远离所述堆叠区域进行移动，并控制所述堆叠区域中的多个数据模块依次跟随所述展示区域向远离所述堆叠区域进行移动；
参数控制模块，用于在所述靠近操作移动模块控制所述展示区域中的多个数据模块依次移动到所述堆叠区域和/或所述远离操作移动模块控制所述堆叠区域中的多个数据模块依次跟随所述展示区域向远离所述堆叠区域进行移动的过程中，同时逐渐改变所述数据模块的尺寸和/或不透明度。
10.一种遥感数据可视化界面交互电子设备，其特征在于，包括：处理器和存储器，所述存储器存储有所述处理器可执行的机器可读指令，所述机器可读指令被所述处理器执行时执行如权利要求1至8任一所述的方法。
CN202111029533.9A 2021-09-03 2021-09-03 遥感数据可视化界面交互方法、装置及电子设备 Active CN113468452B (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN202111029533.9A CN113468452B (zh) 2021-09-03 2021-09-03 遥感数据可视化界面交互方法、装置及电子设备

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN202111029533.9A CN113468452B (zh) 2021-09-03 2021-09-03 遥感数据可视化界面交互方法、装置及电子设备

Publications (2)

Publication Number Publication Date
CN113468452A true CN113468452A (zh) 2021-10-01
CN113468452B CN113468452B (zh) 2021-11-16

Family

ID=77867325

Family Applications (1)

Application Number Title Priority Date Filing Date
CN202111029533.9A Active CN113468452B (zh) 2021-09-03 2021-09-03 遥感数据可视化界面交互方法、装置及电子设备

Country Status (1)

Country Link
CN (1) CN113468452B (zh)

Citations (14)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN105069813A (zh) * 2015-07-20 2015-11-18 阔地教育科技有限公司 一种稳定检测运动目标的方法及装置
CN106681586A (zh) * 2016-12-21 2017-05-17 广东欧珀移动通信有限公司 布局位置调整方法及装置
CN108509141A (zh) * 2018-03-30 2018-09-07 维沃移动通信有限公司 一种控件的生成方法及移动终端
CN109343810A (zh) * 2018-09-30 2019-02-15 北京淳中科技股份有限公司 控制权切换方法、装置及kvm切换系统
CN109471569A (zh) * 2018-09-29 2019-03-15 努比亚技术有限公司 一种移动终端的屏幕调整方法、移动终端及存储介质
CN109815367A (zh) * 2019-01-24 2019-05-28 北京字节跳动网络技术有限公司 展示页面的交互控制方法及装置
EP3591646A1 (en) * 2013-01-22 2020-01-08 Samsung Electronics Co., Ltd. Transparent display apparatus and method thereof
CN111459601A (zh) * 2020-04-07 2020-07-28 北京字节跳动网络技术有限公司 数据处理方法、装置、电子设备及计算机可读介质
US10732792B2 (en) * 2015-01-05 2020-08-04 Samsung Electronics Co., Ltd. Image display apparatus and method for changing properties of a highlighted item and surrounding items
CN111949169A (zh) * 2020-06-30 2020-11-17 北京百度网讯科技有限公司 应用界面的显示方法和装置
CN112148160A (zh) * 2020-08-28 2020-12-29 百度在线网络技术（北京）有限公司 浮窗显示方法、装置、电子设备和计算机可读存储介质
CN113012094A (zh) * 2020-11-30 2021-06-22 中国科学院空天信息创新研究院 一种卫星遥感数据的处理方法及相关装置
CN113065022A (zh) * 2021-04-16 2021-07-02 北京金堤科技有限公司 终端设备的交互控制方法、装置及电子设备
CN113110783A (zh) * 2021-04-16 2021-07-13 北京字跳网络技术有限公司 控件的显示方法、装置、电子设备和存储介质

Patent Citations (14)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
EP3591646A1 (en) * 2013-01-22 2020-01-08 Samsung Electronics Co., Ltd. Transparent display apparatus and method thereof
US10732792B2 (en) * 2015-01-05 2020-08-04 Samsung Electronics Co., Ltd. Image display apparatus and method for changing properties of a highlighted item and surrounding items
CN105069813A (zh) * 2015-07-20 2015-11-18 阔地教育科技有限公司 一种稳定检测运动目标的方法及装置
CN106681586A (zh) * 2016-12-21 2017-05-17 广东欧珀移动通信有限公司 布局位置调整方法及装置
CN108509141A (zh) * 2018-03-30 2018-09-07 维沃移动通信有限公司 一种控件的生成方法及移动终端
CN109471569A (zh) * 2018-09-29 2019-03-15 努比亚技术有限公司 一种移动终端的屏幕调整方法、移动终端及存储介质
CN109343810A (zh) * 2018-09-30 2019-02-15 北京淳中科技股份有限公司 控制权切换方法、装置及kvm切换系统
CN109815367A (zh) * 2019-01-24 2019-05-28 北京字节跳动网络技术有限公司 展示页面的交互控制方法及装置
CN111459601A (zh) * 2020-04-07 2020-07-28 北京字节跳动网络技术有限公司 数据处理方法、装置、电子设备及计算机可读介质
CN111949169A (zh) * 2020-06-30 2020-11-17 北京百度网讯科技有限公司 应用界面的显示方法和装置
CN112148160A (zh) * 2020-08-28 2020-12-29 百度在线网络技术（北京）有限公司 浮窗显示方法、装置、电子设备和计算机可读存储介质
CN113012094A (zh) * 2020-11-30 2021-06-22 中国科学院空天信息创新研究院 一种卫星遥感数据的处理方法及相关装置
CN113065022A (zh) * 2021-04-16 2021-07-02 北京金堤科技有限公司 终端设备的交互控制方法、装置及电子设备
CN113110783A (zh) * 2021-04-16 2021-07-13 北京字跳网络技术有限公司 控件的显示方法、装置、电子设备和存储介质

Also Published As

Publication number Publication date
CN113468452B (zh) 2021-11-16

Similar Documents

Publication Publication Date Title
US10346560B2 (en) Electronic blueprint system and method
US9773072B2 (en) Systems and methods for developing adaptive layouts for electronic content
US9720581B2 (en) Responsive image rendition authoring
US20160335740A1 (en) Zoomable web-based wall with natural user interface
US9535880B2 (en) Method and apparatus for preserving fidelity of bounded rich text appearance by maintaining reflow when converting between interactive and flat documents across different environments
JP2022512056A (ja) ページ処理方法、デバイス、電子デバイス及びコンピュータ読み取り可能な記憶媒体
CN111783508A (zh) 用于处理图像的方法和装置
CN105094622A (zh) 调节表格列宽的方法及设备
US20180357206A1 (en) Content inker
CN110443772B (zh) 图片处理方法、装置、计算机设备和存储介质
CN113094127A (zh) 页面编辑方法、装置、计算机可读存储介质和计算机设备
CN111400575B (zh) 用户标识生成方法、用户识别方法及其装置
CN115563418A (zh) 页面自适应布局方法、页面信息生成方法及相关装置
KR101685288B1 (ko) 컨텐츠 표시 제어 방법 및 컨텐츠 표시 제어 방법을 수행하는 사용자 단말
CN113592720B (zh) 图像的缩放处理方法、装置、设备、存储介质
CN105389308B (zh) 网页的显示处理方法及装置
CN113762235A (zh) 检测页面叠加区域的方法和装置
CN113468452B (zh) 遥感数据可视化界面交互方法、装置及电子设备
CN110780872B (zh) 元素排布方法、装置、计算机可读存储介质及设备
US9953015B2 (en) Displaying a document file target area based on history of display settings
CN111782121B (zh) 页面滚动控制方法及装置、可读存储介质及电子设备
CN113096217B (zh) 图片生成方法、装置、电子设备以及存储介质
CN115033226A (zh) 页面显示方法、装置、终端设备及计算机可读存储介质
CN113936187A (zh) 文本图像合成方法、装置、存储介质及电子设备
US10592087B1 (en) System and method for creating fluid design keyframes on graphical user interface

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
CP03 Change of name, title or address

Address after: No. 200, building 16, middle section of shuangshenggang Avenue, Shuangliu District, Chengdu, Sichuan Province

Patentee after: Chengdu Guoxing Aerospace Technology Co.,Ltd.

Address before: No.16, 1st floor, building 7, No.333, middle section of Shuangnan Avenue, Dongsheng Street, Shuangliu District, Chengdu, Sichuan 610000

Patentee before: CHENGDU GUOXING AEROSPACE TECHNOLOGY Co.,Ltd.

CP03 Change of name, title or address