echarts淮安市盱眙县geoJson地图点击弹出自定义弹窗实例

geoJson2 yekong

可视化数据大屏 项目中会有渲染地图的需要,除了百度地图以及高德地图外,也会需要echarts或者threejs效果的地图,今天为大家整理淮安市盱眙县echarts地图和threejs地图效果实例供大家参考。地图基于geoJson数据绘制。

echarts淮安市盱眙县geoJson地图点击弹出自定义弹窗

我们可以通过scatter来设置自定义样式,但是这种自定义局限性很大,如果要求的样式很复杂的话,scatter就不能很好的实现了,所以我们可以通过鼠标点击获取横纵坐标,然后通过css来定位到对应的位置.

echarts淮安市盱眙县geoJson地图点击弹出自定义弹窗

echarts淮安市盱眙县geoJson地图点击地图获取经纬度

echarts地图渲染后,有时候会需要点击后获取到经纬度信息,通过经纬度信息来查询一些内容,这里我们可以通过convertFromPixel来获取经纬度.

echarts淮安市盱眙县geoJson地图点击地图获取经纬度

echarts淮安市盱眙县geoJson地图地图下钻展示

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

echarts淮安市盱眙县geoJson地图地图下钻展示

threejs淮安市盱眙县geoJson地图3d地图鼠标移入显示标签并高亮

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

threejs淮安市盱眙县geoJson地图3d地图鼠标移入显示标签并高亮

threejs淮安市盱眙县geoJson地图3d地图指定区域闪烁

通过threejs绘制3d地图并让指定区域闪烁

threejs淮安市盱眙县geoJson地图3d地图指定区域闪烁

threejs淮安市盱眙县geoJson地图3d地图自定义贴图加CSS2D标签

通过threejs绘制3d地图并添加CSS2D标签和自定义贴图

threejs淮安市盱眙县geoJson地图3d地图自定义贴图加CSS2D标签

淮安市盱眙县 下辖有 三河农场,管镇,淮河镇,仇集镇,兴隆乡,古桑乡,官滩镇,盱城镇,穆店乡,维桥乡,铁佛镇,鲍集镇,明祖陵镇,淮化集团,观音寺镇,王店乡,旧铺镇,桂五镇,河桥镇,马坝镇,黄花塘镇

淮安市盱眙县下辖区域坐标

{"三河农场":[118.64212205922234,33.07111799731004],"管镇":[118.37524498458643,33.13734852991944],"淮河镇":[118.40376770174655,33.01337892659848],"仇集镇":[118.36731557481386,32.80426122117532],"兴隆乡":[118.37722990399934,33.05044657831972],"古桑乡":[118.49340161804787,32.93423869096755],"官滩镇":[118.61923394006098,33.12133334112779],"盱城镇":[118.52522521337823,33.03227874819333],"穆店乡":[118.60875145362785,32.91043853690006],"维桥乡":[118.62047166457123,32.99125298947173],"铁佛镇":[118.28116504269308,33.04600320113654],"鲍集镇":[118.27924705717797,33.13283313403755],"明祖陵镇":[118.45808701727708,33.11244996132059],"淮化集团":[118.6742800012623,33.08003318175099],"观音寺镇":[118.79287492430771,33.05110409350165],"王店乡":[118.53820889027773,32.78467886685756],"旧铺镇":[118.67354485871245,32.79511256737186],"桂五镇":[118.49900714504749,32.85275829880539],"河桥镇":[118.33732299276281,32.91321789082603],"马坝镇":[118.77387199512793,32.97884404854083],"黄花塘镇":[118.73922470742474,32.91168737097314]}

淮安市盱眙县行政划分代码

[{"name":"三河农场","code":"320830400000"},{"name":"管镇","code":""},{"name":"淮河镇","code":"320830111000"},{"name":"仇集镇","code":""},{"name":"兴隆乡","code":""},{"name":"古桑乡","code":""},{"name":"官滩镇","code":"320830102000"},{"name":"盱城镇","code":""},{"name":"穆店乡","code":""},{"name":"维桥乡","code":""},{"name":"铁佛镇","code":""},{"name":"鲍集镇","code":"320830107000"},{"name":"明祖陵镇","code":""},{"name":"淮化集团","code":"320830401000"},{"name":"观音寺镇","code":""},{"name":"王店乡","code":""},{"name":"旧铺镇","code":""},{"name":"桂五镇","code":"320830104000"},{"name":"河桥镇","code":"320830106000"},{"name":"马坝镇","code":"320830101000"},{"name":"黄花塘镇","code":"320830108000"}]

说明

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

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

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

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

淮安市盱眙县echarts地图效果实例和threejs地图效果实例下载

相关文件下载地址
此资源需支付 ¥10 后下载
支付宝购买扫右侧红包码购买更优惠,如无法下载请联系微信:17331886870
喜欢
echarts淮安市盱眙县geoJson地图点击弹出自定义弹窗实例