腾讯云图，让数听说话

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

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

1、腾讯云图 数据之美

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

这是星云图，他表示的是QQ同时在线人数，看到这个图你们脑壳里面想到什么？QQ，蓝钻、绿钻、太阳、月亮、上学的时候跟同窗聊天，认识默认网友，你会是这众多闪亮星星中的哪个呢，进一步分析能够看到沿海地区相对闪亮，结合现实状况，沿海地区设备网络相对发达，年轻化程度高，用户活跃等等。这就是数据可视化的魅力，给特定角色在特定场景讲述特定的故事。数据可视化的目的是让数听说话，让复杂抽象的数据以视觉的形式更准确快速的传达

腾讯云图正是一站式数据可视化平台，支持多种数据源，覆盖多个领域模板，拖拽式自由布局，零门槛快速打造专业大屏。说人话，就是说即便我不是专业工程师，也可使用腾讯云图，把一堆抽象枯燥无味的数据经过屌炸天的方式展现出来。

腾讯云图已经接入的客户案例包括：永辉超级物种，艺龙网全国IDC网络出口流量监控，格灵深瞳人脸特征大数据分析等。

永辉超级物种深圳创投店的大屏，是两块竖的大屏，呈现商圈客流热力，分时客流，门店最受欢迎饮品，最受欢迎水果单品等。某日统计到周边商圈客流量超过30万人，最受欢迎的饮品是农夫山泉和可口可乐，最爱的水果是火焰红葡萄。

门店能够直观的观察到周围客流量，以及购物意向，指导门店备货等。

顾客进店也能够当即看到最受欢迎商品，购买到本身满意的东西。

同时能够进一步根据周边环境，顾客消费状况，分析用户画像，深挖更多有价值的数据。

腾讯云图把以上专业的有价值的内容模板化，提供出智慧零售行业模板，其余相似场景的用户能够直接使用该模板，快速搭建本身的可视化大屏。

腾讯云图不只在智慧零售领域，在其余多个领域，也提供了许多行业模板，好比监控领域、政府工做等等。

用户也能够根据模板本身根据特定场景定制本身的大屏，腾讯云图提供丰富的组件，有表示对比关系的柱状图、条形图、折线图等，表示构成的饼图、面积图等，表示分布的散点图、直方图等，还有跟地理位置有关的多种地图。这些组件腾讯云图大部分自主研发，也接入echarts等第三方开源组件。

大屏设计页面，主要分为工具栏、图层、画布、配置面板（属性、数据）。工具栏、图层、配置面板能够自由收放，让画布区域更大化，让用户能更精确的拖动组件进行沉浸式操做。

跟《三体》里面描述将来世界一模一样。它这样描述：这个世界处处都是简洁空荡的，几乎见不到任何设施，只有在须要时，设施才会出现，并且是在任何须要的位置出现。世界在被技术复杂化后，正在从新变得简洁起来，技术被深深地隐藏在现实的后面。

2、腾讯云图 方案设计

如此酷炫，能让数听说话的腾讯云图具体怎么实现的呢？腾讯云图的主要模块包括：组件库、大屏设计、属性管理、数据管理。 组件库包括基础组件\地图组件\图表组件\装饰组件\文本组件\媒体组件\小部件等，每一个组件都有本身的属性定义，经过bundle-loader异步加载。 大屏设计包括工具栏、画布、图层、属性、数据等。 属性管理包括基础组件（好比文本输入框、数字输入框、开关按钮等），复合组件（好比标题组件、位置组件等）、数据映射配置。

数据源包括：静态数据、csv文件、API、腾讯云/公网数据库、腾讯云监控。

具体实现过程：画布中一个组件面积图，它由数据、代码、属性组成，经过控制面板调整任何属性或者数据，均可以改变该面积图。使用react redux经典三部曲action，store，reducer实现。当用户改变属性或者数据，会发起 action ，store 会调用 dispatch 方法向某个特定的 reducer 传递该 action，reducer 收到 action 以后执行对应的更新逻辑而后返回一个新的 state，state 的更新最终会传递到根reducer处，返回一个全新的完整的 state，而后传递给组件进行更新。

3、腾讯云图 组件实战

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

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

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

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

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

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

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

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