数据大屏可视化 项目中经常会遇到需要渲染echarts地图的情况，为了方便不同城市快速实现效果，将不同城市的echarts地图效果整理出来，供大家参考，今天为大家整理的是大连市普兰店区echarts地图和threejs地图效果实例。地图基于geoJson数据绘制。
普兰店区位于辽东半岛南部、大连市中北部，介于北纬39°18'25"至39°59'00"，东经121°50'33"至122°36'15"之间；北与营口盖州市接壤，西接瓦房店市，东临庄河市和黄海，南与大连市金州区毗连，东南与长海县隔海相望。全区行政区域面积2677平方千米，根据全国第七次人口普查数据显示，截至2020年11月1日零时，常住人口629664人。
echarts大连市普兰店区geoJson地图水滴状气泡图
echarts地图渲染时,会通过一个水滴状小气泡来将数值渲染到地图上,我们可以可以通过scatter来实现我们想要的效果.
echarts大连市普兰店区geoJson地图点击弹出自定义弹窗
我们可以通过scatter来设置自定义样式,但是这种自定义局限性很大,如果要求的样式很复杂的话,scatter就不能很好的实现了,所以我们可以通过鼠标点击获取横纵坐标,然后通过css来定位到对应的位置.
echarts大连市普兰店区geoJson地图3d地图实例旋转动画
使用的是echarts-gl结合echarts实现的3d地图效果实例
threejs大连市普兰店区geoJson地图3d地图CSS3D标签
通过threejs绘制的3d地图CSS3D标签实例，CSS3D不面向摄像机，跟随场景缩放,可以通过rotateY调整角度,通过scale调整大小 Vue3 threejs 在3d地图中绘制css3d标签标注省份,如果想系统的学习threejs的话，可以观看threejs视频课程 3D可视化Three.js视频教程
threejs大连市普兰店区geoJson地图3d地图自定义贴图加CSS3D标签
通过threejs绘制3d地图并添加CSS3D标签和自定义贴图
threejs大连市普兰店区geoJson地图3d地图
通过threejs绘制的3d地图实例 vue3 threejs 在vue3项目中绘制3d地图效果实例
大连市普兰店区 下辖有 太平街道,同益乡,莲山街道,乐甲满族乡,唐家房街道,墨盘乡,星台镇,杨树房街道,沙包镇,大谭街道,城子坦街道,双塔镇,四平镇,安波镇,丰荣街道,南山街道,炮台街道,皮口街道,石河街道,铁西街道,复州湾街道,大刘家街道,三十里堡街道
大连市普兰店区下辖区域坐标
{"太平街道":[122.00706987354806,39.3660771677351],"同益乡":[122.2598008191808,39.89353346616844],"莲山街道":[122.2473630384215,39.56688125652315],"乐甲满族乡":[122.28363202702647,39.75374133959656],"唐家房街道":[122.18905487485898,39.42669012114831],"墨盘乡":[122.53099820097489,39.66261602454135],"星台镇":[122.3695343880268,39.60265671275995],"杨树房街道":[122.24386263290893,39.38376002835131],"沙包镇":[122.22232722060414,39.65572624604996],"大谭街道":[122.14779198808722,39.50368526650349],"城子坦街道":[122.48603838465884,39.52546914189465],"双塔镇":[122.44091596541475,39.75605411687648],"四平镇":[122.17455511885612,39.7749919005127],"安波镇":[122.39684139854761,39.87126499048419],"丰荣街道":[122.04336193945457,39.42627685538676],"南山街道":[121.90514239299443,39.39427918827759],"炮台街道":[121.80127706901509,39.45249646276158],"皮口街道":[],"石河街道":[121.82395248639239,39.33517124372565],"铁西街道":[121.95995551271835,39.45545842700976],"复州湾街道":[121.65321081919814,39.41143031353986],"大刘家街道":[122.1753599156704,39.346129842156],"三十里堡街道":[]}
大连市普兰店区行政划分代码
[{"name":"太平街道","code":"210214003000"},{"name":"同益乡","code":""},{"name":"莲山街道","code":"210214011000"},{"name":"乐甲满族乡","code":""},{"name":"唐家房街道","code":"210214010000"},{"name":"墨盘乡","code":""},{"name":"星台镇","code":""},{"name":"杨树房街道","code":"210214008000"},{"name":"沙包镇","code":""},{"name":"大谭街道","code":"210214009000"},{"name":"城子坦街道","code":"210214006000"},{"name":"双塔镇","code":""},{"name":"四平镇","code":""},{"name":"安波镇","code":""},{"name":"丰荣街道","code":"210214001000"},{"name":"南山街道","code":""},{"name":"炮台街道","code":""},{"name":"皮口街道","code":"210214005000"},{"name":"石河街道","code":""},{"name":"铁西街道","code":"210214002000"},{"name":"复州湾街道","code":""},{"name":"大刘家街道","code":"210214007000"},{"name":"三十里堡街道","code":""}]
说明
1、根据《地图审核管理规定》、《互联网地图服务专业标准》等法规，本地图不作为境界线勘界等用处。使用中请查阅《中华人民共和国地图编制出版管理条例》、各地地图编制出版管理办法等地图规定按程序应用。
2、本数据是目前市面上较齐全、精度较高的数据，属性齐全，各大高校科研均在用此数据。
3、本数据仅用于echarts threejs地图效果展示。
