echarts长春市九台区geoJson地图地图下钻展示效果

geoJson2 yekong

随着开发 数据大屏 项目越来越多,对地图的需求也各不相同,除了百度地图和高德地图外还会遇到echarts和threejs的需要,对地图的效果以及城市也各不相同,今天为大家整理长春市九台区echarts地图和threejs地图效果实例供大家参考。地图基于geoJson数据绘制。

echarts长春市九台区geoJson地图地图下钻展示

地图下钻展示,点击地图后,只显示当前选中的区域,可点击返回显示全部地图.

echarts长春市九台区geoJson地图地图下钻展示

echarts长春市九台区geoJson地图自定义引导线

echarts地图渲染中,会遇到多个地名凑到一块导致名称重叠的情况,这时候我们可以通过一条线指向对应的位置并通过label来进行标注的效果.

echarts长春市九台区geoJson地图自定义引导线

echarts长春市九台区geoJson地图定义颜色

echarts地图通过visualMap来事先设置好数据区间,根据区间来来显示地图的颜色,这里的visualMap数据是随机生成的,可以通过实例代码根据自己的需要配置颜色和数据区间.

echarts长春市九台区geoJson地图定义颜色

threejs长春市九台区geoJson地图3d地图鼠标移入显示标签并高亮

通过threejs绘制的3d地图鼠标移入显示标签并高亮,如果对threejs感兴趣,可以观看threejs视频 3D可视化Three.js视频教程

threejs长春市九台区geoJson地图3d地图鼠标移入显示标签并高亮

threejs长春市九台区geoJson地图3d地图添加描边效果

通过threejs绘制3d地图使用outlinePass 实现发光描边效果

threejs长春市九台区geoJson地图3d地图添加描边效果

threejs长春市九台区geoJson地图3d地图添加金色效果

通过threejs绘制3d地图使用outlinePass实现金色描边效果,并通过edgeStrength增加强度,让描边更清晰

threejs长春市九台区geoJson地图3d地图添加金色效果

长春市九台区 下辖有 纪家镇,上河湾镇,其塔木镇,兴隆镇,九台街道,九郊街道,波泥河镇,土们岭镇,苇子沟镇,营城街道,胡家回族乡,莽卡满族乡,西营城街道,城子街镇,沐石河镇

长春市九台区下辖区域坐标

{"纪家镇":[125.63761652636825,44.21513060516442],"上河湾镇":[126.2595282366259,44.46141982831583],"其塔木镇":[126.35067813871021,44.3795677492319],"兴隆镇":[125.74698504107785,44.28946463829306],"九台街道":[125.84392978829814,44.14981083558101],"九郊街道":[125.82364253924604,44.14489330289771],"波泥河镇":[125.8927482527657,43.95289737983398],"土们岭镇":[125.98478056151981,44.0985073908963],"苇子沟镇":[125.91499553862981,44.25591099717364],"营城街道":[125.89007050847192,44.14969194593101],"胡家回族乡":[126.31357662029033,44.24334870404846],"莽卡满族乡":[126.41357903290323,44.26513985200308],"西营城街道":[125.82798000665119,44.01339048745784],"城子街镇":[126.0700984549199,44.37796862103539],"沐石河镇":[126.117992340787,44.24056405949551]}

长春市九台区行政划分代码

[{"name":"纪家镇","code":""},{"name":"上河湾镇","code":"220113103000"},{"name":"其塔木镇","code":"220113102000"},{"name":"兴隆镇","code":""},{"name":"九台街道","code":"220113001000"},{"name":"九郊街道","code":"220113003000"},{"name":"波泥河镇","code":""},{"name":"土们岭镇","code":""},{"name":"苇子沟镇","code":""},{"name":"营城街道","code":"220113002000"},{"name":"胡家回族乡","code":"220113200000"},{"name":"莽卡满族乡","code":"220113201000"},{"name":"西营城街道","code":"220113004000"},{"name":"城子街镇","code":""},{"name":"沐石河镇","code":""}]

说明

1、根据《地图审核管理规定》、《互联网地图服务专业标准》等法规,本地图不作为境界线勘界等用处。使用中请查阅《中华人民共和国地图编制出版管理条例》、各地地图编制出版管理办法等地图规定按程序应用。

2、本数据是目前市面上较齐全、精度较高的数据,属性齐全,各大高校科研均在用此数据。

3、本数据仅用于echarts threejs地图效果展示。

4、当前除了包含有关键地区的geoJson地图信息外还包含有28个echarts地图效果,以及13个threejs地图实例效果,限于篇幅不一一展示,可以通过更多echarts和threejs地图效果实例查看

长春市九台区echarts地图效果实例和threejs地图效果实例下载

相关文件下载地址
此资源需支付 ¥10 后下载
支付宝购买扫右侧红包码购买更优惠,如无法下载请联系微信:17331886870
喜欢
echarts长春市九台区geoJson地图地图下钻展示效果