Echarts使用之

您所在的位置:网站首页 美国人均寿命变化图 Echarts使用之

Echarts使用之

2024-06-13 18:39| 来源: 网络整理| 查看: 265

根据功能实现效果如下:

Echarts 散点图使用

我们现在有个功能是根据学生的玩耍时长,每个月,学生分数,以及玩耍器材的时长数展示.在echarts中.他们的散点图的各国人均寿命与GDP关系演变也是有4个属性来控制,我们决定使用这个来展示.官方实例地址 在官方实例中,最开始就去请求了一个地址.来获取数据

$.get('data/asset/data/life-expectancy.json', function (data) {}

F12查看请求的数据格式.格式如下

在一个对象中,有三个属性,第一个和第三个分别了封装了19国家以及81个年份.都是以数组形式 在第二个参数中,封装的就挺复杂的.首先外面是一个大的数组.有81个元素.这个应该是根据年份的数量来决定的. 其中每个元素里面有19个小元素,这个应该是19个国家的数量来决定的. 剩下最里面的就是单个年份,单个国家里面应该包含的数据. 下面就我已经测出来控制的属性,做下注释

var itemStyle = { normal: { opacity: 0.8, //控制圆球的透明度 shadowBlur: 10, // shadowOffsetX: 0, shadowOffsetY: 0, shadowColor: 'rgba(0, 0, 0, 0.5)' } }; var sizeFunction = function (x) { var y = Math.sqrt(x / 5e8) + 0.1; return y * 80; }; 控制圆球的大小,返回的数值根据y轴的大小范围进行变化.根据自身元素动态调整该函数 // Schema: //设置一个圆需要展现的数据,如果有更好的方式可以替换 var schema = [ {name: 'Income', index: 0, text: '人均收入', unit: '美元'}, {name: 'LifeExpectancy', index: 1, text: '人均寿命', unit: '岁'}, {na


【本文地址】


今日新闻


推荐新闻


CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3