大家好，我是黄同学 前段时间用tableau做了可视化大屏，大家有的说说没学过tableau，有的说不会做，但就是觉得很炫。 因此，有人私聊我说用excel能做可视化大屏吗？...当然，这是可以的，基于粉丝的这个需求，我们今天来讲述一下，怎么使用excel做一个简单的可视化大屏。...7、可视化大屏的制作过程 1）给大屏添加一个“深蓝色”的背景 注意：可视化大屏的制作，我们也另外开一个SHEET窗口。 ? 2）插入文本框：添加一个标题 ?...5）在“可视化大屏”中，进行联动效果的设置 ? 从上图中可以看出，这里每一个条件求和公式中，引用的日期都是“维度汇总”sheet表中的F1单元格。...但是在大屏中，我们同样做了一个这样的下拉菜单，我们需要将这个页面中，引用了“维度汇总!$F1”单元格的公式，全部替换为“可视 化大屏的制作1”单元格的公式，全部替换为“可视化大屏的制作C$3”。
全面屏时代，交互方式会有哪些变化？ 什么是全面屏？...2017年可以称为全面屏集中爆发的一年，小米，OPPO，VIVO，华为，三星，苹果等等都在今年发布了全面屏手机，全面屏时代已经到来，在我看来全面屏就是一种通过优化硬件堆叠、模组等方式提高屏占比，一般有三种实现方式...当然这里我们不讨论什么是真正的全面屏，屏幕作为一个向用户展示内容的的载体，用户很大一部分的交互都是在屏幕上完成的，智能手机的屏幕发生了变化，屏占比增大，那么是否会带来新的交互？答案是肯定的。...，我们设计App的时候可以借鉴这样的滑动交互，滑动方向位置可以根据需求不同而变化，要注意的是避免用户误触。...2.悬浮触点 其实悬浮触点这个功能大部分手机厂商都会有，我认为在全面屏上这个功能还是有很大的发挥空间的，一方面根据悬浮触点，用户可以进行快捷操作，另一方面悬浮触点可以大大缩短用户交互的物理路径，比如一个查看通知的场景
来看一下Redux在大屏展示中具体的使用场景： 下面的截图是一个产品开发中非常常见的大屏展示界面示例。...从图上来看，似乎已经具备了大屏展示的数据显示和统计功能，但是展示的数据是没有办法被编辑和修改的。此时，你可能会收到来自客户的灵魂拷问： “展示功能已经不错了，但是表格数据可以实时编辑更新吗？”...)); } function handleFileImported(newSales) { dispatch(importSales(newSales)); } 对大屏展示面板加入...借助 Redux提供的可预测化的状态管理和交互式电子表格，可以在很短内创建复杂的企业 JavaScript 应用程序。
下图是一个产品开发中非常常见的大屏展示界面示例。 通过Vue提供的Vuex，上方三个仪表板以及下方的表格组件共享同一个数据源，已经实现了数据改变后同步响应更新。...“很棒的大屏展示功能，能支持Excel数据的导入导出吗，表格数据可以实时编辑更新吗？” 如果你已经开发软件很长时间，可能不止一次地从最终客户或者产品经理那里听到过这个灵魂拷问。...同时和其他的组件进行交互。 这篇博客将研究如何使用现有的这个大屏展示 Vue 应用作为基础，使用前端电子表格对其进行增强。 本文假定你已经了解 HTML、CSS 和 JavaScript。...本文将分为下面的几个部分 Vuex的原始应用 给应用添加实时编辑功能 添加 Excel 数据导入功能 添加导出为Excel功能 包含Vuex的原始应用 如上图看到的，将要使用的 Vue 应用程序是一个简单的大屏展示界面...借助 Vue 的模板和数据绑定、Vuex 的管理共享状态，响应式数据存储和纯前端的交互式电子表格，可以在很短内创建复杂的企业 JavaScript 应用程序。
前言 2020年，智能手机大行其道，相信不会还有人用着老式的按键手机了吧，而智能手机最大的交互就是手机屏幕，其次的就是音量操作、生物识别(指纹+人脸+瞳孔)、说白了用的最多的是手机的屏幕，屏幕与用户之前进行交互...有人说我可以用语音去打开，但是你没有想过语音其实只是帮你执行了点击，在手机上不管是玩游戏还是看电影或者是搞学习，都是要使用手机屏幕的，所以你知道屏幕交互有多么重要吗？...正文 屏幕的交互当然首先是触摸，说道触摸就是有一个手势监听，这个是Google起的名字，你不用手难道用脚吗？ 下面可以新建一个项目，在MainActivity中实现两个监听 ?...Override public boolean onDoubleTapEvent(MotionEvent e) { return false; } 在Android系统中，每一次手势交互都会依照以下顺序执行...接触接触屏一刹那，触发一个MotionEvent事件。
依托云计算、大数据、人工智能、区块链、5G等五大前沿核心技术，腾讯教育从“连接”、“内容”、“生态”三大维度，打造全方位、多元化、高质量的生态网，为罗湖教育输送优质资源，持续助力罗湖智慧教育云平台的落地...下面，我举个例子介绍下这五项技术是如何融通运转的。例如，日常我们通过智能作业批改、校园AI数据等进行数据收集，这个过程的背后是人工智能、物联网感知技术在支撑。...数据经过平台融通处理，完成汇总后，通过5G技术传到云端，在云端大数据库中进行计算。...连接中心是以腾讯智慧校园平台、微信生态为基础构建的一体化信息管理平台，旨在融通教育应用生态，实现家、校、管理者的高效沟通和管理工作落地。...正如前面所提，我们打造的是“基础平台：系统集成，一号打通”、“应用中心：无限扩展、一网打尽”、“数据中心：精准分析、一屏智享”的教育新生态，连接中心、内容中心、生态中心是这张蓝图落地的三大抓手，与罗湖教育共同描绘智慧化
大屏开发心得 布局篇 因为大屏不是对外开放的，所以可以使用固定的浏览器。既然这样其实是可以使用一些相对比较新的技术的。所以在布局这块我优先选择使用flexbox技术。...因为大屏屏幕很大，设计师给出的设计图通常会有很大的尺寸。其实设计师并不知道的是大屏屏幕在再大，也不过就是一个显示屏的尺寸。其实那这块需要的就是一个等比缩放。...所以在布局之前需要首先设置的是外框尺寸 html, body { height: 100%; } 大屏首先要把要把这种尺寸的差异解决，这就体现出来flexbox的优势了。...大屏模糊的问题 大屏一般都是多块屏幕拼凑起来的一整块屏。设计稿给的一个页面。开始的时候我们是按照一个页面进行开发的。但是投到一个大屏的时候问题来了，因为放的很大，锯齿很严重。...所以后来还是把大屏分开了，设计稿的每个部分拆成一个页面，每个小屏幕显示一个页面。这样子锯齿情况就减轻很多。 还解决了一个问题，就是整个屏幕的时候，字体太大。
大屏数据显示优化 大屏数据的页面里面包含了一些3D地图和世界航班趋势图，反应上来有个问题，就是动画比较卡顿。...而大屏像素很低，高清的图片也显示的像素点很大，看起来非常模糊，所以并没有必要使用高清的。把图片质量降低一些，切换卡顿就不见了，显示却并没有特别的变化。
前言 可视化大屏该如何做？有可能一天完成吗？废话不多说，直接看效果，线上 Demo 地址 lxfu1.github.io/large-scree…。...如何用 canvas 绘制各种图表，如何实现 canvas 动画 如何自动化部署自己的大屏网站 实现 项目基于 Create React App --template typescript搭建，包管理工具使用的...缺点：兼容性，基于 proxy 开发，对低版本浏览器不友好，当然，大屏应该也不会考虑 IE 这类浏览器。...当然，在这个项目中函数缓存比较鸡肋，为了用而用，试想，如果有一个函数计算量非常大，组件内又有多个 state 频繁更新，怎么确保函数不被重复调用呢？
在折叠状态时可以把背面当做一个附加的交互空间，实现一些简单的交互操作，例如打吃鸡游戏时我们可以考虑在背面屏幕增加一些手势操作进行8倍镜的缩放（这种背部触控方式并不是什么新鲜事，在2011年索尼旗下的掌上型游戏机...折叠屏手机交互设计的改变 响应式布局 当折叠屏从小屏模式转变成大屏模式时不应该只是画面的等比例变大，而是要考虑响应式布局设计。...举个例子，在大屏上运行时，可以再添加一栏，并且加入分类列表，这些都是合理的。这个例子展示了在手机上使用一栏纵向滚动，而在平板上使用两栏横向滚动的优化。 ?...当玩家使用小屏模式时我们可以收起所有功能界面，使游戏的沉浸感更强；当玩家采用大屏模式时，我们可以认为玩家需要获取更多信息，这时候把聊天、装备等相关功能界面展示出来。...因此设计师在设计折叠屏交互时要考虑哪些页面不能被销毁，一定要让用户进行展开、折叠等操作， 应用任务不中断重启，产品可以自动适应各种屏幕下的静态布局规格。
数据大屏V0.1-2020.8.31 前言 千辛万苦，找到了python能实现数据大屏库pyecharts。...那就把采集的CSV做一个数据大屏吧 1、引入库 2、# -*- coding: utf-8 -*- 3、import jieba 4、import pandas as pd #读取文件的库 5、from...18、wordcloud.add("", zip(y, x), word_size_range=[20, 100], shape='circle') 19、wordcloud.render() 20、大屏
魔术师 - 巴兹尔·霍金斯前言最近在做一个大屏项目，里面包含整页静态背景图，静态效果图，动态图等内容填充，产品出个思路，UI出个静态设计稿，最终做出来的某大屏页效果大概如下，开发完第一版后，测试发现最大的问题是笔记本屏幕上的效果兼容问题...实现整体在屏幕中的位置相对合适基于六边形图的位置，把左右四个树形图定位上去最后把文字基于图片位置定位写上去就行了遇到的问题，解决方案位置异常刚开始做完以后在PC屏幕上看着正常，在浏览器 tab 页签下看的效果，由于是大屏项目...80%"; } else { document.documentElement.style.zoom = "70%"; } };代码中进行了屏幕宽度判断，如果是大屏...也添加了缩放效果，笔记本中左侧数据依然显示不完整产品设计问题，由于左上角的内容显示太多了，显示不全，把 元/头 和 母猪 这两部分可省略的字都去掉就行了，找产品，跟Ta说一下，把能省略的字去掉写在最后大屏项目的各种适配问题
数据链路的稳定性 接口服务的兜底 指标准确性的验证机制 重算机制 本文内容有限，很多设计的小细节未能体现，感兴趣的欢迎交流，希望上述内容对正在从事大屏建设的同学有一些新的启发和思考。...供应链大屏是供应链事业部重要的看数工具，尤其在大促期间，为业务管理层掌握大促实时动态提供了支撑，为事业部的目标达成、排产提供重要的数据支持。...对于大屏等核心任务，数据的实时性和准确性要求较高，以下是历史发生过的问题： CK分区太多，写入阻塞 CK rename操作，节点太多，表结构同步慢，导致写入报错，大量消息积压，丢消息 Flink机房网络故障...3）大屏结果分钟级落库，并通过Grafana,创建大屏数据监控看板，持续监控大屏数据，通过异常拐点发现问题点，避免遗漏问题。并结合不同看板分析数据趋势及变化原因。...4）结合大屏计算逻辑，通过京东动力搭建测试模型，做到自由指定时间计算大屏指标明细，验证分析大屏数据。
一提到监控大屏，那第一想法就是 grafana 对吧，各种样式图形都非常好看，而且支持各种数据源。...而今天要分享的是一个更加轻量的监控大屏 monitoror/monitoror 有了它能帮你快读构建一个的对于网站或者应用的监控页面，特别是在小应用数量多的时候非常简单易用，作为一个大屏展示时它我觉得它足够简洁...demo & repo https://demo.monitoror.com/ https://github.com/monitoror/monitoror 优点 部署轻量 配置简单 大屏简洁 部署...//monitoror.com/guides/ 甚至可以将这个安装到树莓派上去，这个就很有意思了，因为轻量的关系，这个作为一个监控随便插到哪里，还蛮有意思的 总结 如果你需要最快速的搭建一个可用的监控大屏...后记 当前这个监控还没有通知模块，也就是说，也只能大屏盯着看，emmm…，这个还是有点小鸡肋的，因为确实不可能一直盯着看。
智慧水务可视化大屏通常需要展现以下几类信息： 01. 实时监测数据： 包括水源水质、水压、水位、水流速等实时监测数据，通过图表、曲线等形式展示，帮助监测人员了解当前水务系统的运行状态。 02....综合展现以上信息，智慧水务可视化大屏可以帮助相关人员全面了解水务系统的运行情况，及时发现问题并进行处理，提高水务管理的效率和水平。
记录一款好用的大屏工具，DataGear，官方标记为“开源免费的数据可视化分析平台”。...等大数据引擎 支持多种格式的数据集：支持创建SQL、CSV、Excel、HTTP接口、JSON数据集，可将数据集定义为动态参数化数据集，可添加文本框、下拉框、日期框、时间框等类型的数据集参数，为构建动态可交互图表提供支持...可自由编辑的数据可视化页面：可视化页面采用原生的HTML网页作为模板，可自由编辑页面内容，支持导入任意HTML网页，为元素添加扩展属性即可绑定和配置图表，页面内置丰富的API，可构建图表联动、数据钻取、异步加载、交互表单等个性化的数据可视化页面...这点对于业务用户来说很友好，可以轻松的搭建起系统，在组织内（提供有用户、权限管理功能）以图表、大屏的方式分享数据。...对于IT人员来说，目前该系统还不支持与其他系统做单点登录认证，用户权限也难以集成，不过可以通过iframe等方式将该系统作为数据的展示工具，主要实现大屏的展示。
Python数据可视化 利用pyecharts做数据大屏dashboard 首先做一个折线图 import os from pyecharts import options as opts from...dest='dashboard.html') Page_total() os.system('dashboard.html') 这就是运行好后的数据大屏
import { constantRouterMap } from '@/config/router.config'
室内全彩大屏数据显示优化 室内全彩大屏数据的页面里面包含了一些3D地图和世界航班趋势图，反应上来有个问题，就是动画比较卡顿。...而大屏像素很低，高清的图片也显示的像素点很大，看起来非常模糊，所以并没有必要使用高清的。把图片质量降低一些，切换卡顿就不见了，显示却并没有特别的变化。
交互设计七大定律： 费茨定律（Fitts’ Law） 格式塔原则 本能反应 7±2法则 席克定律 莱斯托夫效应 色彩心理学 ? 马克吐温说过：当你手里只有锤子的时候，那么看待什么问题都像钉子。...例如我们常见的横向交互，会在屏幕右侧故意露出一部分，来告诉用户通过滑动可以得到更多内容。 ?...如上图，Fancy 利用横向交互隐藏更多内容，同时又在屏幕的右边展现出一部分内容来吸引用户滑动查看更多内容。 d.邻近原则 人们会将相邻比较近的元素自动归为一组。...本能反应定义 本能反应是指：用户第一眼见到产品时的感受，而此时用户还没有与产品产生交互。 2....格式塔原则我们提到在设计中我们主要参考“相似性原则、延续性原则、封闭性原则、邻近原则、简单性原则”这五大原则进行界面设计。 本能反应是指用户第一眼见到产品时的感受，而此时用户还没有与产品产生交互。
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
实时音视频
对象存储
即时通信 IM
