我的账户
猩码学苑

专注C++开发菁英教育

亲爱的游客,欢迎!

已有账号,请

如尚未注册?

前端-可视化图表的使用_汪刚_2023.06.05

[复制链接]
霁后彩虹O 发表于 2023-6-14 00:10:36 | 显示全部楼层 |阅读模式 打印 上一主题 下一主题
今日学习内容:

1.引入地图
1.首先从Echarts官网下载相关地图的json文件,选择菜单栏的下载,地图下载功能。找到需要下载的地图。
2.打开刚刚下载的json文件,我们看到是一串json格式的文件,里面包含地图里面各元素的属性及维度信息。
3.创建一个js文件,在初始化函数中加入下内容,其中在echarts.registerMap变量中,第一个变量是地图的名字,第二个参数是json文件里面的内容。
4.导入相关的js文件,Echarts相关的js文件以及刚刚创建的js文件都需要引入到项目中。
5.在地图的相关配置js代码中,series变量中包含很多属性,其中map属性的值是刚刚echarts.registerMap中第一个变量的值。
`geo:  geo: {`​                `type: 'map',`​                `map: 'chinaMap',`​                `zoom: 1.5,`​                `label: {`​                    `show: true,`​                `}`​            `},`​            `series: [`​                `{`​                    `data: personNum,`​                    `geoIndex: 0,`​                    `type: 'map'`​                `},   //添加散点`​                `{`​                    `// 散点坐标`​                    `data: [`​                        `{ value: [117.000923, 36.675807] },`​                        `{ value: [104.065735, 30.659462] },`​                        `{ value: [87.617733, 43.792818] }`​                    `],`​                    `type: 'effectScatter', //涟漪动画`​                    `coordinateSystem: 'geo', //散点使用的坐标系统
6.Echarts地图的展示,我们通过动态加载数据,呈现地图的相关数据,发现地图进行了相关加载。


回复

使用道具 举报

关注0

粉丝0

帖子59

发布主题
大家都在学
课堂讨论
一周热帖排行最近7x24小时热帖
关注我们
专注C++菁英教育

客服电话:18009298968

客服时间:9:00-21:00

猩码学苑 - 专注C++开发菁英教育!( 陕ICP备2025058934号-1 )

版权所有 © 陕西菁英数字科技有限公司 2023-2026