echarts汉中市洋县geoJson地图 tooltip轮播效果实例

geoJson2 yekong 117℃

可视化大屏 项目中经常需要渲染echarts地图,为了不同城市快速实现,将不同城市的echarts地图效果整理出来,今天为大家整理汉中市洋县echarts地图和threejs地图效果实例。地图基于geoJson数据绘制。

echarts汉中市洋县geoJson地图 tooltip轮播

echarts地图实现类似tooltip轮播效果,通过effectScatter实现浮窗,并通过定时修改effectScatter的data来实现浮窗的移动.

echarts汉中市洋县geoJson地图 tooltip轮播

echarts汉中市洋县geoJson地图区域闪烁

echarts地图有时候为了突出某一块区域的重要性,会进行两个颜色的交替变化来告诉用户这一块需要重点关注,我们可以通过echarts的dispatchAction来实现我们想要的效果.

echarts汉中市洋县geoJson地图区域闪烁

echarts汉中市洋县geoJson地图3d地图自定义贴图-绿色地面

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

echarts汉中市洋县geoJson地图3d地图自定义贴图-绿色地面

threejs汉中市洋县geoJson地图3d地图添加描边效果

通过threejs绘制3d地图使用outlinePass 实现发光描边效果,如果对threejs感兴趣,可以观看threejs课程视频 WebGL前端3D可视化教程

threejs汉中市洋县geoJson地图3d地图添加描边效果

threejs汉中市洋县geoJson地图3d地图鼠标移入显示标签并高亮

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

threejs汉中市洋县geoJson地图3d地图鼠标移入显示标签并高亮

threejs汉中市洋县geoJson地图3d地图CSS3D标签

通过threejs绘制的3d地图CSS3D标签实例,CSS3D不面向摄像机,跟随场景缩放,可以通过rotateY调整角度,通过scale调整大小 Vue3 threejs 在3d地图中绘制css3d标签标注省份

threejs汉中市洋县geoJson地图3d地图CSS3D标签

汉中市洋县 下辖有 洋州街道办事处,纸坊街道办事处,戚氏街道办事处,龙亭镇,谢村镇,马畅镇,溢水镇,磨子桥镇,黄家营镇,黄安镇,黄金峡镇,槐树关镇,金水镇,华阳镇,茅坪镇,八里关镇,桑溪镇,关帝镇

汉中市洋县下辖区域坐标

{"洋州街道办事处":[107.57130444416447,33.23273229616696],"纸坊街道办事处":[107.56487636205961,33.31860843234926],"戚氏街道办事处":[107.48877601614205,33.25277503929454],"龙亭镇":[107.65202389001959,33.27562314069427],"谢村镇":[107.42776386740893,33.20105627298298],"马畅镇":[107.36282025720021,33.23828200755958],"溢水镇":[107.40040931721089,33.38302417989181],"磨子桥镇":[107.493424899391,33.13060947134026],"黄家营镇":[107.69968160301136,33.13042492912844],"黄安镇":[107.59804899414382,33.12436660784469],"黄金峡镇":[107.86920150146891,33.19492461220352],"槐树关镇":[107.72965886669519,33.32117873181133],"金水镇":[107.84954663278819,33.34422802257512],"华阳镇":[107.42995702723924,33.61063102072023],"茅坪镇":[107.6512286662161,33.50087843480078],"八里关镇":[107.58245346361846,33.44442463072883],"桑溪镇":[107.95784654124836,33.25431068948585],"关帝镇":[107.4649938848544,33.42365696437962]}

汉中市洋县行政划分代码

[{"name":"洋州街道办事处","code":""},{"name":"纸坊街道办事处","code":""},{"name":"戚氏街道办事处","code":""},{"name":"龙亭镇","code":"610723103000"},{"name":"谢村镇","code":"610723104000"},{"name":"马畅镇","code":"610723105000"},{"name":"溢水镇","code":"610723107000"},{"name":"磨子桥镇","code":"610723108000"},{"name":"黄家营镇","code":"610723109000"},{"name":"黄安镇","code":"610723110000"},{"name":"黄金峡镇","code":"610723111000"},{"name":"槐树关镇","code":"610723112000"},{"name":"金水镇","code":"610723113000"},{"name":"华阳镇","code":"610723114000"},{"name":"茅坪镇","code":"610723115000"},{"name":"八里关镇","code":"610723119000"},{"name":"桑溪镇","code":"610723120000"},{"name":"关帝镇","code":"610723121000"}]

说明

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

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

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

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

汉中市洋县echarts地图效果实例和threejs地图效果实例下载

相关文件下载地址
此资源需支付 ¥10 后下载
支付宝购买扫右侧红包码购买更优惠,如无法下载请联系微信:17331886870
喜欢 (0)
echarts汉中市洋县geoJson地图 tooltip轮播效果实例