Search code examples
javascriptchartsvisualizationecharts

Apache Echarts YAxis ticks not visible when XAxis value is below zero

I'm facing an issue with Apache Echarts where the YAxis ticks are not visible when the XAxis value is below zero. A dark line is visible at the XAxis value 0 with axis ticks, which is also not expected.

I have tried adjusting the interval property of the axisLabel option for the YAxis and setting containLabel to true in the grid option, but none of these solutions have worked.

I have created a minimal example on the Apache Echarts official website to reproduce the issue. You can find it here: Reproduction Example

I would appreciate any help or suggestions on how to make the YAxis ticks visible when the XAxis value is below zero in Apache Echarts.

Thank you!

Solution

  • If I understand your problem correctly and you are bothered that the axisLine of your yAxis is on zero, you just need to set axisLine: {onZero: false}.

    Here is your adjusted example:

    option = {
  xAxis: {
    min: -10
  },
  yAxis: { axisLine: { onZero: false } },
  series: [
    {
      data: [
        [-10, 40],
        [50, 100],
        [40, 20]
      ],
      type: 'line'
    }
  ]
};