点击有惊喜

实验背景介绍

了解更多2017云栖大会·杭州峰会 TechInsight & Workshop.

本手册为云栖大会Workshop之《在线用户行为分析:基于流式计算的数据处理及应用》场的《数据可视化:构建实时动态运营数据分析大屏》篇所需。主要帮助现场学员熟悉并掌握DataV数据可视化的操作和使用。

实验涉及大数据产品

  • DataV数据可视化

前提准备

必备条件:1、已经从云中沙箱中获取了实验所需的阿里云账号和密码。2、安装56版本以上的GOOGLE CHROME浏览器。

实验目标

本实验将会实现如下的**实时动态运营数据分析大屏**大屏。

创建可视化大屏

经过上述《流数据处理:通过StreamSQL分析视频日志》章节创建的流式任务,我们可以创建酷炫的可视化大屏展示网站实时流量统计情况,为了便于大家快速掌握DataV的使用,请使用事先准备好的RDS数据源。

进入DataV管理控制台

点击进入DataV可视化管理控制台。

添加数据源

  • step1:进入DataV管理控制台,点击左侧菜单中**我的数据**。

  • step2:点击**+添加数据**,跳出新建数据对话框。

  • step3:配置数据类型为RDS for MySQL、名称、域名、用户名/密码、端口和数据库,点击“获取数据列表”,选择“workshop”,并点击**测试连接**,最后点击“完成”。

具体数据源配置项如下:

  • 数据源类型:RDS for MySQL,内网,华东2
  • 名称:workshop_rds
  • 域名:rm-uf6t1mym355i3qdsw.mysql.rds.aliyuncs.com
  • 用户名:root
  • 密码:Workshop001
  • 端口:3306
  • 数据库:workshop

创建DataV可视化大屏

  • step1:点击左侧**我的可视化**,进入配置大屏操作;再点击**2017_WORKSHOP_HZ**进入大屏编辑界面。

  • step2:此处大屏模板为此次Workshop量身定制,大家直接进入配置界面即可。DATAV功能布局见图示。

配置DataV数据图表

依次配置**实时在线人数(数字翻牌器)**、**热门房间排名(轮播列表柱状图)**、**在线人数变化趋势(折线图)**、**用户卡顿率趋势(折线图)**、**访问设备比例(饼图)**、**用户故障地理分布(点热力图)**。

配置实时在线人数(数字翻牌器)
  • step1:点击数字翻牌器,进入配置**实时在线人数(数字翻牌器)**页面。

  • step2:点击数字翻牌器左侧“数据“选项卡,进入数据配置面板。

数据类型选择**数据库**,选择数据库为**workshop_rds**(刚创建的数据源名称)在SQL底部勾选**自动更新**,设置每5秒请求一次。
因为数据表包含了多条数据,需要获取最新的在线人数数据,故编写SQL如下:

附:SQL说明

SELECT sum(count_value) as value FROM online_num
配置热门房间排名(轮播列表柱状图)

点击轮播列表在右侧进行配置数据。统一选择数据类型为**数据库**,且选择数据库为之前所配置的workshop_rds。

附:SQL说明

SELECT sum(count_value) as value, roomid as content
FROM hot_room_num
where
start_time < unix_timestamp()*1000
and start_time > (unix_timestamp()-100)*1000
group by content
order by value DESC
limit 5
配置在线人数变化趋势(折线图)
  • step1:同样点击在线人数变化趋势(折线图),进入数据配置页面。
  • step2:配置数据源。

数据类型选择**数据库**,选择数据库为**workshop_rds**(刚创建的数据源名称)在SQL底部勾选**自动更新**,设置每5秒请求一次。

附:SQL说明

   SELECT count_value as y, substring(start_time,  1, 19)  as xFROM online_numorder by start_time DESClimit 10
配置用户卡顿率变化趋势(折线图)
  • step1:同样点击用户卡顿率变化趋势(折线图),进入数据配置页面。
  • step2:配置数据源。

数据类型选择**数据库**,选择数据库为**workshop_rds**(刚创建的数据源名称)在SQL底部勾选**自动更新**,设置每5秒请求一次。

