首页 > 其他分享 >可视化大屏的互动潜力:交互功能一览

可视化大屏的互动潜力:交互功能一览

时间:2023-09-22 16:57:55浏览次数:47  
标签:触发 鼠标 用户 可视化 大屏 交互

一、交互的概念

交互是指人与计算机、人与人、或人与任何其他系统之间的信息、意见、操作等的相互作用和影响。在计算机科学和人机交互领域,交互通常指的是用户与计算机软件或硬件之间的互动,包括通过键盘、鼠标、触摸屏等输入设备向计算机提供信息,以及从计算机接收反馈、信息或结果的过程。良好的交互设计可以提高用户体验,使用户更轻松地与计算机系统交互。

在可视化大屏中,交互是指用户与大屏系统之间的相互作用和沟通过程。这种交互设计旨在使用户能够更直观地理解数据、图表、地图等信息,并与这些信息进行互动,以便更好地探索数据、获取见解和做出决策。

二、交互的意义

在可视化大屏设计中,良好的交互设计可以提高可视化大屏的用户友好性,使用户更容易理解和利用显示的信息,从而更好地支持决策和数据分析。

控制:用户可以使用鼠标、触摸屏或遥控器等设备来浏览不同的信息板块、切换仪表盘、放大缩小地图等。

筛选数据:用户可以选择特定的数据点、时间范围或其他参数,以便根据自己的需求过滤和查看数据。

图表交互:用户可以悬停在图表上查看详细信息、点击图表元素以获取更多数据,或在图表之间进行比较。

搜索功能:用户可以使用搜索框来查找特定的信息或数据点。

反馈和通知:系统可以向用户提供警报、通知或弹出窗口,以便及时响应重要事件。

自定义视图:用户可以根据自己的需求自定义大屏上显示的信息,例如添加、删除或重新排列组件。

三、如何交互?

在可视化大屏中,交互一般可以分为两种:

第一种:通过鼠标操作触发,例如点击一个按钮触发一个弹窗。

第二种:通过二次开发、数据变化和页面切换时触发,例如数据异常时组价的颜色发生变化。

这两种都可以直接在山海鲸可视化软件中设置,具体步骤如下:

(1)通过鼠标操作触发的交互

这种交互设置在触发组件上,即点击 A 触发 B 的时候,交互是设置在 A 组件上的。

 

点击“添加交互”后可以对组件的交互进行详细设置,包括:

名称:如果不填写,系统会根据所选参数给一个默认名称。在交互设置比较多时,设置一个名称会有利于我们识别当前交互的作用。

事件:指的是触发动作,包括“点击”、“接收到二次开发中的事件”、“鼠标移入时”、“鼠标移出时”、“入场”和“离场”。

 

动作:指的是由事件触发之后的交互行为,包括“切换状态”、“修改设置”、“子大屏跳转”、“打开链接”、“控制弹窗”、“刷新数据”、“全屏播放控制”“修改项目参数”、“触发二次开发中的事件”和“自定义”,不同的动作会有一些不同的参数设置。

 

(2)通过全屏播放或数据变化触发的交互

这种交互设置在子大屏上,在未选中组件时,可以在软件编辑界面右侧交互中进行设置.

 

以上内容来源于山海鲸可视化官网,感兴趣可前往官网查看更多图文和视频教程~!

标签:触发,鼠标,用户,可视化,大屏,交互
From: https://www.cnblogs.com/shanhaibi/p/17722832.html

相关文章

  • 方案:AI赋能,森林防火可视化智能监管与风险预警系统解决方案
    一、方案背景森林火灾是世界八大自然灾害之一,具有发生面广、突发性强、破坏性大、危险性高、处置扑救特别困难等特点,严重危及人民生命财产和森林资源安全,甚至引发生态灾难。有效预防和及时控制森林火灾是保护国家生态建设成果、推进生态文明建设的重要措施。监管痛点:1)现有的森......
  • struts2与ajax交互
    实现动态检验用户是否在数据库中存在. 一:JSP页面<scripttype="text/javascript"src="JS/Ajax.js"<scripttype="text/javascript">functionif(value!=""){"get","check?usersName="+value,deal,null);}......
  • docker容器中打开gazebo等可视化页面报错No protocol specified
    转载:https://blog.csdn.net/wsl_longwudi/article/details/127005162权限问题Noprotocolspecified问题这是由于X11服务默认只允许『来自本地的用户』启动的图形程序将图形显示在当前屏幕上。解决的办法很简单,允许所有用户访问X11服务即可。这个事情可以用xhost命令完成在宿主......
  • 大屏幕实时数据可视化解决方案?
    大屏幕实时数据可视化解决方案是一种将大量数据以直观并且易于理解的方式展示在大型显示屏上的技术方案。这种解决方案在很多领域都有广泛的应用,例如物流管理、生产监控、金融分析等。下面是一个详细介绍大屏幕实时数据可视化解决方案的示例。一、需求分析和目标设定在开始设计......
  • Arcgis 与 Pixi.js 可视化 glsl 特效篇(十八)
    这次我们用pixi.js和arcgisjs结合我们先定义一下传入数据结构symbol暂时不做let option={renderer:{type:"simple",symbol:{}},data:[{geometry:[12956152.73135875,4855356.473704897],attributes:{name:"北京"}},{geometry:[12697872.01278319......
  • Arcgis 与 Pixi.js 可视化 glsl 特效篇(十七)
    这次我们用pixi.js和arcgisjs结合我们先定义一下传入数据结构symbol暂时不做let option={renderer:{type:"simple",symbol:{}},data:[{geometry:[12956152.73135875,4855356.473704897],attributes:{name:"北京"}},{geometry:[12697872.0127......
  • Arcgis 与 Pixi.js 可视化 glsl 特效篇(十六)
    这次我们用pixi.js和arcgisjs结合我们先定义一下传入数据结构symbol暂时不做let option={renderer:{type:"simple",symbol:{}},data:[{geometry:[12956152.73135875,4855356.473704897],attributes:{name:"北京"}},{geometry:[12697872.01278319......
  • Arcgis 与 Pixi.js 可视化 glsl 特效篇(十五)
    这次我们用pixi.js和arcgisjs结合我们先定义一下传入数据结构symbol暂时不做let option={renderer:{type:"simple",symbol:{}},data:[{geometry:[12956152.73135875,4855356.473704897],attributes:{name:"北京"}},{geometry:[12697872.01278319......
  • Arcgis 与 Pixi.js 可视化 glsl 特效篇(二十)
    这次我们用pixi.js和arcgisjs结合我们先定义一下传入数据结构symbol暂时不做let option={renderer:{type:"simple",symbol:{}},data:[{geometry:[12956152.73135875,4855356.473704897],attributes:{name:"北京"}},{geometry:[12697872.01278319......
  • Arcgis 与 Pixi.js 可视化 glsl 特效篇(十九)
    这次我们用pixi.js和arcgisjs结合我们先定义一下传入数据结构symbol暂时不做let option={renderer:{type:"simple",symbol:{}},data:[{geometry:[12956152.73135875,4855356.473704897],attributes:{name:"北京"}},{geometry:[12697872.01278319......