随着开发 数据可视化大屏 项目越来越多,对地图的需求也各不相同,除了百度地图和高德地图外还会遇到echarts和threejs的需要,对地图的效果以及城市也各不相同,今天为大家整理海口市美兰区echarts地图和threejs地图效果实例供大家参考。地图基于geoJson数据绘制。
美兰区，海南省海口市辖区，位于海口市东北部，地理坐标介于北纬19°45′15″—20°05’30″，东经110°17’52″—111°42’36″之间，总面积581平方千米。美兰区属季风性热带气候区，夏季长冬季短，四季特征不明显。截至2023年3月，美兰区下辖9个街道和4个镇，区人民政府驻美兰区群上路1号。截至2022年末，美兰区户籍人口660149人。
echarts海口市美兰区geoJson地图tooltip自定义html
echarts tooltip演示自定义,通过toolTip的formatter方法以html+css的方式实现自己想要的样式效果,鼠标移上去就可以看到我们想要的效果了,也可以通过css自定义为自己需要的样式.
echarts海口市美兰区geoJson地图3d地图
使用的是echarts-gl结合echarts实现的3d地图效果实例
echarts海口市美兰区geoJson地图地图排行榜效果
echarts地图根据数据渲染不同颜色的地图,并根据数据大小显示前10名的排序效果,属于地图map类型和柱状图bar类型混合效果
threejs海口市美兰区geoJson地图3d地图添加旋转棱锥
通过threejs绘制3d地图并在指定经纬度上添加带波纹效果不停旋转的棱锥效果实例,如果想系统的学习threejs的话，可以观看threejs视频课程 WebGL 3D可视化教程
threejs海口市美兰区geoJson地图3d地图鼠标移入显示标签并高亮
通过threejs绘制的3d地图鼠标移入显示标签并高亮
threejs海口市美兰区geoJson地图3d地图
通过threejs绘制的3d地图实例 vue3 threejs 在vue3项目中绘制3d地图效果实例
海口市美兰区 下辖有 白沙街道,三江镇,白龙街道,博爱街道,新埠街道,海府街道,蓝天街道,人民路街道,和平南街道,罗牛山农场,国营三江农场,国营桂林洋农场,灵山镇,演丰镇,大致坡镇,海甸街道
海口市美兰区下辖区域坐标
{"白沙街道":[110.36828290789873,20.04135704253721],"三江镇":[110.58626013338062,19.88519101170754],"白龙街道":[110.36933191966011,20.02962955671652],"博爱街道":[110.3450980407406,20.04170213970835],"新埠街道":[110.35593931374993,20.08350208702868],"海府街道":[110.34175003143565,20.02846279448884],"蓝天街道":[110.3518629812642,20.02405656917814],"人民路街道":[110.3191277732131,20.06287974562019],"和平南街道":[110.3529624555535,20.0320011269189],"罗牛山农场":[110.55292078529035,19.91238072180265],"国营三江农场":[110.63566674643982,19.92058943705227],"国营桂林洋农场":[110.50588580722473,20.01908307562102],"灵山镇":[110.43027090189548,20.00824078977422],"演丰镇":[110.54400940339536,19.96197996237107],"大致坡镇":[110.63101539027191,19.8180554175905],"海甸街道":[110.34300897024076,20.06482063551988]}
海口市美兰区行政划分代码
[{"name":"白沙街道","code":"460108008000"},{"name":"三江镇","code":"460108103000"},{"name":"白龙街道","code":"460108006000"},{"name":"博爱街道","code":"460108003000"},{"name":"新埠街道","code":"460108009000"},{"name":"海府街道","code":"460108001000"},{"name":"蓝天街道","code":"460108002000"},{"name":"人民路街道","code":""},{"name":"和平南街道","code":"460108007000"},{"name":"罗牛山农场","code":"460108500000"},{"name":"国营三江农场","code":""},{"name":"国营桂林洋农场","code":""},{"name":"灵山镇","code":"460108101000"},{"name":"演丰镇","code":"460108102000"},{"name":"大致坡镇","code":"460108104000"},{"name":"海甸街道","code":"460108004000"}]
说明
1、根据《地图审核管理规定》、《互联网地图服务专业标准》等法规，本地图不作为境界线勘界等用处。使用中请查阅《中华人民共和国地图编制出版管理条例》、各地地图编制出版管理办法等地图规定按程序应用。
2、本数据是目前市面上较齐全、精度较高的数据，属性齐全，各大高校科研均在用此数据。
3、本数据仅用于echarts threejs地图效果展示。
4、当前除了包含有关键地区的geoJson地图信息外还包含有28个echarts地图效果,以及13个threejs地图实例效果,限于篇幅不一一展示,可以通过更多echarts和threejs地图效果实例查看
