可视化大屏 项目中会有渲染地图的需要,除了百度地图以及高德地图外，也会需要echarts或者threejs效果的地图,今天为大家整理太原市杏花岭区echarts地图和threejs地图效果实例供大家参考。地图基于geoJson数据绘制。
杏花岭区，隶属于 山西省 太原市，位于太原市东北部，是太原市6个市辖区之一。东与晋中市寿阳县、太原市迎泽区交接，西以汾河中心线为界与万柏林区相邻，南接迎泽区，北与阳曲县、尖草坪区接壤。宋建太原古城部分处于杏花岭区之中。
echarts太原市杏花岭区geoJson地图点击弹出自定义弹窗
我们可以通过scatter来设置自定义样式,但是这种自定义局限性很大,如果要求的样式很复杂的话,scatter就不能很好的实现了,所以我们可以通过鼠标点击获取横纵坐标,然后通过css来定位到对应的位置.
echarts太原市杏花岭区geoJson地图 tooltip轮播
echarts地图实现类似tooltip轮播效果,通过effectScatter实现浮窗,并通过定时修改effectScatter的data来实现浮窗的移动.
echarts太原市杏花岭区geoJson地图 visualMap控制地图颜色
echarts地图使用visualMap通过一组颜色及一组数据来实现地图不同区域根据不同数据进行颜色变化
threejs太原市杏花岭区geoJson地图3d地图自定义贴图加CSS2D标签
通过threejs绘制3d地图并添加CSS2D标签和自定义贴图,如果想系统的学习threejs的话，可以观看threejs视频教程 WebGL 3D可视化教程
threejs太原市杏花岭区geoJson地图3d地图红色描边闪烁警报
通过threejs绘制3d地图使用outlinePass 实现发光描边闪烁效果 以实现警报功能
threejs太原市杏花岭区geoJson地图3d地图添加金色效果
通过threejs绘制3d地图使用outlinePass实现金色描边效果,并通过edgeStrength增加强度,让描边更清晰
太原市杏花岭区 下辖有 杨家峪街道,民营区,坝陵桥街道,杏花岭街道,小返乡,大东关街道,三桥街道,巨轮街道,鼓楼街道,中涧河乡,涧河街道,敦化坊街道,职工新街街道,杨家峪街道,民营区,坝陵桥街道,杏花岭街道,小返乡,大东关街道,三桥街道,巨轮街道,鼓楼街道,中涧河乡,涧河街道,敦化坊街道,职工新街街道
太原市杏花岭区下辖区域坐标
{"杨家峪街道":[112.6214741556019,37.88524532107758],"民营区":[112.60963838046459,37.86795158907442],"坝陵桥街道":[112.57004263539591,37.88226862087055],"杏花岭街道":[112.57014690776103,37.87459817887081],"小返乡":[112.67104983110056,37.94221543642266],"大东关街道":[112.5869844313538,37.87271175466198],"三桥街道":[112.54278015086652,37.88004095813005],"巨轮街道":[112.55461740353795,37.89137197418348],"鼓楼街道":[112.55452786051154,37.87459714308921],"中涧河乡":[112.62003198671165,37.9215702668548],"涧河街道":[],"敦化坊街道":[112.58157573459837,37.90144296514406],"职工新街街道":[112.60649627124963,37.88126596750053]}
太原市杏花岭区行政划分代码
[{"name":"杨家峪街道","code":"140107010000"},{"name":"民营区","code":""},{"name":"坝陵桥街道","code":"140107005000"},{"name":"杏花岭街道","code":"140107004000"},{"name":"小返乡","code":""},{"name":"大东关街道","code":"140107006000"},{"name":"三桥街道","code":"140107002000"},{"name":"巨轮街道","code":"140107001000"},{"name":"鼓楼街道","code":"140107003000"},{"name":"中涧河乡","code":""},{"name":"涧河街道","code":"140107009000"},{"name":"敦化坊街道","code":"140107008000"},{"name":"职工新街街道","code":"140107007000"}]
说明
1、根据《地图审核管理规定》、《互联网地图服务专业标准》等法规，本地图不作为境界线勘界等用处。使用中请查阅《中华人民共和国地图编制出版管理条例》、各地地图编制出版管理办法等地图规定按程序应用。
2、本数据是目前市面上较齐全、精度较高的数据，属性齐全，各大高校科研均在用此数据。
3、本数据仅用于echarts threejs地图效果展示。
