地图代码如何插入(地图位置代码)

　　原创申明：金融监管研究院副院长刘诚燃，如需转载，请加作者微信：18956351980

前不久，笔者写了一篇【城商行变迁史】，其中有一段是关于城商行跨省经营的部分，如果用文字去描述，可能要描述好得几千字，于是就想是不是可以做份可视化城商行研究报告。

于是，我就找到了DataV这款神器。用一张动图画出了城商行走出去路径图。

大家应该记得每年双十一，天猫都会在剁手狂欢节中直播战绩。除了可怕的数字之外，印象最深的应该是数据可视化大屏 ：

（2016双十一大屏）

所谓大屏，顾名思义就是一个——

很大的屏 !!!

一般应用在交易大厅，展览中心，管控中心，老板办公室等等场景，把一些关键数据集中展示在一块巨大的LED屏幕上，其实就是巨大化的Dashboard，看起来很酷。

也许你觉得这些酷炫的可视化效果遥不可及，但如果我告诉你，只要有数据，你也能够做出来酷炫的大屏。

DataV是阿里云出品的拖拽式可视化工具，专精于业务数据与地理信息融合的大数据可视化。

即便你不是专业工程师，也可以把一堆枯燥无味的数据通过酷炫的方式展示出来，只要你有数据源。

当然，如果想让数据动起来，你得有一个阿里云账号。

如果没有，先注册并登录到阿里云：www.aliyun.com，在【产品】标签栏下就能找到 DataV~

如果你已经有阿里云账号，直接登录datav.aliyun.com即可。

这个世界免费的东西越来越少，即便你看我这篇文章，虽然是免费的教程，但我也会插入培训广告，即便你不去点。

好在基础版价格不高，5元可以使用1个月，51元可以使用1年，但基础版功能有限，要想使用更多功能，你得以5100元价格购买企业版。

　　马云赚起钱从来不含糊。

“忍痛”用支付宝支付后，页面就会自动跳转到 DataV 的后台，点击【新建可视化】试试：

你会发现DataV 针对不同的使用场景，提供了很多酷炫的数据模板，其中就包括我们曾经在新闻中看到的天猫双十一的数据大屏：

选中自己喜欢的模板后，点击创建，马上就能用！（你也可以新建一个空白画布，自由创作）

毕竟，模板只是把做好的大屏展示给大家，但所展示的只是部分控件，还有另一吨牛逼控件隐藏在左上角的工具栏：

此外，DataV还有哦丰富的图表控件供大家使用。

只要你能想象到的图表样式，这里都能找到。

我们选择了一个多维度饼图做个实验，你会发现曾经使用的excel、PPT做出来的图表真是丑哭了。

那么，这张图是怎么做出来的了？

【方法一】：直接修改

大家应该很容易发现，此图表其实受编辑器中的两个字段控制：X和Y，分别匹配机构和 余额。

手动修改下数据，你会发现，圆圈的占比大小发生了变化。

不要害怕，直接手动修改试试。如图，我直接修改了 text 和 value 的值后，图表就会自动发生变化。

如果只有5行数据，直接在里面修改代码即可，但如果是10行数据，100行数据了？

不要怕，有解决方法。

【方法二】：自己上传数据

其实，我们可以在【数据源类型】中上传自己的数据源：

基础版支持CSV文件，API和数据库三种类型的数据源。不会写API，不会建数据库没关系，我们可以用Excel啊 —— 因为Excel文件可以另存为CSV格式。

【第1步】用excel把相关数据录入 ，比如我们做一个城商行2016年末资产占比图，首先在excel中录入数据。

注意第一列，对应的是X；第二列，对应的是Y，因此第一行需要建立表头：“机构”和“余额”。

【第2步】把这组数据另存为CSV格式

修改完表头后，把 Excel 文件直接另存为 CSV 格式。

【第3步】把CSV文件上传到DataV中。

在数据源类型中选中【CSV文件】，然后点击【新建】，上传完后记得选择你的数据，Name名称即重要也不重要，关键你要记得。

在选择配置里，找到文件，往下拖，最新建的文件在最后。把X，Y映射分别填上“机构”和“余额”，如果没匹配成功，肯定是写错了，再回去看看CSV的表头。

如果觉得的不是特别满意，哪里字小了，可以在样式里调各种格式。

掌握了这两种修改数据的方法后，

我们就可以玩转各种图表啦！

从此，我告别用office作图。

城商行拨备覆盖率散点图

城商行网点和种类雷达图

城商行资产规模占比图

城商行资产规模翻牌器

甚至，这些星罗密布的网点数量和飞线图

修改数据的原理也一模一样！

但这么多数据，怎么来的？

（这就是无比的寂寞与细心了）

首先，我们得去找公开数据，好在现在提供公开数据的的地方非常多，银监会网站就有很多公开披露信息，但你得知道这些数据隐藏在哪。

金融许可证查询的响应速度还是比较快的，最重要的是支持下载。

134家城商行逐一下载，接下来就是数据整理工作了。

光整理这些数据，就花了小助手2天时间，因为有的城商行是省局发的许可证，简政放权后，有的是地市分局发的许可证，你还要看看地址，才能准确知道，每一家网点在哪个城市。

这还不是机器能读取数据，我们要给每个城市加上坐标。

好在DataV教程中有各城市坐标。用vlookup函数将每个城市经纬度匹配上。保存为CSV格式。

接下来，下面就可以做区域分布图了。

【第1步】插入一个地图

在 DataV 的地图控件中随便插入一个地图：

插入后，画布上会自动生成一个酷炫的地图，由于自带示例数据，地图上布满了飞线轨迹和呼吸气泡图。

地图分为三层，底图层不用管，我们首先选择呼吸气泡层，然后导入数据。

匹配成功后，就会有繁心点点了，通过样式的调整，可以让数据大的点更大更亮，一切以好看为准。

【第2步】做城商行走出去飞线图

从数据编辑器中可以看出，飞线图的匹配字段是from 和to，就是起点和终点的意思。

这意味着，我们把案例中的表头分别改成 from 和 to，就能比配了，但我们要把经纬度做一个合并处理。每一条飞线需要用一行来表示。

【第3步】把数据上传到 DataV

操作步骤前面有讲，就不唠叨了~

上传成功后，刷新一下页面，我们的物流地图就出来了！

更多地图的脑洞和玩法，就留给大家自己去试啦~~

当你熟悉了每个图表控件后，就可以尝试组合不同的图表形式，创作自己的可视化作品了。

所有图表配置完成后，点击【发布】就能生成一个链接，别人点击这个链接，就可以看到你创作的可视化作品了。

点击阅读原文，或复制下面链接，用Google chrome浏览器打开，按F11,就能看到绚丽的大屏。

https://datav.aliyun.com/share/8800f4fec8f9cc224ed463d333e187ae

广告再来一遍：

其实一旦你摸熟了产品特色，我们会发现数据整理是最花时间的，大家点击阅读原文后，看看发布后大屏效果。