echarts南阳市邓州市geoJson地图 tooltip轮播演示实例

echarts yekong

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

邓州市,河南省辖县级市,南阳市代管,是国务院确定的丹江口库区区域中心城市,地处河南省西南部,介于北纬32°22′~32°59′,东经111°37′~111°20′之间,总面积2369平方千米。邓州市属亚热带季风型大陆性气候。截至2020年6月,邓州市下辖3个街道、21个镇、3个乡,市政府驻花洲街道。 根据第七次人口普查数据,截至2020年11月1日零时,邓州常住人口为1247807人。

echarts南阳市邓州市geoJson地图 tooltip轮播

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

echarts南阳市邓州市geoJson地图 tooltip轮播

echarts南阳市邓州市geoJson地图全局颜色渐变

echarts地图渲染时,除了局部区域渐变外也会遇到整个地图的颜色渐变效果,我们可以通过areaColor的linear-gradient来实现我们想要的效果

echarts南阳市邓州市geoJson地图全局颜色渐变

echarts南阳市邓州市geoJson地图自定义引导线

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

echarts南阳市邓州市geoJson地图自定义引导线

threejs南阳市邓州市geoJson地图3d地图CSS2D外加旋转棱锥

通过threejs绘制3d地图CSS2D外加旋转棱锥效果,如果想系统的学习threejs的话,可以观看threejs课程视频 WebGL 3D可视化教程

threejs南阳市邓州市geoJson地图3d地图CSS2D外加旋转棱锥

threejs南阳市邓州市geoJson地图3d地图添加旋转棱锥

通过threejs绘制3d地图并在指定经纬度上添加带波纹效果不停旋转的棱锥效果实例,如果想系统的学习threejs的话,可以观看threejs视频 Three.js 3D可视化

threejs南阳市邓州市geoJson地图3d地图添加旋转棱锥

threejs南阳市邓州市geoJson地图3d地图CSS3D标签

通过threejs绘制的3d地图CSS3D标签实例,CSS3D不面向摄像机,跟随场景缩放,可以通过rotateY调整角度,通过scale调整大小,如果想系统的学习threejs的话,可以观看threejs视频 Three.js视频教程3D可视化

threejs南阳市邓州市geoJson地图3d地图CSS3D标签

南阳市邓州市下辖有白牛镇,花洲街道,南阳市黄牛良种繁育场,九龙镇,十林镇,刘集镇,夏集乡,孟楼镇,古城街道,张村镇,张楼乡,裴营乡,彭桥镇,文渠乡,构林镇,林扒镇,桑庄镇,汲滩镇,陶营乡,穰东镇,罗庄镇,腰店镇,赵集镇,都司镇,高集乡,龙堰乡,小杨营乡,湍河街道,杏山旅游管理区杏山街道

南阳市邓州市下辖区域坐标

{"白牛镇":[112.21296428297171,32.73862123694512],"花洲街道":[112.10058892489386,32.68434993563278],"南阳市黄牛良种繁育场":[112.14665913382917,32.46583783992253],"九龙镇":[111.8717911194793,32.73863702335701],"十林镇":[111.85390691936982,32.89479436919986],"刘集镇":[112.21096482869731,32.46441015109237],"夏集乡":[112.12908932761484,32.82257987728769],"孟楼镇":[111.82807146645288,32.54640221531662],"古城街道":[112.05629979220826,32.68247780972127],"张村镇":[111.8745563075384,32.83083523603013],"张楼乡":[112.14214401887116,32.7252563633194],"裴营乡":[112.04353045386641,32.76993722697257],"彭桥镇":[111.8041685853589,32.62133401407755],"文渠乡":[111.9654739456933,32.74633243098088],"构林镇":[112.11445767671871,32.47535613286045],"林扒镇":[111.89814773838378,32.56723352240158],"桑庄镇":[112.21961070147356,32.59113259110541],"汲滩镇":[112.28767366309489,32.73318856496245],"陶营乡":[111.99326662947965,32.59010037032319],"穰东镇":[112.26413819213874,32.83277258436286],"罗庄镇":[111.93081727412056,32.94550537914502],"腰店镇":[112.20453812273647,32.64789357039702],"赵集镇":[111.99587073573304,32.85562205582647],"都司镇":[112.01893137593865,32.51463451778417],"高集乡":[111.93998963222651,32.65801774891406],"龙堰乡":[112.08189481017544,32.60678992773271],"小杨营乡":[112.23068517086952,32.52882670707957],"湍河街道":[112.10072053463196,32.65756285063293],"杏山旅游管理区杏山街道":[111.69498587726287,32.62779329623257]}

南阳市邓州市echarts地图效果实例和threejs地图效果实例下载

相关文件下载地址
此资源需支付 ¥10 后下载
支付宝购买扫右侧红包码购买更优惠,如无法下载请联系微信:17331886870
喜欢
echarts南阳市邓州市geoJson地图 tooltip轮播演示实例