echarts甘孜藏族自治州巴塘县geoJson地图点击弹出自定义弹窗实例

geoJson2 yekong

可视化数据大屏 项目中会有渲染地图的需要,除了百度地图以及高德地图外,也会需要echarts或者threejs效果的地图,今天为大家整理甘孜藏族自治州巴塘县echarts地图和threejs地图效果实例供大家参考。地图基于geoJson数据绘制。

echarts甘孜藏族自治州巴塘县geoJson地图点击弹出自定义弹窗

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

echarts甘孜藏族自治州巴塘县geoJson地图点击弹出自定义弹窗

echarts甘孜藏族自治州巴塘县geoJson地图点击地图插小旗

echarts地图渲染点击地图显示自定义效果实例,效果类似点击插小旗的效果,通过scatter实现.

echarts甘孜藏族自治州巴塘县geoJson地图点击地图插小旗

echarts甘孜藏族自治州巴塘县geoJson地图热力图

echarts通过heatmap实现热力图效果

echarts甘孜藏族自治州巴塘县geoJson地图热力图

threejs甘孜藏族自治州巴塘县geoJson地图3d地图css2d标签

通过threejs绘制的3d地图css2d标签实例,CSS2D面向摄像机,不随场景缩放而缩放 vue3 threejs实现在3d地图中绘制css2d地名,如果想系统的学习threejs的话,可以观看threejs视频 WebGL/Three.js前端高薪3D可视化

threejs甘孜藏族自治州巴塘县geoJson地图3d地图css2d标签

threejs甘孜藏族自治州巴塘县geoJson地图3d地图指定区域闪烁

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

threejs甘孜藏族自治州巴塘县geoJson地图3d地图指定区域闪烁

threejs甘孜藏族自治州巴塘县geoJson地图3d地图CSS2D外加旋转棱锥

通过threejs绘制3d地图CSS2D外加旋转棱锥效果

threejs甘孜藏族自治州巴塘县geoJson地图3d地图CSS2D外加旋转棱锥

甘孜藏族自治州巴塘县 下辖有 地巫乡,列衣乡,夏邛镇,拉哇乡,措拉乡,昌波乡,中咱乡,党巴乡,德达乡,甲英乡,松多乡,中心绒乡,莫多乡,波密乡,茶洛乡,亚日贡乡,波戈溪乡,竹巴龙乡,苏哇龙乡

甘孜藏族自治州巴塘县下辖区域坐标

{"地巫乡":[99.17967516131978,29.11040472568747],"列衣乡":[99.39016231435517,30.25512931094759],"夏邛镇":[99.1814452355925,29.94504228478189],"拉哇乡":[99.06517548276727,30.1248250750288],"措拉乡":[99.38881229467934,30.3525337902367],"昌波乡":[99.1513870468557,29.29401554613015],"中咱乡":[99.30388199549486,29.28255110770263],"党巴乡":[99.20112050288364,30.10411527890913],"德达乡":[99.54518729406601,30.29083263743139],"甲英乡":[99.05386355977618,30.29122403415889],"松多乡":[99.22280641375093,30.36365214743623],"中心绒乡":[99.17921463936047,29.18930897035823],"莫多乡":[99.24392981237352,30.21012944086271],"波密乡":[99.45994522331466,29.80592650289138],"茶洛乡":[99.47268328603222,30.49498297847448],"亚日贡乡":[99.30783512805655,29.61255709402743],"波戈溪乡":[99.44454645445052,30.1658891533874],"竹巴龙乡":[99.08790349390574,29.78713192857036],"苏哇龙乡":[99.11920500100122,29.47427513402571]}

甘孜藏族自治州巴塘县行政划分代码

[{"name":"地巫乡","code":""},{"name":"列衣乡","code":"513335216000"},{"name":"夏邛镇","code":"513335100000"},{"name":"拉哇乡","code":"513335200000"},{"name":"措拉乡","code":""},{"name":"昌波乡","code":"513335205000"},{"name":"中咱乡","code":""},{"name":"党巴乡","code":""},{"name":"德达乡","code":"513335217000"},{"name":"甲英乡","code":""},{"name":"松多乡","code":"513335211000"},{"name":"中心绒乡","code":""},{"name":"莫多乡","code":"513335210000"},{"name":"波密乡","code":"513335209000"},{"name":"茶洛乡","code":"513335215000"},{"name":"亚日贡乡","code":"513335208000"},{"name":"波戈溪乡","code":"513335212000"},{"name":"竹巴龙乡","code":"513335202000"},{"name":"苏哇龙乡","code":"513335204000"}]

说明

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

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

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

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

甘孜藏族自治州巴塘县echarts地图效果实例和threejs地图效果实例下载

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