附:SQL说明

SELECT block as y, substring(start_time,  1, 19) as x FROM block_min order by start_time DESC limit 10
配置访问设备比例(饼图)
  • step1:同样点击配置访问设备比例(饼图),进入数据配置页面。

  • step2:配置数据源。

    数据类型选择**数据库**,选择数据库为**workshop_rds**(刚创建的数据源名称)在SQL底部勾选**自动更新**,设置每5秒请求一次。
    编写SQL如下:

附:SQL说明

SELECT
sum(count_value) as value,
agent as type,
max(start_time) as date_time
FROM access_device
where
start_time < unix_timestamp()*1000
and start_time > (unix_timestamp()-100)*1000
group by agent
配置播放故障率(点热力图)
  • step1:点击地图组件,再选择点热力图层子组件。

  • step2:进入数据配置页面,配置数据源。

    数据类型选择**数据库**,选择数据库为**workshop_rds**(刚创建的数据源名称)在SQL底部勾选**自动更新**,设置每5秒请求一次。
    我们需要的数据包括经度、纬度和故障率,但是原始数据中,经度、纬度在一个字段中,且该字段包含空数据等脏数据;同时,故障率为0的数据我们不需要,因为对绘制热力图不起作用。这就需要我们用DATAV数据过滤器处理。先用SQL查询10000条数据,保证充足的数据量进行下一步过滤。
    附:SQL说明

SELECT * FROM region_failure_rate limit 10000
  • step3.1 添加数据过滤器

  • step3.2 将新建数据过滤器命名为“getVideoFaultValue”
  • step3.3 编写数据过滤器

  • step3.4 选择应用数据过滤器“getVideoFaultValue”

    附:数据过滤器代码说明

var processedData = [];data.forEach(function(d, i) {if(d.remoteip && +d.fault_video > 0) {var dataObj = {};var latLngArray = d.remoteip.split(',');dataObj.lat = latLngArray[0];dataObj.lng = latLngArray[1];dataObj.value = +d.fault_video;processedData.push(dataObj);}
})return processedData;

至此我们对所有组件的数据都已经配置完成。

预览大屏

  • 点击右上角**预览**,查看大屏效果,会看到数据实时的刷新。

发布大屏

通过发布操作可以将制作好的大屏分享别人查看。

  • step1:点击右上角**发布**,弹出发布对话框,打开发布按钮会生成链接。

复制生成的URL即可共享你的大屏作品,观看制作的流式数据大屏。其他验证密码、验证Token可以参考更多教程来完成,此处将不赘述。

到此为止,相信大家一定程度掌握了阿里云流式日志的分析及处理解决方案有了一定了解,包括Log、StreamCompute到最后的DataV大屏展示。更多内容请大家持续关注文章的更新和后续的workshop内容出品。

点击有惊喜

