可视化篇：R可视化--迁徙/通勤图

写在最前
下面是《可视化篇：效果图》中第1、4、5、6、7张的实现说明

使用工具为R语言

工作后经常要做一些比较贴合用户级别的可视化，R的ggplot2在做一些学术或者理论研究上的可视化时，效果是非常好，基本上能想到的图ggplot都能画出（不要纠结双坐标和3D）
在作静态图时，ggplot2+AI可以展现出印刷级别的效果，具体可以查看：http://theinformationcapital.com/ 这里要感谢数据人网一位朋友，是他介绍的这本书。
在作动态图或者可交互的图表时，R+js是一个高阶的展示路径，下文展示的图表，都是R调用echart的API，用js画的，当然在使用的过程中我修改了部分源码，因为公司展示效果的需要。
下面图表我会把制作过程以及图背后的业务背景一一说一下，代码及数据均会附上。

图1数据：http://pan.baidu.com/s/1sjX42Nr
图2数据：http://pan.baidu.com/s/1i4wNlVf
图3,4数据：http://pan.baidu.com/s/1eRfYIDs 该部分数据是用R代码模拟，复制可运行。

开始前先安装一下REmap包，由于该包没有挂靠在cran上，所以要从GitHub 上下载：

library(devtools)
install_github("Lchiffon/REmap")

devtools包可按照正常方法下载，如果提示没有安装digest包，则再下载digest包即可。

一、2016年的广州春运

下图展示的是2016年2月6日广州人口迁往省外的情况，颜色越深表示迁往该省的人数越多，图中的线表示top10省份，即迁出的目标省份中人数最多的10个，广西湖南前二，还有一些统计数据的展示我没放上来，主要是那个直接在最终展示里画即可，这边负责的是迁徙的效果图。

实现代码：
这部分主要是设置文件可以保存于其他路径，方便之后的传输使用：

library(REmap)
options(remap.js.web = T)   
#该函数在echart3.0更新时有bug，后来联系作者改了，如果是很久前下的REmap包，记得重新卸载该包后重新下载。

读取数据，上面提供了数据的下载地址

library(xlsx)
destin <- read.xlsx(file="C:/Users/Administrator/Desktop/destination.xlsx",1,encoding="UTF-8",header=F)
head(destin)

下面是一些数据的处理：
1.markLine_data有三列，第一列是出发地，第二列是目的地，第三列可有可无，建议设置成颜色。
2.此外该三列均为字符型，对应下文geoData数据框中的第三列，而geoData前两列分别lon(经度),lat(维度)，第三列为字符型的地点名（可自己命名）。
3.格式不能乱。

markLine_data <- data.frame(origin=rep("广州"，10),
                            destination=destin[1:10,1],
                            color=rep("#fff",10)
                            )
markPoint_data <- markLine_data[markLine_data!=""]
markPoint_data1 <- markPoint_data[which(markPoint_data!="广州")]    #作图时除去广州这个点
remapC(gz_to_other3,
       title="2016年2月6日 广州人口迁出图",
       subtitle="前10目标省份",
       theme=get_theme(                                         
           #get_theme是调整背景颜色
           theme="Dark",
           lineColor = "#FFFFFF",
           titleColor = "#fff",
           borderColor = "#FFFFFF", 
           regionColor = "#000000",
           pointShow = F, 
           pointColor = "gold"
           ),
       color=c("#CD0000","#FFEC8B"),   #这里是颜色渐变方案

#这里的linedata,和下文的pointdata都是图中点线数据，线的主要是origin和destination两列，第三列可以设置颜色，
#个人建议在数据里设好好颜色，不要到参数里面设置，否则容易报错。

       markLineData=markLine_data,    #两列，第一origin，第二destination，第三可设置颜色

#这里的linetheme,和下文的pointtheme都是图中点线样式调整，参数不多，查看帮助文档可以明白            
       markLineTheme=markLineControl(
           color="white",  #调整颜色
           lineWidth=2,    #调整线条宽度
           lineType="dashed"  #调整线条形状，dashed为虚线
           ),
       markPointData=markPoint_data1,   #三列，第一列经度，第二维度，第三点名，第四可设置颜色
       markPointTheme=markPointControl(
           symbolSize=13,   #调整点大小
           effect=T,              #调整点是否显示动态效果
           effectType="scale",    #调整点的形状
           color="white"
           )
       )

