一、腾讯云图 数据之美
了解腾讯云图之前,我们先来看看数据可视化?
这是星云图,他表示的是QQ同时在线人数,看到这个图大家脑袋里面想到什么?QQ,蓝钻、绿钻、太阳、月亮、上学的时候跟同学聊天,认识默认网友,你会是这众多闪亮星星中的哪一个呢,进一步分析可以看到沿海地区相对闪亮,结合现实情况,沿海地区设备网络相对发达,年轻化程度高,用户活跃等等。这就是数据可视化的魅力,给特定角色在特定场景讲述特定的故事。数据可视化的目的是让数据说话,让复杂抽象的数据以视觉的形式更准确快速的传达
腾讯云图正是一站式数据可视化平台,支持多种数据源,覆盖多个领域模板,拖拽式自由布局,零门槛快速打造专业大屏。说人话,就是说即使我不是专业工程师,也可以使用腾讯云图,把一堆抽象枯燥无味的数据通过屌炸天的方式展示出来。
腾讯云图已经接入的客户案例包括:永辉超级物种,艺龙网全国IDC网络出口流量监控,格灵深瞳人脸特征大数据分析等。
永辉超级物种深圳创投店的大屏,是两块竖的大屏,呈现商圈客流热力,分时客流,门店最受欢迎饮品,最受欢迎水果单品等。某日统计到周边商圈客流量超过30万人,最受欢迎的饮品是农夫山泉和可口可乐,最爱的水果是火焰红葡萄。
门店可以直观的观察到周围客流量,以及购物意向,指导门店备货等。
顾客进店也可以立即看到最受欢迎商品,购买到自己满意的东西。
同时可以进一步根据周边环境,顾客消费情况,分析用户画像,深挖更多有价值的数据。
腾讯云图把以上专业的有价值的内容模板化,提供出智慧零售行业模板,其他类似场景的用户可以直接使用该模板,快速搭建自己的可视化大屏。
腾讯云图不仅在智慧零售领域,在其他多个领域,也提供了许多行业模板,比如监控领域、政府工作等等。
用户也可以根据模板自己根据特定场景定制自己的大屏,腾讯云图提供丰富的组件,有表示对比关系的柱状图、条形图、折线图等,表示构成的饼图、面积图等,表示分布的散点图、直方图等,还有跟地理位置有关的多种地图。这些组件腾讯云图大部分自主研发,也接入echarts等第三方开源组件。
大屏设计页面,主要分为工具栏、图层、画布、配置面板(属性、数据)。工具栏、图层、配置面板可以自由收放,让画布区域更大化,让用户能更精确的拖动组件进行沉浸式操作。
跟《三体》里面描述未来世界如出一辙。它这样描述:这个世界到处都是简洁空荡的,几乎见不到任何设施,只有在需要时,设施才会出现,而且是在任何需要的位置出现。世界在被技术复杂化后,正在重新变得简洁起来,技术被深深地隐藏在现实的后面。
二、腾讯云图 方案设计
如此酷炫,能让数据说话的腾讯云图具体怎么实现的呢?腾讯云图的主要模块包括:组件库、大屏设计、属性管理、数据管理。 组件库包括基础组件\地图组件\图表组件\装饰组件\文本组件\媒体组件\小部件等,每个组件都有自己的属性定义,通过bundle-loader异步加载。 大屏设计包括工具栏、画布、图层、属性、数据等。 属性管理包括基础组件(比如文本输入框、数字输入框、开关按钮等),复合组件(比如标题组件、位置组件等)、数据映射配置。
数据源包括:静态数据、csv文件、API、腾讯云/公网数据库、腾讯云监控。
具体实现过程:画布中一个组件面积图,它由数据、代码、属性组成,通过控制面板调整任何属性或者数据,都可以改变该面积图。使用react redux经典三部曲action,store,reducer实现。当用户改变属性或者数据,会发起 action ,store 会调用 dispatch 方法向某个特定的 reducer 传递该 action,reducer 收到 action 之后执行对应的更新逻辑然后返回一个新的 state,state 的更新最终会传递到根reducer处,返回一个全新的完整的 state,然后传递给组件进行更新。
三、腾讯云图 组件实战