腾讯云图，让数据说话

欢迎大家前往腾讯云+社区，获取更多腾讯海量技术实践干货哦~

本文由腾讯云数据库 TencentDB发表于云+社区专栏

一、腾讯云图 数据之美

了解腾讯云图之前，我们先来看看数据可视化？

这是星云图，他表示的是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，然后传递给组件进行更新。

三、腾讯云图 组件实战

一个生活中随处可见的进度条的具体实现过程。组件实现过程一般包括需求分析、属性分析、模型建立、开发实现、测试交付。一个简单的进度条的属性包括进度条样式（边框样式、填充样式、开始颜色、结束颜色、密度），文本样式（字体字号、文本颜色、间距、精度等）

组件建模：进度条由气泡和进度条组成，气泡由一个边框和文本组成，进度条则由外框、遮罩层、剪切层、渐变层组成。 接下来是实现的具体代码

组件实现完成，如何接入腾讯云图。每个组件都需要定义自己的属性。包括组件名称、版本、属性等。平台根据这个属性会生成对应的控制面板，以及默认属性值。这样组件就可以接入腾讯云图，进行自由的拖拽布局。

腾讯云图，一站式数据可视化展示平台，零门槛打造出专业大屏数据展示！

问答
数据可视化在生活的哪里可以应用？
相关阅读
遇见大数据可视化 ： 【云图】让数据可见
Redis勒索事件爆发，如何避免从删库到跑路?
Redis云端架构深入浅出
【每日课程推荐】机器学习实战！快速入门在线广告业务及CTR相应知识

此文已由作者授权腾讯云+社区发布，更多原文请点击

搜索关注公众号「云加社区」，第一时间获取技术干货，关注后回复1024 送你一份技术课程大礼包！

海量技术实践经验，尽在云加社区！