526互联

和手机相处的时光

发布时间 2023-06-05 15:57:33作者: GTK

习题链接

和手机相处的时光

任务

修复bug，修改坐标轴，将X轴设置为题目要求的

分类 ：ECharts

关键点

  1. xAxis属性 / yAxis
    1. 设置type属性，一般是value
    2. data:[显示到X轴中的数据]
    3. 将type设置为categroy，将可以使用data设置自定义的数据
  2. series中是存放的要显示的图表数据
    1. 也有type属性可以设置成line、bar、pie等等
    2. 该属性下的data属性就是显示的图表数据

代码实现 && 完整的代码

  1. 完整code
    var option = {
  title: {
    text: "一周的手机使用时长",
  },
  xAxis: {
    type: "category",
    data: ["周一", "周二", "周三", "周四", "周五", "周六", "周日"],
  },
  yAxis: {
    type: "value",
  },
  series: [
    {
      data: [2.5, 2, 2.6, 3.2, 4, 6, 5],
      type: "line",
    }, 
  ],
};