贵州增加贵安新区后,项目展示需要增加此区域,网上找了一下,主要用echarts 展示离线地图,通过geojson加载贵州地图,然后切割安顺靠近贵阳的一部分区域展示,效果如下:
由于懒,所以就直接划了直线切割,如果要好看,就多划一些锯齿状的边就行。
怎么切割,怎么划,大概说一下吧,每个地市的数据,就是一堆点连起来的线,我们只需要新建一个贵安新区,然后给他赋予这些点就行,那么有个问题,与贵安接壤的几个地方怎么弄,很明显,这些点其他地市共有的,根据地图,我们要切割安顺的,就需要找到安顺偏向贵阳的一部分线,剪切出来给贵安就行,数据如下:
增加贵安,然后测试单个点在哪里,geosion的数据是顺时针的,多修改一下点,看效果,就知道点在哪了,或者用地图看经纬度
最后增加如下:
{ "type": "Feature", "properties": { "id": "5204", "name": "贵安", "cp": [106.3037, 26.3782], "childNum": 6 }, "geometry": { "type": "Polygon", "coordinates": [ [ [105.9741, 26.4386], [106.0181, 26.4551], [106.04, 26.4661], [106.051, 26.4606], [106.062, 26.4606], [106.1279, 26.4935], [106.1389, 26.5869], [106.1609, 26.5979], [106.1499, 26.6254], [106.1719, 26.6144], [106.1719, 26.5924], [106.1829, 26.5869], [106.1829, 26.5704], [106.1829, 26.5485], [106.2048, 26.5485], [106.1938, 26.5375], [106.2268, 26.5375], [106.2708, 26.554], [106.2927, 26.543], [106.2927, 26.5375], [106.3147, 26.543], [106.3257, 26.5155], [106.3147, 26.488], [106.3477, 26.488], [106.3477, 26.4771], [106.3257, 26.4551], [106.3696, 26.4441], [106.3806, 26.4166], [106.3806, 26.4056], [106.3916, 26.4001], [106.3916, 26.4111], [106.4026, 26.4386], [106.4136, 26.4331], [106.4136, 26.4551], [106.4465, 26.4661], [106.4575, 26.4551], [106.4465, 26.4441], [106.4465, 26.4221], [106.4575, 26.4276], [106.4795, 26.3947], [106.5015, 26.3782], [106.5454, 26.3782], [106.5674, 26.3727], [106.5564, 26.3287], [106.5344, 26.3123], [106.5234, 26.3177], [106.5234, 26.3068], [106.4795, 26.2628], [106.3916, 26.2793], [106.3916, 26.2848], [106.3586, 26.2738], [106.3586, 26.2518], [106.3477, 26.2518], [106.3477, 26.2354], [106.3367, 26.2244], [106.3037, 26.2299], [106.3037, 26.2518], [106.2708, 26.2408], [106.2598, 26.2408], [106.2488, 26.2299], [106.2378, 26.2244] ] ] } }
]
同样,你可以自定义地图,在 http://geojson.io 中绘制,将geosion数据拷贝出来就行!
源码下载:https://download.csdn.net/download/langchaojin/12504714