可视化大屏 项目中会有渲染地图的需要,除了百度地图以及高德地图外,也会需要echarts或者threejs效果的地图,今天为大家整理朔州市平鲁区echarts地图和threejs地图效果实例供大家参考。地图基于geoJson数据绘制。
平鲁区,隶属于 山西省 朔州市,地理坐标介于东经111′52′-112°41′,北纬39°21′-39°58′之间。地处晋西北内外长城之间,位于山西省北部边陲,与内蒙古自治区清水河、和林格尔接壤;西南与忻州市偏关、神池两县毗连;南临朔城区;东靠山阴;东北连右玉。全区南北长69.5千米,东西长67.9千米,呈三角形状,全区国土总面积2314平方千米,辖2个镇、10个乡,352个行政村。根据第七次人口普查数据,截至2020年11月1日零时,平鲁区常住人口为148212人。
echarts朔州市平鲁区geoJson地图 tooltip轮播
echarts地图实现类似tooltip轮播效果,通过effectScatter实现浮窗,并通过定时修改effectScatter的data来实现浮窗的移动.
echarts朔州市平鲁区geoJson地图tooltip自定义html
echarts tooltip演示自定义,通过toolTip的formatter方法以html+css的方式实现自己想要的样式效果,鼠标移上去就可以看到我们想要的效果了,也可以通过css自定义为自己需要的样式.
echarts朔州市平鲁区geoJson地图根据经纬度显示自定义html弹窗
echarts地图我们可以通过像素坐标来将我们自定义的html弹窗定位到echarts地图指定位置,如果是固定的宽高的话,这没什么问题直接定位就可以了,如果是自适应宽高的地图我们可能没办法控制精度,我们可以使用经纬度来控制,当echarts地图渲染完成以后,我们可以通过convertToPixel将经纬度转为像素坐标,然后再渲染自定义弹窗,这样精度就比较准确了,而且也不会因为窗体宽高变化而导致弹窗出现偏移.
threejs朔州市平鲁区geoJson地图3d地图自定义贴图加CSS2D标签
通过threejs绘制3d地图并添加CSS2D标签和自定义贴图,如果想系统的学习threejs的话,可以观看threejs教程视频 Three.js视频教程3D可视化
threejs朔州市平鲁区geoJson地图3d地图添加旋转棱锥
通过threejs绘制3d地图并在指定经纬度上添加带波纹效果不停旋转的棱锥效果实例
threejs朔州市平鲁区geoJson地图3d地图鼠标移入显示标签并高亮
通过threejs绘制的3d地图鼠标移入显示标签并高亮
朔州市平鲁区 下辖有 陶村乡,榆岭乡,白堂乡,阻虎乡,下木角乡,下水头乡,下面高乡,凤凰城镇,高石庄乡,井坪镇,向阳堡乡,西水界乡,双碾乡,陶村乡,榆岭乡,白堂乡,阻虎乡,下木角乡,下水头乡,下面高乡,凤凰城镇,高石庄乡,井坪镇,向阳堡乡,西水界乡,双碾乡
朔州市平鲁区下辖区域坐标
{"陶村乡":[112.44805328451261,39.47282179262285],"榆岭乡":[112.44680405966909,39.56174418433197],"白堂乡":[112.29623237013527,39.4600480364369],"阻虎乡":[112.01974213027549,39.71075236853385],"下木角乡":[112.09878713280372,39.4187348458276],"下水头乡":[112.04901807445171,39.54178781163799],"下面高乡":[112.56744648980388,39.50113934651012],"凤凰城镇":[112.18750582528318,39.78390312299022],"高石庄乡":[112.09187655240363,39.8695751466156],"井坪镇":[112.2768621949852,39.52675584449403],"向阳堡乡":[112.3584372624798,39.63500186867698],"西水界乡":[112.26556404631,39.68976183459001],"双碾乡":[112.10601851114666,39.6458823992593]}
朔州市平鲁区行政划分代码
[{"name":"陶村乡","code":"140603201000"},{"name":"榆岭乡","code":"140603210000"},{"name":"白堂乡","code":"140603200000"},{"name":"阻虎乡","code":"140603204000"},{"name":"下木角乡","code":""},{"name":"下水头乡","code":"140603202000"},{"name":"下面高乡","code":"140603207000"},{"name":"凤凰城镇","code":"140603101000"},{"name":"高石庄乡","code":"140603205000"},{"name":"井坪镇","code":"140603100000"},{"name":"向阳堡乡","code":"140603209000"},{"name":"西水界乡","code":"140603206000"},{"name":"双碾乡","code":"140603203000"}]
说明
1、根据《地图审核管理规定》、《互联网地图服务专业标准》等法规,本地图不作为境界线勘界等用处。使用中请查阅《中华人民共和国地图编制出版管理条例》、各地地图编制出版管理办法等地图规定按程序应用。
2、本数据是目前市面上较齐全、精度较高的数据,属性齐全,各大高校科研均在用此数据。
3、本数据仅用于echarts threejs地图效果展示。