数据可视化大屏 项目中经常会遇到需要渲染echarts地图的情况，为了方便不同城市快速实现效果，将不同城市的echarts地图效果整理出来，供大家参考，今天为大家整理的是抚顺市顺城区echarts地图和threejs地图效果实例。地图基于geoJson数据绘制。
顺城区隶属于辽宁省抚顺市，是抚顺市政府所在地。位于辽宁省抚顺市北部，北毗铁岭市铁岭县、西连沈阳市沈北新区、抚顺高湾特区，东与东洲区相连，南与新抚区、望花区隔河相望。总面积348平方千米，位于东经123°46′00"～124°003′40"，北纬41°52′24"～42°02′06"之间。
echarts抚顺市顺城区geoJson地图根据经纬度显示自定义html弹窗
echarts地图我们可以通过像素坐标来将我们自定义的html弹窗定位到echarts地图指定位置,如果是固定的宽高的话,这没什么问题直接定位就可以了,如果是自适应宽高的地图我们可能没办法控制精度,我们可以使用经纬度来控制,当echarts地图渲染完成以后,我们可以通过convertToPixel将经纬度转为像素坐标,然后再渲染自定义弹窗,这样精度就比较准确了,而且也不会因为窗体宽高变化而导致弹窗出现偏移.
echarts抚顺市顺城区geoJson地图点击地图获取经纬度
echarts地图渲染后,有时候会需要点击后获取到经纬度信息,通过经纬度信息来查询一些内容,这里我们可以通过convertFromPixel来获取经纬度.
echarts抚顺市顺城区geoJson地图热力图
echarts通过heatmap实现热力图效果
threejs抚顺市顺城区geoJson地图3d地图CSS3D标签
通过threejs绘制的3d地图CSS3D标签实例，CSS3D不面向摄像机，跟随场景缩放,可以通过rotateY调整角度,通过scale调整大小 Vue3 threejs 在3d地图中绘制css3d标签标注省份,如果对threejs感兴趣，可以观看threejs视频教程 WebGL/Three.js前端高薪3D可视化
threejs抚顺市顺城区geoJson地图3d地图鼠标移入显示标签并高亮
通过threejs绘制的3d地图鼠标移入显示标签并高亮
threejs抚顺市顺城区geoJson地图3d地图红色描边闪烁警报
通过threejs绘制3d地图使用outlinePass 实现发光描边闪烁效果 以实现警报功能
抚顺市顺城区 下辖有 新华街道,葛布街道,长春街道,将军堡街道,抚顺城街道,河东街道,会元乡,前甸镇,河北乡
抚顺市顺城区下辖区域坐标
{"新华街道":[123.91802950877425,41.87946757067319],"葛布街道":[123.85673974778564,41.87923479784476],"长春街道":[123.94359068545845,41.89084214220868],"将军堡街道":[123.8748958562268,41.88404553257018],"抚顺城街道":[123.90539076839667,41.88477447373916],"河东街道":[123.92804780444341,41.88024074527964],"会元乡":[123.85919800323057,41.96335377199502],"前甸镇":[123.97919838351382,41.94258471353101],"河北乡":[]}
抚顺市顺城区行政划分代码
[{"name":"新华街道","code":"210411005000"},{"name":"葛布街道","code":"210411003000"},{"name":"长春街道","code":"210411002000"},{"name":"将军堡街道","code":"210411004000"},{"name":"抚顺城街道","code":"210411007000"},{"name":"河东街道","code":""},{"name":"会元乡","code":"210411205000"},{"name":"前甸镇","code":"210411102000"},{"name":"河北乡","code":"210411201000"}]
说明
1、根据《地图审核管理规定》、《互联网地图服务专业标准》等法规，本地图不作为境界线勘界等用处。使用中请查阅《中华人民共和国地图编制出版管理条例》、各地地图编制出版管理办法等地图规定按程序应用。
2、本数据是目前市面上较齐全、精度较高的数据，属性齐全，各大高校科研均在用此数据。
3、本数据仅用于echarts threejs地图效果展示。