二、每早拥堵的上班线路

下图是某日早晨广州天河城周边的交通导图，该图主要是为了展示上班时期天河城周边交通效果，进一步的做一些人群标签画像等以及展示公司位置系统的交通监控能力等。

实现代码：
该图用的是REmap包里面的remapB函数，该函数的背景参数画不出下图效果，画出的是最后一幅图的背景，由于展示需要，只能手动修改该包源码，下面会贴出详细过程。

##中心点，天河城
thc_center <- c(113.328755,23.137588)

##read the data
lonlat_thc <- read.csv(file="C:/Users/Administrator/Desktop/lonlat_thc.csv",header=T)                                                            #已模拟数据，可下载，下面为对模拟数据做一些合并处理

#前三列为源点及经纬度，后三列为目标点及经纬度
head(lonlat_thc)
gdata1 <- lonlat_thc[,1:3]
names(gdata1) <- c("lon","lat","city")
gdata2 <- lonlat_thc[,5:7]
names(gdata2) <- c("lon","lat","city")
gdata <- rbind(gdata1,gdata2)
head(gdata)

markLine_data <- data.frame(origin=gdata1[,3],
                             destination=gdata2[,3],
                             color=rep("gold",length(gdata1[,3]))
                             )
markLine_Control <- markLineControl(symbolSize=c(0,0.1),
                                    smoothness=0,
                                    effect=T,
                                    lineWidth=3,
                                    lineType="dashed"
                                    )
remapB(center=thc_center,
       zoom=17,
       color="Blue",   #调整背景，此部分修改了源码，详见下文
       markLineData=markLine_data,
       markLineTheme=markLine_Control,
       geoData=gdata    #三列，第一列为经纬，第二维度，第三对应的点名
       )

对于remapB中的color参数，源码是在map.setMapStyle({styleJson: […]})函数中调用的，该段源码是一段json格式的数据，对应为百度地图的背景及标志等。
由于公司展示需要，我重新调整了整体配色方案，隐藏了各交通干道的标志和一些街道小建筑标志，留下一些标志性的建筑，使得可以比较清晰看清楚用户来源去向。调整的代码如下：

