可视化大屏 项目中经常需要渲染echarts地图,为了不同城市快速实现,将不同城市的echarts地图效果整理出来,今天为大家整理连云港市赣榆区echarts地图和threejs地图效果实例。地图基于geoJson数据绘制。
echarts连云港市赣榆区geoJson地图 visualMap控制地图颜色
echarts地图使用visualMap通过一组颜色及一组数据来实现地图不同区域根据不同数据进行颜色变化
echarts连云港市赣榆区geoJson地图添加柱状图
echarts地图渲染时,为了让地图上的数据有一个对比的效果,会在地图上标注柱状图,以便于更直观的看出各个区域的数值.
echarts连云港市赣榆区geoJson地图定义颜色
echarts地图通过visualMap来事先设置好数据区间,根据区间来来显示地图的颜色,这里的visualMap数据是随机生成的,可以通过实例代码根据自己的需要配置颜色和数据区间.
threejs连云港市赣榆区geoJson地图3d地图添加金色效果
通过threejs绘制3d地图使用outlinePass实现金色描边效果,并通过edgeStrength增加强度,让描边更清晰,如果想系统的学习threejs的话,可以观看threejs视频教程 Three.js前端3D可视化
threejs连云港市赣榆区geoJson地图3d地图添加旋转棱锥
通过threejs绘制3d地图并在指定经纬度上添加带波纹效果不停旋转的棱锥效果实例
连云港市赣榆区 下辖有 石桥镇,沙河镇,班庄镇,赣马镇,金山镇,赣榆经济开发区,城西镇,塔山镇,厉庄镇,海头镇,城头镇,墩尚镇,宋庄镇,柘汪镇,青口镇,黑林镇,沙河子园艺场,赣榆海洋经济开发区
连云港市赣榆区下辖区域坐标
{"石桥镇":[119.16551526720495,35.02702206207113],"沙河镇":[118.96497491704685,34.75637108731334],"班庄镇":[118.83460499105054,34.87048910232499],"赣马镇":[119.09235058171369,34.90441833549332],"金山镇":[119.0662323310174,35.00336099571746],"赣榆经济开发区":[119.11910327405658,34.81045511860293],"城西镇":[119.02030032254817,34.83574290234505],"塔山镇":[118.9704496914016,34.93036028603363],"厉庄镇":[119.0007828372438,34.99931728377936],"海头镇":[119.15431818573819,34.9436082679766],"城头镇":[118.95072567390383,34.8431347076501],"墩尚镇":[119.09721755281683,34.72066148893929],"宋庄镇":[119.14075933325284,34.78195857117618],"柘汪镇":[119.21290595128616,35.08611149769123],"青口镇":[119.15816653561103,34.82674583966453],"黑林镇":[118.92607933725029,35.00294379869524],"沙河子园艺场":[119.03904851286866,34.87435708187992],"赣榆海洋经济开发区":[119.07173887105952,34.79215381606134]}
连云港市赣榆区行政划分代码
[{"name":"石桥镇","code":"320707102000"},{"name":"沙河镇","code":"320707115000"},{"name":"班庄镇","code":"320707109000"},{"name":"赣马镇","code":"320707108000"},{"name":"金山镇","code":"320707103000"},{"name":"赣榆经济开发区","code":"320707403000"},{"name":"城西镇","code":"320707112000"},{"name":"塔山镇","code":"320707107000"},{"name":"厉庄镇","code":"320707105000"},{"name":"海头镇","code":"320707106000"},{"name":"城头镇","code":"320707110000"},{"name":"墩尚镇","code":"320707116000"},{"name":"宋庄镇","code":"320707114000"},{"name":"柘汪镇","code":"320707101000"},{"name":"青口镇","code":"320707100000"},{"name":"黑林镇","code":"320707104000"},{"name":"沙河子园艺场","code":"320707400000"},{"name":"赣榆海洋经济开发区","code":"320707402000"}]
说明
1、根据《地图审核管理规定》、《互联网地图服务专业标准》等法规,本地图不作为境界线勘界等用处。使用中请查阅《中华人民共和国地图编制出版管理条例》、各地地图编制出版管理办法等地图规定按程序应用。
2、本数据是目前市面上较齐全、精度较高的数据,属性齐全,各大高校科研均在用此数据。
3、本数据仅用于echarts threejs地图效果展示。
4、当前除了包含有关键地区的geoJson地图信息外还包含有28个echarts地图效果,以及13个threejs地图实例效果,限于篇幅不一一展示,可以通过更多echarts和threejs地图效果实例查看