基于 WebGIS 的中国身份证首位数字与六大区域可视化展示

有了这些对应信息后，可使用 WebGIS 进行相关的空间信息展示。

二、数字与空间展示可视化

本节介绍如何基于 Leaflet 和 SpringBoot 进行数字与空间信息的展示可视化。

1、地域及图例的前端定义

为了直观地在地图上展示 6 大地域，需要定义地域的编码、名字以及渲染颜色值，在 JavaScript 代码中进行声明：

//区域定义及颜色配置
var sixregionsList = [
    {index:"1",name:"华北",color:"#df2222"},
    {index:"2",name:"东北",color:"#e39014"},
    {index:"3",name:"华东",color:"#14e3e3"},
    {index:"4",name:"中南",color:"#17e314ed"},
    {index:"5",name:"西南",color:"#e3147d"},
    {index:"6",name:"西北",color:"#e3dd14"}
];

同时为了在展示地图时可以直观地对区域信息进行标识，动态根据区域信息绘制相应的图例，关键代码如下所示：

var legendData = new Array();
for(var i=0;i<sixregionsList.length;i++){
    var _tempData = sixregionsList[i];
    legendData.push({
        label: "\xa0\xa0"+_tempData.name + _tempData.index,
        type: "rectangle",
        radius: 12,
        color: _tempData.color,
        fillColor: _tempData.color,
        fillOpacity: 0.8,
        weight: 2
    });
}
initLegend(legendData);
});

2、省份与区域信息展示

如果需要在地图上展示省份与区域的信息，首先需要对返回的省份信息进行截取。在前端展示的时候，需要将省份编码信息的首位数组截取后结合区域信息进行识别判断。处理方法如下：

for(var i=0;i< result.data.length;i++){
    var areaData = result.data[i];
    var regionConfig = areaData.provinceCode == "710000" ? {index:"7",name:areaData.provinceName,color:getRandomColor()} : getSixregionColor(areaData.provinceCode);
    var color = regionConfig.color;
    var regionName = regionConfig.name;
    var areaLayer = L.geoJSON(JSON.parse(areaData.geomJson),{style: {color:color,fillColor:color,weight:3,"opacity":0.65, fillOpacity: 0.65 }}).addTo(collisionLayer);
    var myIcon = L.divIcon({
        iconSize: null,
        className: '',
        popupAnchor:[5,5],
        shadowAnchor:[5,5],
        html: buildShowInfo(i,color,areaData,regionName)
    });
    showLayerGroup.addLayer(areaLayer);
    //中心点位
    L.marker([areaData.cityLat,areaData.cityLon ], { icon: myIcon}).addTo(collisionLayer);
    showLayerGroup.addLayer(collisionLayer);
}

通过编码获取区域配置信息的代码如下：

//根据区域获取颜色，与标注保持一致
function getSixregionColor(provinceCode){
    var prefix = provinceCode.substring(0,1);
    for(var i=0;i<sixregionsList.length;i++){
        var _tempData = sixregionsList[i];
        if(prefix == _tempData.index){
            return _tempData;
            break;
        }else{
            continue;
        }
    }
}

通过以上的代码后，可以确保生成的图例的样式与地图绘制的颜色等保持一致。

三、成果展示

本节展示我国的身份证首位数字与传统六大区域的关联关系。

1、华北地区

华北区域的省份首位数字以 1 开头，从 11-15 一共五个省份。从区域来说，华北区域中，内蒙古自治区的空间范围是最大的一个区域。其它的如北京市和天津市等，均是直辖市。

2、东北地区

东北地区的首位数字以 2 开头，从 21-23 一共三个省份。从区域来说，东北区域中，黑龙江省的空间范围是最大的一个区域。

3、华东地区

华东地区的首位数字以 3 开头，从 31-37 一共七个省份。从区域来说，华东的区域中，经济都比较强，而且沿海的省份很多，经济趋势也很强。江苏省、山东省、浙江省、上海市等都是经济发达地区。

4、中南地区

中南地区的首位数字以 4 开头，从 41-46 一共六个省份。从区域来说，中南的区域中，经济分布不太一致，比如沿海的广东省，经济就很强，而河南则相对弱一些。

5、西南地区

西南地区的首位数字以 5 开头，从 50-54 一共五个省份。与别的省份不一样，重庆市的编码是 50 开始，这在全国比较特殊。从区域来说，西南的区域中，经济基本差不多，行政范围面积最大的肯定是西藏自治区。

6、西北地区

西北地区的首位数字以 6 开头，从 61-65 一共五个省份。从区域来说，西北地区中，经济整体相对靠后，陕西省的经济应该比较强的，其它省就相对会弱一些，行政范围面积最大的肯定是新疆自治区。