antvis/G2

纵坐标设置了 nice,但是纵坐标还是会超过 nice 生成的值 #3180

Rabbitzzc posted onGitHub

  • I have searched the issues of this repository and believe that this is not a duplicate.

https://antv-g2.gitee.io/zh/examples/line/basic#curved

Steps to reproduce

添加如下代码

import { Chart } from '@antv/g2';

const data = [{"name":"2020-12-30","value":0.907105214094002,"type":"AAA","qoqRate":0.00045786914921608357,"complianceRate":1},{"name":"2020-12-31","value":0.9266379593014656,"type":"AAA","qoqRate":0.02153305361271962,"complianceRate":1},{"name":"2021-01-01","value":0.9260768640175285,"type":"AAA","qoqRate":-0.0006055172662687847,"complianceRate":1},{"name":"2021-01-02","value":0.9209378150073224,"type":"AAA","qoqRate":-0.005549268327373791,"complianceRate":1},{"name":"2021-01-03","value":0.9152129593515956,"type":"AAA","qoqRate":-0.006216332484600184,"complianceRate":1},{"name":"2021-01-04","value":0.9047907053406223,"type":"AAA","qoqRate":-0.011387791119519486,"complianceRate":1},{"name":"2021-01-05","value":null,"type":"AAA","qoqRate":-1,"complianceRate":1},{"name":"2020-12-30","value":0.8239451935624185,"type":"CCC","qoqRate":0.005161608066613033,"complianceRate":1},{"name":"2020-12-31","value":0.8405989799032216,"type":"CCC","qoqRate":0.020212250124063136,"complianceRate":1},{"name":"2021-01-01","value":0.8460314379972831,"type":"CCC","qoqRate":0.006462603719417981,"complianceRate":1},{"name":"2021-01-02","value":0.8342193471252589,"type":"CCC","qoqRate":-0.01396176352498868,"complianceRate":1},{"name":"2021-01-03","value":0.8296422079785708,"type":"CCC","qoqRate":-0.0054867333902780535,"complianceRate":1},{"name":"2021-01-04","value":0.8157848324514991,"type":"CCC","qoqRate":-0.01670283333442646,"complianceRate":1},{"name":"2021-01-05","value":null,"type":"CCC","qoqRate":-1,"complianceRate":1},{"name":"2020-12-30","value":0.8934403822984479,"type":"BBB","qoqRate":-0.002276817434297307,"complianceRate":1},{"name":"2020-12-31","value":0.8907321215170766,"type":"BBB","qoqRate":-0.003031271962885884,"complianceRate":1},{"name":"2021-01-01","value":0.8922451162300781,"type":"BBB","qoqRate":0.0016985967794949097,"complianceRate":1},{"name":"2021-01-02","value":0.8948276742404901,"type":"BBB","qoqRate":0.0028944490291231695,"complianceRate":1},{"name":"2021-01-03","value":0.8961061902238373,"type":"BBB","qoqRate":0.0014287845807097188,"complianceRate":1},{"name":"2021-01-04","value":0.9012121000011666,"type":"BBB","qoqRate":0.005697884729547464,"complianceRate":1},{"name":"2021-01-05","value":null,"type":"BBB","qoqRate":-1,"complianceRate":1}];

const chart = new Chart({
  container: 'container',
  autoFit: true,
  height: 500,
});

chart.data(data);
chart.scale({
  name: {
    range: [0, 1],
  },
  value: {
    nice: true,
  },
});

chart.tooltip({
  showCrosshairs: true,
  shared: true,
});

chart.axis('value', {
  label: {
    formatter: (val) => {
      return val * 100  + '%';
    },
  },
});

chart
  .line()
  .position('name*value')
  .color('type')
  .shape('smooth');


chart.render();

可以看到展示效果如下: image 图表生成的纵坐标 max 值,似乎还是比最大值小。

Environment Info
g2 4.1.4
System Macos
Browser chrome

<!-- generated by antv-issue-helper. DO NOT REMOVE -->


把代码如下修改即可,nice 并不能保证生成的 ticks 比最大值大。

chart.scale({
  name: {
    range: [0, 1],
  },
  value: {
    max: 0.98
  },
});
posted by pearmini almost 4 years ago

Fund this Issue

$0.00
Funded

Pull requests