数据可视化大屏 项目中经常会遇到需要渲染echarts地图的情况，为了方便不同城市快速实现效果，将不同城市的echarts地图效果整理出来，供大家参考，今天为大家整理的是湖州市南浔区echarts地图和threejs地图效果实例。地图基于geoJson数据绘制。
echarts湖州市南浔区geoJson地图地图排行榜效果
echarts地图根据数据渲染不同颜色的地图,并根据数据大小显示前10名的排序效果,属于地图map类型和柱状图bar类型混合效果
echarts湖州市南浔区geoJson地图点击跳转到指定页面
为图标添加点击事件,点击图标,跳转到指定页面
echarts湖州市南浔区geoJson地图区域闪烁
echarts地图有时候为了突出某一块区域的重要性,会进行两个颜色的交替变化来告诉用户这一块需要重点关注,我们可以通过echarts的dispatchAction来实现我们想要的效果.
threejs湖州市南浔区geoJson地图3d地图css2d标签
通过threejs绘制的3d地图css2d标签实例，CSS2D面向摄像机,不随场景缩放而缩放 vue3 threejs实现在3d地图中绘制css2d地名,如果想系统的学习threejs的话，可以观看threejs教程视频 Three.js前端3D可视化教程
threejs湖州市南浔区geoJson地图3d地图添加金色效果
通过threejs绘制3d地图使用outlinePass实现金色描边效果,并通过edgeStrength增加强度,让描边更清晰
threejs湖州市南浔区geoJson地图3d地图添加描边效果
通过threejs绘制3d地图使用outlinePass 实现发光描边效果
湖州市南浔区 下辖有 千金镇,南浔镇,双林镇,和孚镇,善琏镇,旧馆镇,石淙镇,练市镇,菱湖镇
湖州市南浔区下辖区域坐标
{"千金镇":[120.2418736406509,30.66551853248444],"南浔镇":[120.40316752761268,30.84763431873723],"双林镇":[120.30824033644265,30.78741506851512],"和孚镇":[120.19374370208868,30.7728527333561],"善琏镇":[120.31542028101507,30.68215212380931],"旧馆镇":[120.26238434134066,30.82327683493677],"石淙镇":[120.26282275381874,30.71803160785868],"练市镇":[120.41330017986361,30.71963992276419],"菱湖镇":[120.15434593464184,30.72732634904634]}
湖州市南浔区行政划分代码
[{"name":"千金镇","code":"330503107000"},{"name":"南浔镇","code":"330503100000"},{"name":"双林镇","code":"330503101000"},{"name":"和孚镇","code":"330503106000"},{"name":"善琏镇","code":"330503103000"},{"name":"旧馆镇","code":""},{"name":"石淙镇","code":"330503108000"},{"name":"练市镇","code":"330503102000"},{"name":"菱湖镇","code":"330503105000"}]
说明
1、根据《地图审核管理规定》、《互联网地图服务专业标准》等法规，本地图不作为境界线勘界等用处。使用中请查阅《中华人民共和国地图编制出版管理条例》、各地地图编制出版管理办法等地图规定按程序应用。
2、本数据是目前市面上较齐全、精度较高的数据，属性齐全，各大高校科研均在用此数据。
3、本数据仅用于echarts threejs地图效果展示。
4、当前除了包含有关键地区的geoJson地图信息外还包含有28个echarts地图效果,以及13个threejs地图实例效果,限于篇幅不一一展示,可以通过更多echarts和threejs地图效果实例查看
