首页 前端知识 Echarts,Y轴坐标数据差距过大,导致页面显示不明显的解决办法

Echarts,Y轴坐标数据差距过大,导致页面显示不明显的解决办法

2024-01-26 10:01:26 前端知识 前端哥 570 856 我要收藏

在这里插入图片描述

email为9的数据和第二条为100的数据, 是一条直线了,无法看出趋势。
解决办法:

 series: [
    {
      name: 'email',
      type: 'line',
      stack: 'Total',
      data: [9, 100]
    },
    {
      name: 'money',
      type: 'line',
      stack: 'Total',
      data: [11515923.96, 466488.68],
      yAxisIndex: 1
    }
  ]

如果【series】里设置了yAxisIndex: 1,之后
报错:Filed to run code TypeError: Cannot read properties of undefined (reading 'get'), 页面也显示不出来

参考:

这个错误通常是由于没有正确定义yAxis导致的。请确保您已经正确地定义了yAxis。

例如,您可以在option中添加以下代码来定义yAxis:

yAxis: [
    {
        type: 'value',
    },
    {
        type: 'value',
        yAxisIndex: 1,
    }
]

其中,第一个yAxis为默认的y轴,第二个yAxis的yAxisIndex为1,表示将其绑定到series中设置了yAxisIndex: 1的数据系列。

在这里插入图片描述

yAxisIndex要放在数据值较多的系列上

转载请注明出处或者链接地址:https://www.qianduange.cn//article/459.html
标签
echarts
评论
发布的文章

CSS3新增样式

2024-02-05 11:02:24

jQuery的介绍

2024-02-05 11:02:21

大家推荐的文章
会员中心 联系我 留言建议 回顶部
复制成功!