styleJson: [
          {
                    ‘featureType‘: ‘land‘,     #调整土地颜色
                    ‘elementType‘: ‘geometry‘,
                    ‘stylers‘: {
                              ‘color‘: ‘#081734‘
                    }
          },
          {
                    ‘featureType‘: ‘building‘,   
                    ‘elementType‘: ‘geometry‘,
                    ‘stylers‘: {
                              ‘color‘: ‘#04406F‘
                    }
          },
         {
                    ‘featureType‘: ‘building‘,   
                    ‘elementType‘: ‘labels‘,
                    ‘stylers‘: {
                    ‘visibility‘: ‘off‘
                    }
          },
          {
                    ‘featureType‘: ‘highway‘,     
                    ‘elementType‘: ‘geometry‘,
                    ‘stylers‘: {
                    ‘color‘: ‘#015B99‘
                    }
          },
          {
                    ‘featureType‘: ‘highway‘,    
                    ‘elementType‘: ‘labels‘,
                    ‘stylers‘: {
                    ‘visibility‘: ‘off‘
                    }
          },
          {
                    ‘featureType‘: ‘arterial‘,   
                    ‘elementType‘: ‘geometry‘,
                    ‘stylers‘: {
                    ‘color‘:‘#003051‘
                    }
          },
          {
                    ‘featureType‘: ‘arterial‘,
                    ‘elementType‘: ‘labels‘,
                    ‘stylers‘: {
                    ‘visibility‘: ‘off‘
                    }
          },
          {
                    ‘featureType‘: ‘green‘,
                    ‘elementType‘: ‘geometry‘,
                    ‘stylers‘: {
                    ‘visibility‘: ‘off‘
                    }
          },
          {
                    ‘featureType‘: ‘water‘,
                    ‘elementType‘: ‘geometry‘,
                    ‘stylers‘: {
                              ‘color‘: ‘#044161‘
                    }
          },
          {
                    ‘featureType‘: ‘subway‘,    
                    ‘elementType‘: ‘geometry.stroke‘,
                    ‘stylers‘: {
                    ‘color‘: ‘#003051‘
                    }
          },
          {
                    ‘featureType‘: ‘subway‘,
                    ‘elementType‘: ‘labels‘,
                    ‘stylers‘: {
                    ‘visibility‘: ‘off‘
                    }
          },
          {
                    ‘featureType‘: ‘railway‘,
                    ‘elementType‘: ‘geometry‘,
                    ‘stylers‘: {
                    ‘visibility‘: ‘off‘
                    }
          },
          {
                    ‘featureType‘: ‘railway‘,
                    ‘elementType‘: ‘labels‘,
                    ‘stylers‘: {
                    ‘visibility‘: ‘off‘
                    }
          },
          {
                    ‘featureType‘: ‘all‘,     
                    ‘elementType‘: ‘labels.text.stroke‘,
                    ‘stylers‘: {
                              ‘color‘: ‘#313131‘
                    }
          },
          {
                    ‘featureType‘: ‘all‘,     
                    ‘elementType‘: ‘labels.text.fill‘,
                    ‘stylers‘: {
                              ‘color‘: ‘#FFFFFF‘
                    }
          },
          {
                    ‘featureType‘: ‘manmade‘,   
                    ‘elementType‘: ‘geometry‘,
                    ‘stylers‘: {
                    ‘visibility‘: ‘off‘
                    }
          },
          {
                    ‘featureType‘: ‘manmade‘,
                    ‘elementType‘: ‘labels‘,
                    ‘stylers‘: {
                    ‘visibility‘: ‘off‘
                    }
          },
          {
                    ‘featureType‘: ‘local‘,
                    ‘elementType‘: ‘geometry‘,
                    ‘stylers‘: {
                    ‘visibility‘: ‘off‘
                    }
          },
          {
                    ‘featureType‘: ‘local‘,
                    ‘elementType‘: ‘labels‘,
                    ‘stylers‘: {
                    ‘visibility‘: ‘off‘
                    }
          },
          {
                    ‘featureType‘: ‘subway‘,
                    ‘elementType‘: ‘geometry‘,
                    ‘stylers‘: {
                              ‘lightness‘: -65
                    }
          },
          {
                    ‘featureType‘: ‘railway‘,
                    ‘elementType‘: ‘all‘,
                    ‘stylers‘: {
                              ‘lightness‘: -40
                    }
          },
          {
                    ‘featureType‘: ‘boundary‘,
                    ‘elementType‘: ‘geometry‘,
                    ‘stylers‘: {
                              ‘color‘: ‘#8b8787‘,
                              ‘weight‘: ‘1‘,
                              ‘lightness‘: -29
                    }
          }
    ]

！上面那段百度地图背景调整函数都比较浅显易懂，修改后记得运行markPointStr和markLineStr两个函数，remap函数也要手动运行一次。
PS：上面代码注释部分为R格式，放到网页里会出错，我删除掉了，多谢 杭州螃蟹 那个朋友的提醒。

三、愉快的购物人群多点

下图是天河城附近的购物场景图（多点），主要展示的是一个购物通勤效果，人流来源与聚焦点的情况，展示几大人流密集点，同时配合公司标签库在系统上展示人群特征情况，这可以为商铺做销售选择提供不小的帮助。

实现代码：

line_origin <- rbind(thc_df,zj_df,tgh_df,tyzx_df,wdl_df)    
line_dest <- rbind(thc_ct,zj_ct,tgh_ct,tyzx_ct,wdl_ct)
#数据下载链接在文章开头，其中数据为R代码，复制到R命令行执行即可
markLine_data <- data.frame(origin=line_origin[,3],
                            destination=line_dest[,3],
                          color=rep("grey",length(line_origin[,3])
                            )
gdata <- rbind(line_origin,line_dest)

markLine_Control <- markLineControl(symbolSize=c(0,0.1),
                                    smoothness=10,
                                    effect=T,
                                    lineWidth=1.5,
                                    lineType="dashed"
                                    )
remapB(center=thc_center,
       zoom=17,
       color="Blue",
       # markPointData=markPoint_data,
       markLineData=markLine_data,
       # markPointTheme=markPoint_Control,
       markLineTheme=markLine_Control,
       geoData=gdata
       )

四、愉快的购物人群多点

下图是单点轨迹的购物场景，和上图目的差不多，实现方法类似，主要是中心点的选择。

五、通勤效果

下图通勤效果与上面两图目的差不多，只是效果展示不同，改图是是REmap包下remapB函数，color参数设置为blue即可，注意：此处为没有修改源码下的remapB函数。