2017云栖大会·杭州峰会:《在线用户行为分析:基于流式计算的数据处理及应用》之《数据可视化:构建实时动态运营数据分析大屏》篇相关推荐

  1. 2017云栖大会·杭州峰会:《在线用户行为分析:基于流式计算的数据处理及应用》之《数据可视化:构建实时动态运营数据分析大屏》篇...

    实验背景介绍 了解更多2017云栖大会·杭州峰会 TechInsight & Workshop. 本手册为云栖大会Workshop之<在线用户行为分析:基于流式计算的数据处理及应用> ...

  2. 【全记录】2017云栖大会·北京峰会——企业云上业务优化专场

    作为本年度科技界的压轴大戏,2017云栖大会·北京峰会盛大空前, 30+主题论坛.深度技术解读.行业前沿实践分享以及创新互动体验让来到现场的朋友们印象深刻.本次峰会中,由阿里云客户服务部主办的 &qu ...

  3. 【资料合集】2017云栖大会·苏州峰会回顾合集:PDF下载

    技术揭秘大狂欢,12月7日,云栖大会·苏州峰会于苏州日航酒店三楼中宴会厅召开,带来前沿技术理念及实践技术成果分享.本次云栖大会的看点:企业软件供应链生产效能如何提升:如何实现高效研发实践:初创企业如何 ...

  4. 【资料合集】2017云栖大会•苏州峰会回顾合集:PDF下载

    技术揭秘大狂欢,12月7日,云栖大会·苏州峰会于苏州日航酒店三楼中宴会厅召开,带来前沿技术理念及实践技术成果分享.本次云栖大会的看点:企业软件供应链生产效能如何提升:如何实现高效研发实践:初创企业如何 ...

  5. 大数据workshop:《在线用户行为分析:基于流式计算的数据处理及应用》之《实时数据分析:海量日志数据多维透视》篇...

    实验背景介绍 了解更多2017云栖大会·成都峰会 TechInsight & Workshop. 本手册为云栖大会Workshop之<在线用户行为分析:基于流式计算的数据处理及应用> ...

  6. 【资料合集】2017云栖大会·上海峰会回顾合集:PDF下载+现场视频

    摘要: 科技盛宴再临上海,6月10日-11日,云栖大会·上海峰会于上海跨国采购会展中心召开. 为了让大家get到现场嘉宾分享的技术和知识,小编特将本次峰会的部分PPT资料和视频整理出来,供大家下载.学 ...

  7. 2017云栖大会开源峰会预告

    想不想知道是什么 想不想知道是什么

  8. 重磅干货不容错过!2017云栖大会汇总资料,速来领取!

    原文链接:点击打开链接 摘要: 2017云栖大会圆满结束!云栖大会由阿里巴巴集团主办,已经成为全球云计算TOP级峰会,汇聚DT时代最强大脑,描绘云计算发展趋势和蓝图,展现云计算.大数据.人工智能蓬勃发 ...

  9. 【印象】2016云栖大会城市峰会:上海、深圳、南京、北京等精彩复现

    2016年,云栖大会城市峰会陆续走过了9座城市,云栖社区特此打包峰会的概要,方便大家好好温习. 作为"世界级·现象级"的大会,2017云栖大会将于10月11-14日在杭州云栖小镇举 ...

最新文章

  1. 中文开源!它或许是最适合自学的Python教材
  2. 赠票 | 相约乌镇!世界互联网大会大数据与AI赋能实体经济论坛
  3. 6001.Cacti监控华为S8512核心交换机多块板卡的CPU和内存
  4. ML之Anaconda:关于Anaconda集成平台简介、安装、使用方法的详细攻略
  5. tensorflow-Inception-v3模型训练自己的数据代码示例
  6. JavaScript的对象
  7. ctype函数_PHP ctype_xdigit()函数与示例
  8. angular日期输入框html,html5 – Angular2:日期格式文本框ngModel不起作用
  9. python基础教程是什么-python基础教程都有什么?
  10. C++如何能够快速的学会?如何快速找到工作
  11. matplotlib快速画图
  12. multiprocessing模块
  13. 好!今天开始研读《嵌入式Linux驱动程序设计从入门到精通》!
  14. matlab bp结果,BP-networkmatlab BP神经网络实现手写数字识别,使用 。内有测试数据及实验结果,非常适合入门 276万源代码下载- www.pudn.com...
  15. Flash:任意变形工具的使用
  16. python模拟seo_百度统计原理分析-利用Python实现模拟访问
  17. 赛格威机器人路萌中国首秀 开发者计划今年将在国内落地
  18. centos7下安装pg数据库
  19. 「安全系列之CSRF」如何防范csrf攻击
  20. 关于在caddy环境下,使用https协议UC无法下载的解决方法。

热门文章

  1. hdu6400 矩阵问题
  2. 微信文件删除了怎么恢复,3个实用有用的方法
  3. 随笔:在C语言中如何快速的将16位数据拆开存到8位数组中
  4. 网页编程代码书写规范
  5. 计算机故事英语版,计算机英文原版
  6. 反斜杠转正斜杠 bat
  7. C语言经典递推算法之杨辉三角展开(详解)
  8. [转]C++中的头文件和源文件 .h .cpp
  9. 一般linux用哪个系统,一般linux服务器用哪个系统
  10. 摩杜云:“国资云”杀入云计算行业,云计算行业的冬天要来了吗?