VisActor / VChart

VChart, more than just a cross-platform charting library, but also an expressive data storyteller.
https://www.visactor.io/vchart
MIT License
982 stars 71 forks source link

[Bug] 当仅有一条数据时,缩略轴的label存在问题 #3199

Closed H-Sven closed 1 month ago

H-Sven commented 2 months ago

Version

1.12.2

Link to Minimal Reproduction

https://www.visactor.io/vchart/demo/data-zoom/state-with-data?version=1.12.2

Steps to Reproduce

const spec = {
  color: [
    '#3855df',
    '#ffc52b',
    '#5ecf78',
    '#fb7a00',
    '#0acffd',
    '#217dfd',
    '#98dd61',
    '#3150e0',
    '#714efd',
    '#0bcfff',
    '#3d0dde',
    '#ffc527',
    '#f5c13f',
    '#fb7a08',
    '#95d8fd'
  ],
  type: 'rangeColumn',
  direction: 'horizontal',
  yField: 'type',
  minField: 'start_time',
  maxField: 'end_time',
  seriesField: 'color',
  dataZoom: [
    {
      orient: 'bottom',
      height: 20,
      start: 0,
      end:100,
      filterMode: 'axis',
      brushSelect: false,
      startText: {
        formatMethod: text => Math.floor(text)
      },
      endText: {
        formatMethod: text => Math.floor(text)
      }
    }
  ],
  axes: [
    { orient: 'left', type: 'band', bandPadding: 0.5, visible: false },
    {
      type: 'time',
      orient: 'bottom',
      layers: [
        {
          tickStep: 28800,
          timeFormat: '%Y%m%d %H:%M'
        }
      ]
    }
  ],
  title: {
    textStyle: {
      character: [
        {
          text: 'Time-Consuming Distribution',
          fontWeight: 400,
          fill: '#222'
        },
        {
          text: 'Show the SQL distribution of TOP 100',
          fontWeight: 200,
          fontSize: 10,
          fill: '#555'
        }
      ]
    }
  },
  tooltip: {
    visible: true,
    dimension: {
      visible: false
    },
    mark: {
      title: {
        key: 'Query ID',
        value: datum => 'Query ID: ' + datum['id']
      },
      content: [
        {
          key: 'Time Consuming',
          value: datum => datum['useTime']
        },
        {
          key: 'start time',
          value: datum => datum['start_time']
        },
        {
          key: 'end time',
          value: datum => datum['end_time']
        }
      ]
    }
  },
  data: [
    {
      id: 'data0',
      values: [
        {
          start_time: 1681945200,
          end_time: 1681956000,
          type: 'TOP 9',
          color: 'K',
          id: 'a90292870-9282',
          useTime: '100ms'
        }
      ].reverse()
    }
  ]
};

const vchart = new VChart(spec, { dom: CONTAINER_ID, animation: false });
vchart.renderSync();

// Just for the convenience of console debugging, DO NOT COPY!
window['vchart'] = vchart;

Current Behavior

image

缩略轴的开始和结束时间都是固定的值,无论如何拖动,值都不会变

Expected Behavior

拖动轴,数据更新

Environment

- OS:
- Browser:
- Framework:

Any additional comments?

No response

H-Sven commented 2 months ago

@xile611 紧急!! 昨天都还好好的

xile611 commented 2 months ago

@skie1997 帮忙看看

xile611 commented 2 months ago

@xile611 紧急!! 昨天都还好好的

不要所有的问题都紧急哦,开源项目也只是大家工作的一部分,而且还有不少前置任务进行中的

如果非常紧急:可以尝试回退到“昨天”的版本

PS: 也可以尝试排查一下问题,参与开源贡献,开源需要大家的力量

H-Sven commented 2 months ago

@xile611 紧急!! 昨天都还好好的

不要所有的问题都紧急哦,开源项目也只是大家工作的一部分,而且还有不少前置任务进行中的

如果非常紧急:可以尝试回退到“昨天”的版本

PS: 也可以尝试排查一下问题,参与开源贡献,开源需要大家的力量

好的好的, 实际上昨天的版本也存在这个问题,我试了一下,好像所有版本都存在这个问题, 一直没有测试过一条数据的情况,所以没有发现这个问题