可视化大屏 项目中经常会遇到需要渲染echarts地图的情况,为了方便不同城市快速实现效果,将不同城市的echarts地图效果整理出来,供大家参考,今天为大家整理的是上饶市玉山县echarts地图和threejs地图效果实例。地图基于geoJson数据绘制。
echarts上饶市玉山县geoJson地图地图排行榜效果
echarts地图根据数据渲染不同颜色的地图,并根据数据大小显示前10名的排序效果,属于地图map类型和柱状图bar类型混合效果
echarts上饶市玉山县geoJson地图添加柱状图
echarts地图渲染时,为了让地图上的数据有一个对比的效果,会在地图上标注柱状图,以便于更直观的看出各个区域的数值.
echarts上饶市玉山县geoJson地图点击跳转到指定页面
为图标添加点击事件,点击图标,跳转到指定页面
threejs上饶市玉山县geoJson地图3d地图添加金色效果
通过threejs绘制3d地图使用outlinePass实现金色描边效果,并通过edgeStrength增加强度,让描边更清晰,如果对threejs感兴趣,可以观看threejs视频课程 WebGL前端3D可视化教程
threejs上饶市玉山县geoJson地图3d地图自定义贴图加CSS2D标签
通过threejs绘制3d地图并添加CSS2D标签和自定义贴图
threejs上饶市玉山县geoJson地图3d地图鼠标移入显示标签并高亮
通过threejs绘制的3d地图鼠标移入显示标签并高亮
上饶市玉山县 下辖有 南山乡,双明镇,紫湖镇,四股桥乡,下塘乡,下镇镇,临湖镇,仙岩镇,岩瑞镇,必姆镇,枫林街道,三清乡,六都乡,冰溪镇,怀玉乡,文成镇,樟村镇,横街镇
上饶市玉山县下辖区域坐标
{"南山乡":[118.11143199330259,28.78640406954286],"双明镇":[118.26571117470982,28.85033262290379],"紫湖镇":[118.16488890052409,28.89307832220978],"四股桥乡":[118.25179162499859,28.75327571792343],"下塘乡":[118.08106958205056,28.63560294558218],"下镇镇":[118.37110219183732,28.65594206219291],"临湖镇":[117.98159747053592,28.68987702048389],"仙岩镇":[118.37500856713055,28.55412459392801],"岩瑞镇":[118.33040407380153,28.73860910112285],"必姆镇":[118.06904784693538,28.69817565207786],"枫林街道":[118.03786588191636,28.9104380148559],"三清乡":[118.09275678851802,28.92811593190135],"六都乡":[118.3148551336816,28.60510255465766],"冰溪镇":[118.24056598884304,28.6740386563456],"怀玉乡":[117.94626413418075,28.84171679001252],"文成镇":[118.19632976667555,28.63923273132728],"樟村镇":[117.93868610280455,28.785509751522],"横街镇":[118.1413858340915,28.71523639752224]}
上饶市玉山县行政划分代码
[{"name":"南山乡","code":"361123200000"},{"name":"双明镇","code":"361123108000"},{"name":"紫湖镇","code":"361123109000"},{"name":"四股桥乡","code":"361123203000"},{"name":"下塘乡","code":"361123202000"},{"name":"下镇镇","code":"361123105000"},{"name":"临湖镇","code":"361123101000"},{"name":"仙岩镇","code":"361123110000"},{"name":"岩瑞镇","code":"361123107000"},{"name":"必姆镇","code":"361123102000"},{"name":"枫林街道","code":""},{"name":"三清乡","code":"361123290000"},{"name":"六都乡","code":"361123204000"},{"name":"冰溪镇","code":""},{"name":"怀玉乡","code":"361123201000"},{"name":"文成镇","code":""},{"name":"樟村镇","code":"361123111000"},{"name":"横街镇","code":"361123103000"}]
说明
1、根据《地图审核管理规定》、《互联网地图服务专业标准》等法规,本地图不作为境界线勘界等用处。使用中请查阅《中华人民共和国地图编制出版管理条例》、各地地图编制出版管理办法等地图规定按程序应用。
2、本数据是目前市面上较齐全、精度较高的数据,属性齐全,各大高校科研均在用此数据。
3、本数据仅用于echarts threejs地图效果展示。
4、当前除了包含有关键地区的geoJson地图信息外还包含有28个echarts地图效果,以及13个threejs地图实例效果,限于篇幅不一一展示,可以通过更多echarts和threejs地图效果实例查看