数据大屏可视化 项目中经常会遇到需要渲染echarts地图的情况，为了方便不同城市快速实现效果，将不同城市的echarts地图效果整理出来，供大家参考，今天为大家整理的是泉州市鲤城区echarts地图和threejs地图效果实例。地图基于geoJson数据绘制。
echarts泉州市鲤城区geoJson地图添加柱状图
echarts地图渲染时,为了让地图上的数据有一个对比的效果,会在地图上标注柱状图,以便于更直观的看出各个区域的数值.
echarts泉州市鲤城区geoJson地图点击地图插小旗
echarts地图渲染点击地图显示自定义效果实例,效果类似点击插小旗的效果,通过scatter实现.
echarts泉州市鲤城区geoJson地图地图下钻展示
地图下钻展示,点击地图后,只显示当前选中的区域,可点击返回显示全部地图.
threejs泉州市鲤城区geoJson地图3d地图鼠标移入显示标签并高亮
通过threejs绘制的3d地图鼠标移入显示标签并高亮,如果想系统的学习threejs的话，可以观看threejs课程视频 Three.js前端3D可视化
threejs泉州市鲤城区geoJson地图3d地图css2d标签
通过threejs绘制的3d地图css2d标签实例，CSS2D面向摄像机,不随场景缩放而缩放 vue3 threejs实现在3d地图中绘制css2d地名
threejs泉州市鲤城区geoJson地图3d地图添加描边效果
通过threejs绘制3d地图使用outlinePass 实现发光描边效果
泉州市鲤城区 下辖有 临江街道,开元街道,常泰街道,江南街道,浮桥街道,海滨街道,金龙街道,鲤中街道,清濛经济开发区
泉州市鲤城区下辖区域坐标
{"临江街道":[118.58382186142416,24.89860757235837],"开元街道":[118.58685727307096,24.92148561174243],"常泰街道":[118.51435339741946,24.91418056634713],"江南街道":[118.55413484677622,24.89334380708878],"浮桥街道":[118.5396104071902,24.92965930839371],"海滨街道":[118.57684381683498,24.91013522113089],"金龙街道":[118.53271786595035,24.90465578180097],"鲤中街道":[118.58377304409964,24.91235589469595],"清濛经济开发区":[118.54613861643679,24.87016776169943]}
泉州市鲤城区行政划分代码
[{"name":"临江街道","code":"350502002000"},{"name":"开元街道","code":"350502004000"},{"name":"常泰街道","code":"350502008000"},{"name":"江南街道","code":"350502006000"},{"name":"浮桥街道","code":"350502005000"},{"name":"海滨街道","code":"350502001000"},{"name":"金龙街道","code":"350502007000"},{"name":"鲤中街道","code":"350502003000"},{"name":"清濛经济开发区","code":"350502400000"}]
说明
1、根据《地图审核管理规定》、《互联网地图服务专业标准》等法规，本地图不作为境界线勘界等用处。使用中请查阅《中华人民共和国地图编制出版管理条例》、各地地图编制出版管理办法等地图规定按程序应用。
2、本数据是目前市面上较齐全、精度较高的数据，属性齐全，各大高校科研均在用此数据。
3、本数据仅用于echarts threejs地图效果展示。
4、当前除了包含有关键地区的geoJson地图信息外还包含有28个echarts地图效果,以及13个threejs地图实例效果,限于篇幅不一一展示,可以通过更多echarts和threejs地图效果实例查看
