数据大屏可视化 项目中会有渲染地图的需要,除了百度地图以及高德地图外,也会需要echarts或者threejs效果的地图,今天为大家整理崇左市江州区echarts地图和threejs地图效果实例供大家参考。地图基于geoJson数据绘制。
echarts崇左市江州区geoJson地图迁徙图
echarts飞线图实例,可以根据自己的需要配置飞线的颜色大小以及方向
echarts崇左市江州区geoJson地图点击地图插小旗
echarts地图渲染点击地图显示自定义效果实例,效果类似点击插小旗的效果,通过scatter实现.
echarts崇左市江州区geoJson地图添加柱状图
echarts地图渲染时,为了让地图上的数据有一个对比的效果,会在地图上标注柱状图,以便于更直观的看出各个区域的数值.
threejs崇左市江州区geoJson地图3d地图添加描边效果
通过threejs绘制3d地图使用outlinePass 实现发光描边效果,如果对threejs感兴趣,可以观看threejs教程视频 WebGL前端3D可视化教程
threejs崇左市江州区geoJson地图3d地图指定区域闪烁
通过threejs绘制3d地图并让指定区域闪烁
threejs崇左市江州区geoJson地图3d地图自定义贴图加CSS2D标签
通过threejs绘制3d地图并添加CSS2D标签和自定义贴图
崇左市江州区 下辖有 左州镇,新和镇,板利乡,江州镇,濑湍镇,罗白乡,那隆镇,驮卢镇,太平街道,江南街道,石景林街道,左江华侨农场,新和华侨农场
崇左市江州区下辖区域坐标
{"左州镇":[107.44833571704157,22.63881771110876],"新和镇":[107.20034126975833,22.54575467952921],"板利乡":[107.48866215718675,22.2122323128825],"江州镇":[107.35524942327731,22.26709222986005],"濑湍镇":[107.52305779110735,22.43197218550679],"罗白乡":[107.53460250668962,22.32165164649514],"那隆镇":[107.54089491721223,22.81059291279982],"驮卢镇":[107.60444552973317,22.65557812182797],"太平街道":[107.29581629299526,22.45194083653244],"江南街道":[107.36003383343828,22.4180707665232],"石景林街道":[107.3896019325712,22.39856826589217],"左江华侨农场":[107.60834795148568,22.66725215437417],"新和华侨农场":[107.21816026595378,22.55120464408952]}
崇左市江州区行政划分代码
[{"name":"左州镇","code":"451402104000"},{"name":"新和镇","code":"451402101000"},{"name":"板利乡","code":"451402202000"},{"name":"江州镇","code":"451402103000"},{"name":"濑湍镇","code":"451402102000"},{"name":"罗白乡","code":"451402201000"},{"name":"那隆镇","code":"451402105000"},{"name":"驮卢镇","code":"451402106000"},{"name":"太平街道","code":"451402001000"},{"name":"江南街道","code":"451402002000"},{"name":"石景林街道","code":"451402003000"},{"name":"左江华侨农场","code":"451402401000"},{"name":"新和华侨农场","code":"451402400000"}]
说明
1、根据《地图审核管理规定》、《互联网地图服务专业标准》等法规,本地图不作为境界线勘界等用处。使用中请查阅《中华人民共和国地图编制出版管理条例》、各地地图编制出版管理办法等地图规定按程序应用。
2、本数据是目前市面上较齐全、精度较高的数据,属性齐全,各大高校科研均在用此数据。
3、本数据仅用于echarts threejs地图效果展示。
4、当前除了包含有关键地区的geoJson地图信息外还包含有28个echarts地图效果,以及13个threejs地图实例效果,限于篇幅不一一展示,可以通过更多echarts和threejs地图效果实例查看