echarts遂宁市安居区geoJson地图3d地图自定义贴图-绿色地面实例代码

geoJson2 yekong 152℃

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

echarts遂宁市安居区geoJson地图3d地图自定义贴图-绿色地面

3d地图自定义贴图-绿色地面,echarts结合echarts-gl实现3d地图自定义贴图效果,通过设置 shading: 'realistic',以及realisticMaterial来设置自定义纹理贴图,当前效果为绿色地面的效果实例

echarts遂宁市安居区geoJson地图3d地图自定义贴图-绿色地面

echarts遂宁市安居区geoJson地图指定区域高亮

echarts让指定区域变为选中高亮状态

echarts遂宁市安居区geoJson地图指定区域高亮

echarts遂宁市安居区geoJson地图局部颜色渐变

echarts地图渲染,通过echarts.graphic.LinearGradient线性渐变来实现地图区域颜色的渐变效果

echarts遂宁市安居区geoJson地图局部颜色渐变

threejs遂宁市安居区geoJson地图3d地图

通过threejs绘制的3d地图实例 vue3 threejs 在vue3项目中绘制3d地图效果实例,如果对threejs感兴趣,可以观看threejs教程视频 Three.js前端3D可视化

threejs遂宁市安居区geoJson地图3d地图

threejs遂宁市安居区geoJson地图3d地图添加描边效果

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

threejs遂宁市安居区geoJson地图3d地图添加描边效果

threejs遂宁市安居区geoJson地图3d地图鼠标移入显示标签并高亮

通过threejs绘制的3d地图鼠标移入显示标签并高亮

threejs遂宁市安居区geoJson地图3d地图鼠标移入显示标签并高亮

遂宁市安居区 下辖有 分水镇,中兴镇,会龙镇,大安乡,保石镇,安居镇,常理乡,步云乡,玉丰镇,白马镇,石洞镇,磨溪镇,聚贤乡,莲花乡,观音乡,马家乡,凤凰街道,柔刚街道,三家镇,东禅镇,拦江镇,横山镇,西眉镇

遂宁市安居区下辖区域坐标

{"分水镇":[105.25591801607227,30.32794376381215],"中兴镇":[105.23473574682026,30.39103884692588],"会龙镇":[105.43961715634612,30.41798542954534],"大安乡":[105.60079083581343,30.21445557400553],"保石镇":[105.17157249244822,30.34822494309781],"安居镇":[105.4503466422867,30.30301254443637],"常理乡":[105.40118823116616,30.53410566330216],"步云乡":[105.2247640738426,30.45497415341133],"玉丰镇":[105.53062068241668,30.3655439912114],"白马镇":[105.28826359352729,30.4224349463497],"石洞镇":[105.36773926860201,30.40355103866171],"磨溪镇":[105.6799141299919,30.29689099797565],"聚贤乡":[105.4879536391147,30.42064755564981],"莲花乡":[105.1275912995741,30.43839103442834],"观音乡":[105.35302437557061,30.47761541893154],"马家乡":[105.60128199850588,30.27807073721571],"凤凰街道":[105.44857942442096,30.35246802732861],"柔刚街道":[105.44780362957258,30.34190615753666],"三家镇":[105.50076592188331,30.2641784163353],"东禅镇":[105.34175299869258,30.3337879773512],"拦江镇":[105.14186121741923,30.41646628929724],"横山镇":[105.43384929747117,30.4877200020975],"西眉镇":[105.63571862587186,30.344793267612]}

遂宁市安居区行政划分代码

[{"name":"分水镇","code":"510904102000"},{"name":"中兴镇","code":"510904107000"},{"name":"会龙镇","code":"510904109000"},{"name":"大安乡","code":""},{"name":"保石镇","code":"510904105000"},{"name":"安居镇","code":"510904100000"},{"name":"常理乡","code":""},{"name":"步云乡","code":""},{"name":"玉丰镇","code":"510904111000"},{"name":"白马镇","code":"510904106000"},{"name":"石洞镇","code":"510904103000"},{"name":"磨溪镇","code":"510904113000"},{"name":"聚贤乡","code":""},{"name":"莲花乡","code":""},{"name":"观音乡","code":""},{"name":"马家乡","code":""},{"name":"凤凰街道","code":"510904002000"},{"name":"柔刚街道","code":"510904001000"},{"name":"三家镇","code":"510904110000"},{"name":"东禅镇","code":"510904101000"},{"name":"拦江镇","code":"510904104000"},{"name":"横山镇","code":"510904108000"},{"name":"西眉镇","code":"510904112000"}]

说明

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

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

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

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

遂宁市安居区echarts地图效果实例和threejs地图效果实例下载

相关文件下载地址
此资源需支付 ¥10 后下载
支付宝购买扫右侧红包码购买更优惠,如无法下载请联系微信:17331886870
喜欢 (0)
echarts遂宁市安居区geoJson地图3d地图自定义贴图-绿色地面实例代码