Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Bug] 时间轴-数据为时间的显示问题 #16663

Closed
ITchenjian opened this issue Mar 10, 2022 · 5 comments
Closed

[Bug] 时间轴-数据为时间的显示问题 #16663

ITchenjian opened this issue Mar 10, 2022 · 5 comments
Labels
bug duplicate pending We are not sure about whether this is a bug/new feature.

Comments

@ITchenjian
Copy link

ITchenjian commented Mar 10, 2022

Version

5.3.0

Link to Minimal Reproduction

No response

Steps to Reproduce

option = {
  title: {
    text: 'World Population'
  },
  tooltip: {
    trigger: 'axis',
    axisPointer: {
      type: 'shadow'
    }
  },
  legend: {},
  grid: {
    left: '3%',
    right: '4%',
    bottom: '3%',
    containLabel: true
  },
  xAxis: {
    type: 'time',
    minInterval: 3600 * 24 * 1000,
    axisLabel : {
        color:'#3D3F4B',
        interval: 0,
        formatter: (value, index) => {
            var date = new Date(value);
            var texts = [(date.getMonth() + 1), date.getDate()];
            return texts.join('-');
        }
    },
    axisLine:{
        show:true,
    },
  },
  yAxis: {
    type: 'category',
    data: ['Brazil', 'Indonesia', 'USA', 'India', 'China', 'World']
  },
  series: [
    {
      name: '2011',
      type: 'bar',
      label: {
          show: true,
          position: "right",
          formatter: function(params) {
              return '测试1';
          },
          color: '#000',
      },
      data: ['2021/12/16', '2021/12/16', '2021/12/16', '2021/12/16', '2021/12/16', '2021/12/16']
    },
    {
      name: '2012',
      type: 'bar',
      label: {
          show: true,
          position: "right",
          formatter: function(params) {
              return '测试2';
          },
          color: '#000',
      },
      data: ['2021/12/15', '2021/12/15', '2021/12/16', '2021/12/16', '2021/12/16', '2021/12/16']
    }
  ]
};

Current Behavior

x轴为time轴,y为category轴时有如下问题:
x轴的axisLabel,最后一个不显示;
series的label为 '2021/12/15' 也不显示 (更改grid可能会出现,单有些情况也没用)

Expected Behavior

x轴的axisLabel 和 series的label 正确显示

Environment

- OS:
- Browser:
- Framework:

Any additional comments?

No response

@ITchenjian ITchenjian added the bug label Mar 10, 2022
@echarts-bot echarts-bot bot added pending We are not sure about whether this is a bug/new feature. waiting-for: community labels Mar 10, 2022
@echarts-bot
Copy link

echarts-bot bot commented Mar 10, 2022

@ITchenjian It seems you are not using English, I've helped translate the content automatically. To make your issue understood by more people and get helped, we'd like to suggest using English next time. 🤗

TRANSLATED

TITLE

[Bug] Timeline - the display problem of data as time

@jiawulin001
Copy link
Member

针对x轴不显示最后一个label的问题,只需要设置xAxis.axisLabel.showMaxLabel为true即可显示;
第二个问题当series的label为2021/12/15时不显示,我理解是因为label太长导致超出画布,只能部分显示,可以选择把position设为空使其显示在bar上,也可以设置为left让它显示在坐标轴左侧。

@ITchenjian
Copy link
Author

@jiawulin001 谢谢你的回答,第一个问题用xAxis.axisLabel.showMaxLabel为true可以解决;
第二个问题不是label太长的原因,2021/12/15这条数据在X轴上(x轴起始坐标为2021/12/15)对应的刻度为2021/12/15 - 2021/12/15 ,也就是在贴合在y轴上,相当于长度为0,在这种情况下series的label (测试2) 不显示;
可以把代码贴到这下面试一下(替换原有配置),观察第一二条数据其series的label
https://echarts.apache.org/examples/zh/editor.html?c=bar-y-category&version=5.3.1
如下图所示:
image

@plainheart
Copy link
Member

这个是不是和 #16666 是同一个问题?

@yulitg2110
Copy link

I have the same issue. The height of the time bar is 0.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug duplicate pending We are not sure about whether this is a bug/new feature.
Projects
None yet
Development

No branches or pull requests

4 participants